SnackBar

Examples#

Basic Example#

--8<-- https://raw.githubusercontent.com/flet-dev/flet/refs/heads/main/sdk/python/examples/controls/snack-bar/basic.py

Counter#

--8<-- https://raw.githubusercontent.com/flet-dev/flet/refs/heads/main/sdk/python/examples/controls/snack-bar/counter.py

SnackBar #

Bases: DialogControl

A lightweight message with an optional action which briefly displays at the bottom of the screen.

action #

action: str | SnackBarAction | None = None

An optional action that the user can take based on the snack bar.

For example, the snack bar might let the user undo the operation that prompted the snackbar. Snack bars can have at most one action.

The action should not be "dismiss" or "cancel".

action_overflow_threshold #

action_overflow_threshold: Number = 0.25

The percentage threshold for action's width before it overflows to a new line.

If the width of the snackbar's content is greater than this percentage of the width of the snackbar minus the width of its action, then the action will appear below the content.

At a value of 0.0, the action will not overflow to a new line.

Note

Must be between 0.0 and 1.0 inclusive.

adaptive #

adaptive: bool | None = None

Enables platform-specific rendering or inheritance of adaptiveness from parent controls.

badge #

badge: BadgeValue | None = None

A badge to show on top of this control.

behavior #

behavior: SnackBarBehavior | None = None

This defines the behavior and location of the snack bar.

Defines where a SnackBar should appear within a page and how its location should be adjusted when the page also includes a FloatingActionButton or a NavigationBar.

If None, SnackBarTheme.behavior is used. If that's is also None, defaults to SnackBarBehavior.FIXED.

Note

If behavior is SnackBarBehavior.FLOATING, the length of the bar is defined by either width and margin, and if both are specified, width takes precedence over margin.
width and margin are ignored if behavior!=SnackBarBehavior.FLOATING.

bgcolor #

bgcolor: ColorValue | None = None

SnackBar background color.

clip_behavior #

clip_behavior: ClipBehavior = HARD_EDGE

The content will be clipped (or not) according to this option.

close_icon_color #

close_icon_color: ColorValue | None = None

The color of the close icon, if show_close_icon is True.

col #

col: ResponsiveNumber = 12

If a parent of this control is a ResponsiveRow, this property is used to determine how many virtual columns of a screen this control will span.

Can be a number or a dictionary configured to have a different value for specific breakpoints, for example col={"sm": 6}.

This control spans the 12 virtual columns by default.

Dimensions

Breakpoint	Dimension
xs	<576px
sm	≥576px
md	≥768px
lg	≥992px
xl	≥1200px
xxl	≥1400px

content #

content: StrOrControl

The primary content of the snack bar.

Typically a Text control.

data #

data: Any = skip_field()

Arbitrary data of any type.

disabled #

disabled: bool = False

Every control has disabled property which is False by default - control and all its children are enabled.

Note

The value of this property will be propagated down to all children controls recursively.

Example

For example, if you have a form with multiple entry controls you can disable them all together by disabling container:

ft.Column(
    disabled = True,
    controls=[
        ft.TextField(),
        ft.TextField()
    ]
)

dismiss_direction #

dismiss_direction: DismissDirection | None = None

The direction in which the SnackBar can be dismissed.

If None, SnackBarTheme.dismiss_direction is used. If that's is also None, defaults to DismissDirection.DOWN.

duration #

duration: DurationValue = field(
    default_factory=lambda: Duration(milliseconds=4000)
)

The amount of time this snack bar should stay open for.

elevation #

elevation: Number | None = None

The z-coordinate at which to place the snack bar. This controls the size of the shadow below the snack bar.

expand #

expand: bool | int | None = None

Specifies whether/how this control should expand to fill available space in its parent layout.

More information here.

Note

Has effect only if the direct parent of this control is one of the following controls, or their subclasses: Column, Row, View, Page.

expand_loose #

expand_loose: bool = False

Allows the control to expand along the main axis if space is available, but does not require it to fill all available space.

More information here.

Note

If expand_loose is True, it will have effect only if:

expand is not None and
the direct parent of this control is one of the following controls, or their subclasses: Column, Row, View, Page.

key #

key: (
    str | int | float | bool | ValueKey | ScrollKey | None
) = None

margin #

margin: MarginValue | None = None

Empty space to surround the snack bar.

Has effect only when behavior=SnackBarBehavior.FLOATING and will be ignored if width is specified.

on_action #

on_action: ControlEventHandler[SnackBar] | None = None

Called when action button is clicked.

on_dismiss #

on_dismiss: ControlEventHandler[DialogControl] | None = None

Called when dialog is dismissed.

on_visible #

on_visible: ControlEventHandler[SnackBar] | None = None

Called the first time that the snackbar is visible within the page.

opacity #

opacity: Number = 1.0

Defines the transparency of the control.

Value ranges from 0.0 (completely transparent) to 1.0 (completely opaque without any transparency).

open #

open: bool = False

Set to True to display this dialog.

padding #

padding: PaddingValue | None = None

The amount of padding to apply to the snack bar's content and optional action.

page #

page: Page | PageView | None

