Skip to content

Chip

Chips are compact, interactive elements used for actions, filtering, or input. They support leading icons, trailing close buttons, and toggle state.

Variants

Class Use case
MorphChip Basic action chip
MorphFilterChip Toggle chip for filter selection
MorphInputChip Represents an input token with a close button

Usage

from morphui.uix.chip import MorphChip, MorphFilterChip

# Action chip
chip = MorphChip(text="Export", on_release=self.export)

# Filter chip (toggleable)
chip = MorphFilterChip(text="In Stock", on_release=self.filter)

# With leading icon
chip = MorphChip(text="Download", leading_icon='download')

morphui.uix.chip

Chip widgets for MorphUI.

Chips are compact interactive elements that represent actions, filter criteria, or user-entered input tokens. All chip variants support leading icons, toggling, and full MorphUI theming.

CLASS DESCRIPTION
MorphChip

Basic action chip.

MorphFilterChip

Toggleable filter chip for multi-select filtering scenarios.

MorphInputChip

Input token chip with a trailing close/remove button.

MorphChip(**kwargs)

Bases: MorphHoverBehavior, MorphRippleBehavior, MorphButtonBehavior, MorphColorThemeBehavior, MorphRoundSidesBehavior, MorphDelegatedThemeBehavior, MorphContentLayerBehavior, MorphInteractionLayerBehavior, MorphSurfaceLayerBehavior, MorphElevationBehavior, MorphIconLabelIconContainer

Morph Chip component.

A chip is a compact element that represents an input, attribute, or action. Chips can contain a leading icon, text, and a trailing icon. They are typically used for filtering, assisting, input and suggestions.

Use the leading_icon and trailing_icon properties to add icons to the chip. The label_text property is used to set the text of the chip.

Inherits from :class:~morphui.uix.container.MorphIconLabelIconContainer which provides the base layout structure and child widget management.

Example

````python from kivy.clock import Clock from morphui.app import MorphApp from morphui.uix.chip import MorphChip from morphui.uix.chip import MorphInputChip from morphui.uix.chip import MorphFilterChip from morphui.uix.floatlayout import MorphFloatLayout

class MyApp(MorphApp): def build(self) -> MorphFloatLayout: self.theme_manager.seed_color = 'morphui_teal' self.theme_manager.switch_to_dark() self.layout = MorphFloatLayout( MorphChip( identity='chip', normal_leading_icon='language-python', normal_trailing_icon='close', label_text='Python Chip', pos_hint={'center_x': 0.5, 'center_y': 0.6}, theme_color_bindings=dict( normal_content_color='primary_color', normal_surface_color='transparent_color', normal_border_color='outline_variant_color',),), MorphFilterChip( identity='filter', label_text='Filter Chip', pos_hint={'center_x': 0.5, 'center_y': 0.5}), MorphInputChip( identity='input_chip', label_text='Input Chip', pos_hint={'center_x': 0.5, 'center_y': 0.4},), theme_color_bindings={ 'normal_surface_color': 'surface_container_low_color',}) self.input_chip = self.layout.identities.input_chip self.input_chip.bind(on_trailing_widget_release=self.re_add_chip) return self.layout

def re_add_chip(self, dt: float) -> None:
    def _re_add(dt):
        if not self.input_chip.parent:
            self.layout.add_widget(self.input_chip)
    Clock.schedule_once(_re_add, 2)

if name == 'main': MyApp().run()

default_child_classes = {'leading_widget': MorphChipLeadingIconLabel, 'label_widget': MorphChipTextLabel, 'trailing_widget': MorphChipTrailingIconButton} class-attribute instance-attribute

Default child widgets for the chip.

This dictionary maps widget identities to their default classes.

default_config = dict(theme_color_bindings=(dict(normal_surface_color='transparent_color', normal_content_color='content_surface_color', normal_border_color='outline_variant_color')), leading_scale_enabled=True, trailing_scale_enabled=True, orientation='horizontal', auto_size=True, padding=[dp(8), dp(4)], spacing=(dp(4)), radius=(dp(8)), round_sides=False) class-attribute instance-attribute

Default configuration for the :class:MorphChip component.

MorphFilterChip(**kwargs)

Bases: MorphToggleButtonBehavior, MorphChip

Morph Filter Chip component.

A filter chip represents a filter option that can be toggled on or off. It is used to apply filters to content or data sets.

Example

````python from morphui.app import MorphApp from morphui.uix.chip import MorphFilterChip from morphui.uix.floatlayout import MorphFloatLayout

class MyApp(MorphApp): def build(self) -> MorphFloatLayout: self.theme_manager.switch_to_dark() return MorphFloatLayout( MorphFilterChip( identity='my_widget', leading_icon='filter',), normal_surface_color=self.theme_manager.surface_color,)

if name == 'main': MyApp().run()

default_config = MorphChip.default_config.copy() | dict(theme_color_bindings=(dict(normal_surface_color='transparent_color', normal_content_color='content_surface_color', normal_border_color='outline_variant_color', active_surface_color='secondary_container_color', active_content_color='content_secondary_container_color', active_border_color='transparent_color', disabled_surface_color='transparent_color', disabled_content_color='outline_color')), normal_leading_icon='', active_leading_icon='check') class-attribute instance-attribute

Default configuration for the :class:MorphFilterChip component.

MorphInputChip(**kwargs)

Bases: MorphChip

Morph Input Chip component.

An input chip represents a user input or selection that can be removed. It typically includes a trailing icon button for removal.

Example

````python from morphui.app import MorphApp from morphui.uix.chip import MorphInputChip from morphui.uix.floatlayout import MorphFloatLayout

class MyApp(MorphApp): def build(self) -> MorphFloatLayout: self.theme_manager.switch_to_dark() return MorphFloatLayout( MorphInputChip( identity='my_widget', label_text='Input Chip', trailing_icon='close',), normal_surface_color=self.theme_manager.surface_color,) if name == 'main': MyApp().run()

default_config = MorphChip.default_config.copy() | dict(normal_trailing_icon='close') class-attribute instance-attribute

Default configuration for the :class:MorphInputChip component.

on_trailing_widget_press(*args)

Handle the press event of the trailing icon button.

This method is called when the trailing icon button is pressed. It can be used to provide visual feedback or initiate actions before the chip is removed.

on_trailing_widget_release(*args)

Handle the release event of the trailing icon button.

This method is called when the trailing icon button is released. It removes the chip from its parent layout.