跳到主要内容

横幅

横幅显示一条重要且简明的信息，并为用户提供操作选项以处理（或关闭）横幅。关闭横幅需要用户进行操作。

横幅显示在屏幕顶部，位于顶部应用栏下方。它们是持久的和非模态的，允许用户随时忽略或与之交互。

示例​

实时示例

带有前置图标和操作按钮的横幅​

import flet as ft

def main(page):
    def close_banner(e):
        page.banner.open = False
        page.update()

    page.banner = ft.Banner(
        bgcolor=ft.colors.AMBER_100,
        leading=ft.Icon(ft.icons.WARNING_AMBER_ROUNDED, color=ft.colors.AMBER, size=40),
        content=ft.Text(
            "哎呀，删除文件时发生了一些错误。你想让我做什么？"
        ),
        actions=[
            ft.TextButton("重试", on_click=close_banner),
            ft.TextButton("忽略", on_click=close_banner),
            ft.TextButton("取消", on_click=close_banner),
        ],
    )

    def show_banner_click(e):
        page.banner.open = True
        page.update()

    page.add(ft.ElevatedButton("显示横幅", on_click=show_banner_click))

ft.app(target=main)

属性​

actions​

显示在横幅底部或末尾侧的一组操作按钮。

通常这是TextButton控件的列表。

bgcolor​

横幅表面的颜色。

content​

横幅的内容。通常是一个Text控件。

content_padding​

嵌入内容的空间量。

该值是padding.Padding类的实例或一个数字。

如果操作按钮在内容下方，默认值为 padding.only(left=16.0, top=24.0, right=16.0, bottom=4.0)。

如果操作按钮在内容末尾侧，默认值为 padding.only(left=16.0, top=2.0)。

content_text_style​

用于 content 中 Text 控件的样式。值为TextStyle类型的实例。

divider_color​

分隔线的颜色。

elevation​

横幅的海拔高度。

force_actions_below​

覆盖强制操作按钮位于内容下方，无论有多少按钮。

如果该值为 True，操作按钮将位于内容下方。如果该值为 False，如果操作按钮的长度为 1，按钮将位于内容的末尾侧；如果大于 1，按钮将位于内容下方。

默认为 False。

leading​

横幅的（可选）前置控件。

通常是一个Icon控件。

leading_padding​

嵌入前置控件的空间量。

该值是padding.Padding类的实例或一个数字。

默认为 16 虚拟像素。

margin​

横幅周围的空间量。

该值是margin.Margin类的实例或一个数字。

open​

设置为 True 以显示横幅。

shadow_color​

横幅下方阴影的颜色。

surface_tint_color​

用于指示横幅海拔高度的叠加在 bgcolor 上的颜色。

事件​

on_visible​

当横幅第一次显示或可见时触发。