The page (of type Page or PageView) to which this control belongs to.

parent #

parent: BaseControl | None

The direct ancestor(parent) of this control.

It defaults to None and will only have a value when this control is mounted (added to the page tree).

The Page control (which is the root of the tree) is an exception - it always has parent=None.

rtl #

rtl: bool = False

Whether the text direction of the control should be right-to-left (RTL).

shape #

shape: OutlinedBorder | None = None

The shape of this snack bar.

show_close_icon #

show_close_icon: bool = False

Whether to include a "close" icon widget.

Tapping the icon will close the snack bar.

tooltip #

tooltip: TooltipValue | None = None

The tooltip ot show when this control is hovered over.

visible #

visible: bool = True

Every control has visible property which is True by default - control is rendered on the page. Setting visible to False completely prevents control (and all its children if any) from rendering on a page canvas. Hidden controls cannot be focused or selected with a keyboard or mouse and they do not emit any events.

width #

width: Number | None = None

The width of the snack bar.

If width is specified, the snack bar will be centered horizontally in the available space.

Note

Has effect only when behavior is SnackBarBehavior.FLOATING. It can not be used if margin is specified.

before_event #

before_event(e: ControlEvent)

before_update #

before_update()

clean #

clean() -> None

did_mount #

did_mount()

init #

init()

is_isolated #

is_isolated()

update #

update() -> None

will_unmount #

will_unmount()

SnackBarAction #

Bases: Control

A button that can be used as an action in a SnackBar.

An action button for a SnackBar.

Note

Snack bar actions are always enabled. Instead of disabling a snack bar action, avoid including it in the snack bar in the first place.
Snack bar actions can will only respond to first click. Subsequent clicks/presses are ignored.

badge #

badge: BadgeValue | None = None

A badge to show on top of this control.

bgcolor #

bgcolor: ColorValue | None = None

The button background fill color.

If None, SnackBarTheme.action_bgcolor is used.

col #

col: ResponsiveNumber = 12

If a parent of this control is a ResponsiveRow, this property is used to determine how many virtual columns of a screen this control will span.

Can be a number or a dictionary configured to have a different value for specific breakpoints, for example col={"sm": 6}.

This control spans the 12 virtual columns by default.

Dimensions

Breakpoint	Dimension
xs	<576px
sm	≥576px
md	≥768px
lg	≥992px
xl	≥1200px
xxl	≥1400px

data #

data: Any = skip_field()

Arbitrary data of any type.

disabled #

disabled: bool = False

Every control has disabled property which is False by default - control and all its children are enabled.

Note

The value of this property will be propagated down to all children controls recursively.

Example

For example, if you have a form with multiple entry controls you can disable them all together by disabling container:

ft.Column(
    disabled = True,
    controls=[
        ft.TextField(),
        ft.TextField()
    ]
)

disabled_bgcolor #

disabled_bgcolor: ColorValue | None = None

The button disabled background color. This color is shown after the action is dismissed.

If None, SnackBarTheme.disabled_action_bgcolor is used.

disabled_text_color #

disabled_text_color: ColorValue | None = None

The button disabled label color. This color is shown after the action is dismissed.

expand #

expand: bool | int | None = None

Specifies whether/how this control should expand to fill available space in its parent layout.

More information here.

Note

Has effect only if the direct parent of this control is one of the following controls, or their subclasses: Column, Row, View, Page.

expand_loose #

expand_loose: bool = False

Allows the control to expand along the main axis if space is available, but does not require it to fill all available space.

More information here.

Note

If expand_loose is True, it will have effect only if:

expand is not None and
the direct parent of this control is one of the following controls, or their subclasses: Column, Row, View, Page.

key #

key: (
    str | int | float | bool | ValueKey | ScrollKey | None
) = None

label #

label: str

The button's label.

on_click #

on_click: ControlEventHandler[SnackBarAction] | None = None

Called when this action button is clicked.

opacity #

opacity: Number = 1.0

Defines the transparency of the control.

Value ranges from 0.0 (completely transparent) to 1.0 (completely opaque without any transparency).

page #

page: Page | PageView | None

The page (of type Page or PageView) to which this control belongs to.

parent #

parent: BaseControl | None

The direct ancestor(parent) of this control.

It defaults to None and will only have a value when this control is mounted (added to the page tree).

The Page control (which is the root of the tree) is an exception - it always has parent=None.

rtl #

rtl: bool = False

Whether the text direction of the control should be right-to-left (RTL).

text_color #

text_color: ColorValue | None = None

The button label color.

If None, SnackBarTheme.action_text_color is used.

tooltip #

tooltip: TooltipValue | None = None

The tooltip ot show when this control is hovered over.

visible #

visible: bool = True

Every control has visible property which is True by default - control is rendered on the page. Setting visible to False completely prevents control (and all its children if any) from rendering on a page canvas. Hidden controls cannot be focused or selected with a keyboard or mouse and they do not emit any events.

before_event #

before_event(e: ControlEvent)

before_update #

before_update()

clean #

clean() -> None

did_mount #

did_mount()

init #

init()

is_isolated #

is_isolated()

update #

update() -> None

will_unmount #

will_unmount()