跳到主要内容

底部导航栏 CupertinoNavigationBar

一个iOS风格的底部导航栏。

导航栏提供了一种持久且方便的方式来在应用内主要目标之间切换。

示例​

Live example

一个简单的CupertinoNavigationBar​

import flet as ft

def main(page: ft.Page):
    page.title = "CupertinoNavigationBar 示例"
    page.navigation_bar = ft.CupertinoNavigationBar(
        bgcolor=ft.colors.AMBER_100,
        inactive_color=ft.colors.GREY,
        active_color=ft.colors.BLACK,
        on_change=lambda e: print("Selected tab:", e.control.selected_index),
        destinations=[
            ft.NavigationDestination(icon=ft.icons.EXPLORE, label="探索"),
            ft.NavigationDestination(icon=ft.icons.COMMUTE, label="通勤"),
            ft.NavigationDestination(
                icon=ft.icons.BOOKMARK_BORDER,
                selected_icon=ft.icons.BOOKMARK,
                label="导航",
            ),
        ]
    )
    page.add(ft.SafeArea(ft.Text("正文！")))


ft.app(target=main)

属性​

active_color​

所选目标的图标和标题的前景颜色。

bgcolor​

CupertinoNavigationBar 本身的颜色。

border​

定义此导航栏的边框。有关可能的值，请参见Container.border。

destinations​

定义在导航栏中排列的按钮项的外观。

该值必须是两个或更多NavigationDestination实例的列表。

icon_size​

所有目标图标的大小。默认为 30。

inactive_color​

未选中目标的图标和标题的前景颜色。

selected_index​

当前选中的NavigationDestination在destinations中的索引，如果没有选中的目标则为None。

事件​

on_change​

当选中的目标发生变化时触发。