ExpansionPanel#
#
Expansion panels contain creation flows and allow lightweight editing of an element.
Usage#
MDExpansionPanel:
MDExpansionPanelHeader:
# Content of header.
[...]
MDExpansionPanelContent:
# Content of panel.
[...]
Anatomy#
Example#
from kivy.lang import Builder
from kivy.uix.behaviors import ButtonBehavior
from kivymd.app import MDApp
from kivymd.uix.behaviors import RotateBehavior
from kivymd.uix.expansionpanel import MDExpansionPanel
from kivymd.uix.list import MDListItemTrailingIcon
KV = '''
MDScreen:
md_bg_color: self.theme_cls.backgroundColor
MDExpansionPanel:
id: panel
pos_hint: {"center_x": .5, "center_y": .5}
MDExpansionPanelHeader:
MDListItem:
theme_bg_color: "Custom"
md_bg_color: self.theme_cls.surfaceContainerLowColor
ripple_effect: False
MDListItemSupportingText:
text: "Supporting text"
TrailingPressedIconButton:
id: chevron
icon: "chevron-right"
on_release: app.tap_expansion_chevron(panel, chevron)
MDExpansionPanelContent:
orientation: "vertical"
padding: "12dp", 0, "12dp", 0
MDLabel:
text: "Channel information"
adaptive_height: True
padding_x: "16dp"
padding_y: "12dp"
MDListItem:
MDListItemLeadingIcon:
icon: "email"
MDListItemHeadlineText:
text: "Email"
MDListItemSupportingText:
text: "kivydevelopment@gmail.com"
MDListItem:
MDListItemLeadingIcon:
icon: "instagram"
MDListItemHeadlineText:
text: "Instagram"
MDListItemSupportingText:
text: "Account"
MDListItemTertiaryText:
text: "www.instagram.com/KivyMD"
'''
class TrailingPressedIconButton(
ButtonBehavior, RotateBehavior, MDListItemTrailingIcon
):
...
class Example(MDApp):
def build(self):
self.theme_cls.theme_style = "Dark"
return Builder.load_string(KV)
def tap_expansion_chevron(
self, panel: MDExpansionPanel, chevron: TrailingPressedIconButton
):
panel.open() if not panel.is_open else panel.close()
panel.set_chevron_down(
chevron
) if not panel.is_open else panel.set_chevron_up(chevron)
Example().run()
Use with ScrollView#
import asynckivy
from kivy.animation import Animation
from kivy.lang import Builder
from kivy.metrics import dp
from kivy.uix.behaviors import ButtonBehavior
from kivymd.app import MDApp
from kivymd.uix.behaviors import RotateBehavior
from kivymd.uix.expansionpanel import MDExpansionPanel
from kivymd.uix.list import MDListItemTrailingIcon
KV = '''
<ExpansionPanelItem>
MDExpansionPanelHeader:
MDListItem:
theme_bg_color: "Custom"
md_bg_color: self.theme_cls.surfaceContainerLowColor
ripple_effect: False
MDListItemSupportingText:
text: "Supporting text"
TrailingPressedIconButton:
id: chevron
icon: "chevron-right"
on_release: app.tap_expansion_chevron(root, chevron)
MDExpansionPanelContent:
orientation: "vertical"
padding: "12dp", 0, "12dp", "12dp"
md_bg_color: self.theme_cls.surfaceContainerLowestColor
MDLabel:
text: "Channel information"
adaptive_height: True
padding_x: "16dp"
padding_y: "12dp"
MDListItem:
theme_bg_color: "Custom"
md_bg_color: self.theme_cls.surfaceContainerLowestColor
MDListItemLeadingIcon:
icon: "email"
MDListItemHeadlineText:
text: "Email"
MDListItemSupportingText:
text: "kivydevelopment@gmail.com"
MDListItem:
theme_bg_color: "Custom"
md_bg_color: self.theme_cls.surfaceContainerLowestColor
MDListItemLeadingIcon:
icon: "instagram"
MDListItemHeadlineText:
text: "Instagram"
MDListItemSupportingText:
text: "Account"
MDListItemTertiaryText:
text: "www.instagram.com/KivyMD"
MDScreen:
md_bg_color: self.theme_cls.backgroundColor
ScrollView:
size_hint_x: .5
pos_hint: {"center_x": .5, "center_y": .5}
MDList:
id: container
'''
class ExpansionPanelItem(MDExpansionPanel):
...
class TrailingPressedIconButton(
ButtonBehavior, RotateBehavior, MDListItemTrailingIcon
):
...
class Example(MDApp):
def on_start(self):
async def set_panel_list():
for i in range(12):
await asynckivy.sleep(0)
self.root.ids.container.add_widget(ExpansionPanelItem())
asynckivy.start(set_panel_list())
def build(self):
self.theme_cls.theme_style = "Dark"
return Builder.load_string(KV)
def tap_expansion_chevron(
self, panel: MDExpansionPanel, chevron: TrailingPressedIconButton
):
Animation(
padding=[0, dp(12), 0, dp(12)]
if not panel.is_open
else [0, 0, 0, 0],
d=0.2,
).start(panel)
panel.open() if not panel.is_open else panel.close()
panel.set_chevron_down(
chevron
) if not panel.is_open else panel.set_chevron_up(chevron)
Example().run()
API break#
1.2.0 version#
MDExpansionPanel(
icon="icon.png",
content=Content(), # content of panel
panel_cls=MDExpansionPanelThreeLine( # content of header
text="Text",
secondary_text="Secondary text",
tertiary_text="Tertiary text",
)
)
2.0.0 version#
MDExpansionPanel:
MDExpansionPanelHeader:
# Content of header.
[...]
MDExpansionPanelContent:
# Content of panel.
[...]
API - kivymd.uix.expansionpanel.expansionpanel
#
- class kivymd.uix.expansionpanel.expansionpanel.MDExpansionPanelContent(*args, **kwargs)#
Implements a container for panel content.
Added in version 2.0.0.
For more information, see in the
DeclarativeBehavior
andThemableBehavior
andBackgroundColorBehavior
andBoxLayout
classes documentation.
- class kivymd.uix.expansionpanel.expansionpanel.MDExpansionPanelHeader(*args, **kwargs)#
Implements a container for the content of the panel header.
Added in version 2.0.0.
For more information, see in the
DeclarativeBehavior
andBoxLayout
classes documentation.
- class kivymd.uix.expansionpanel.expansionpanel.MDExpansionPanel(**kwargs)#
Expansion panel class.
For more information, see in the
DeclarativeBehavior
andBoxLayout
classes documentation.- opening_transition#
The name of the animation transition type to use when animating to the
state
‘open’.opening_transition
is aStringProperty
and defaults to ‘out_cubic’.
- opening_time#
The time taken for the panel to slide to the
state
‘open’.opening_time
is aNumericProperty
and defaults to 0.2.
- closing_transition#
The name of the animation transition type to use when animating to the
state
‘close’.closing_transition
is aStringProperty
and defaults to ‘out_sine’.
- closing_time#
The time taken for the panel to slide to the
state
‘close’.closing_time
is aNumericProperty
and defaults to 0.2.
- is_open#
The panel is open or closed.
Added in version 2.0.0.
is_open
is aBooleanProperty
and defaults to False.
- close(*args) None #
Method closes the panel.
Changed in version 2.0.0: Rename from close_panel to close method.
- open(*args) None #
Method opens a panel.
Changed in version 2.0.0: Rename from open_panel to open method.
- add_widget(widget, index=0, canvas=None)#
Add a new widget as a child of this widget.
- Parameters:
- widget:
Widget
Widget to add to our list of children.
- index: int, defaults to 0
Index to insert the widget in the list. Notice that the default of 0 means the widget is inserted at the beginning of the list and will thus be drawn on top of other sibling widgets. For a full discussion of the index and widget hierarchy, please see the Widgets Programming Guide.
Added in version 1.0.5.
- canvas: str, defaults to None
Canvas to add widget’s canvas to. Can be ‘before’, ‘after’ or None for the default canvas.
Added in version 1.9.0.
- widget:
>>> from kivy.uix.button import Button >>> from kivy.uix.slider import Slider >>> root = Widget() >>> root.add_widget(Button()) >>> slider = Slider() >>> root.add_widget(slider)