import panel as pn pn.extension()
Accordion layouts are a type of
Card layout that allows switching between multiple objects by clicking on the corresponding card header. The labels for each card may be defined explicitly as part of a tuple, and otherwise default to the
name parameter of the card’s contents. Like
Tabs has a list-like API that allows interactively updating and modifying the cards using methods
__setitem__ (to replace the contents).
active(list, default=): The indexes of the currently displayed cards. Updates when a card is expanded or collapsed and may also be set to programmatically control which cards are shown.
objects(list): The list of objects to display in the Column. Should not generally be modified directly except when replaced in its entirety.
toggle(bool): Whether to toggle between the available cards, activating only one at a time (if True), or (if False) whether to allow multiple cards to be expanded simultaneously.
active_header_background(str): The background color of the header when the
header_color(str): The color of the header text.
header_background(str): The background color of the header.
For further layout and styling-related parameters see the customization user guide.
Accordion layout can either be instantiated as empty and populated after the fact, or by using a list of objects provided on instantiation as positional arguments. If the objects are not already Panel components they will each be converted to one using the
pn.panel conversion method. Unlike other panel types,
Accordion also accepts tuples to specify the title of each tab; if no name is supplied explicitly the name of the underlying object will be used.
from bokeh.plotting import figure p1 = figure(width=300, height=300, name='Scatter', margin=5) p1.scatter([0, 1, 2, 3, 4, 5, 6], [0, 1, 2, 3, 2, 1, 0]) p2 = figure(width=300, height=300, name='Line', margin=5) p2.line([0, 1, 2, 3, 4, 5, 6], [0, 1, 2, 3, 2, 1, 0]) accordion = pn.Accordion(('Scatter', p1), p2) accordion
The contents of the
Accordion.objects list should never be modified individually, because Panel cannot detect when items in that list have changed internally, and will thus fail to update any already-rendered views of those objects (and their card titles!). Instead, use the provided methods for adding and removing items from the list. The only change that is safe to make directly to
Accordion.objects is to replace the list of
objects entirely. As a simple example of using the methods, we might add an additional widget to the
Accordion using the
p3 = figure(width=300, height=300, name='Square', margin=5) p3.square([0, 1, 2, 3, 4, 5, 6], [0, 1, 2, 3, 2, 1, 0], size=10) accordion.append(p3)
On a live server or in a notebook the
accordion displayed above will dynamically expand to include the new card. To see the effect in a statically rendered page, we will display the accordion a second time:
In addition to being able to modify the
objects using methods we can also get and set the currently
active cards as a list of integers, which will update any rendered views of the object:
print(accordion.active) accordion.active = [0, 2]
When toggle is enabled only one card can be active at the same time, i.e., expanding one card will collapse the other active cards (much like a Tabs layout).