Skip to content

SnackBarBehavior

Defines where a SnackBar appears within a page and how it is positioned relative to bottom UI elements.

Inherits: Enum

Properties

  • FIXED

    Anchors the snack bar to the bottom of the page.

  • FLOATING

    Displays the snack bar as a floating surface above page content.

Examples#

Showcase#

import flet as ft


def main(page: ft.Page):
    page.theme_mode = ft.ThemeMode.DARK
    page.horizontal_alignment = ft.CrossAxisAlignment.CENTER

    def open_snack(behavior: ft.SnackBarBehavior):
        page.show_dialog(
            ft.SnackBar(
                content=ft.Text(f"Behavior: {behavior.name}"),
                behavior=behavior,
                margin=ft.Margin.only(bottom=100),
                action=ft.SnackBarAction(label="Close"),
            )
        )

    def showcase_card(behavior: ft.SnackBarBehavior) -> ft.Container:
        return ft.Container(
            width=300,
            padding=12,
            border=ft.Border.all(1, ft.Colors.RED),
            border_radius=10,
            bgcolor=ft.Colors.SURFACE_CONTAINER_LOW,
            content=ft.Column(
                spacing=8,
                controls=[
                    ft.Text(behavior.name, weight=ft.FontWeight.BOLD),
                    ft.Button(
                        "Open SnackBar",
                        icon=ft.Icons.MESSAGE,
                        on_click=lambda _, b=behavior: open_snack(b),
                    ),
                ],
            ),
        )

    page.appbar = ft.AppBar(title="SnackBarBehavior Showcase")
    page.add(
        ft.Text("Compare snack bar placement: fixed vs floating."),
        ft.Row(
            wrap=True,
            spacing=12,
            expand=True,
            scroll=ft.ScrollMode.AUTO,
            alignment=ft.MainAxisAlignment.CENTER,
            controls=[showcase_card(behavior) for behavior in ft.SnackBarBehavior],
        ),
    )


ft.run(main)

Properties#

FIXED = 'fixed' class-attribute instance-attribute #

Anchors the snack bar to the bottom of the page.

If a NavigationBar is present, the snack bar is shown above it. Other non-fixed content can be pushed upward while the snack bar is visible.

FLOATING = 'floating' class-attribute instance-attribute #

Displays the snack bar as a floating surface above page content.

This mode can overlay bottom widgets, such as a NavigationBar and a bottom-positioned FloatingActionButton.