菜单栏
菜单栏管理级联子菜单。
它可以放在任何地方,但通常位于应用程序主体的上方,并定义了一个菜单系统,以回应用户选择菜单项的回调。
示例
- Python
import flet as ft
def main(page: ft.Page):
appbar_text_ref = ft.Ref[ft.Text]()
def handle_menu_item_click(e):
print(f"{e.control.content.value}.on_click")
page.open(ft.SnackBar(content=ft.Text(f"{e.control.content.value} was clicked!")))
appbar_text_ref.current.value = e.control.content.value
page.update()
def handle_submenu_open(e):
print(f"{e.control.content.value}.on_open")
def handle_submenu_close(e):
print(f"{e.control.content.value}.on_close")
def handle_submenu_hover(e):
print(f"{e.control.content.value}.on_hover")
page.appbar = ft.AppBar(
title=ft.Text("Menus", ref=appbar_text_ref),
center_title=True,
bgcolor=ft.colors.BLUE,
)
menubar = ft.MenuBar(
expand=True,
style=ft.MenuStyle(
alignment=ft.alignment.top_left,
bgcolor=ft.colors.RED_300,
mouse_cursor={
ft.ControlState.HOVERED: ft.MouseCursor.WAIT,
ft.ControlState.DEFAULT: ft.MouseCursor.ZOOM_OUT,
},
),
controls=[
ft.SubmenuButton(
content=ft.Text("File"),
on_open=handle_submenu_open,
on_close=handle_submenu_close,
on_hover=handle_submenu_hover,
controls=[
ft.MenuItemButton(
content=ft.Text("About"),
leading=ft.Icon(ft.icons.INFO),
style=ft.ButtonStyle(
bgcolor={ft.ControlState.HOVERED: ft.colors.GREEN_100}
),
on_click=handle_menu_item_click,
),
ft.MenuItemButton(
content=ft.Text("Save"),
leading=ft.Icon(ft.icons.SAVE),
style=ft.ButtonStyle(
bgcolor={ft.ControlState.HOVERED: ft.colors.GREEN_100}
),
on_click=handle_menu_item_click,
),
ft.MenuItemButton(
content=ft.Text("Quit"),
leading=ft.Icon(ft.icons.CLOSE),
style=ft.ButtonStyle(
bgcolor={ft.ControlState.HOVERED: ft.colors.GREEN_100}
),
on_click=handle_menu_item_click,
),
],
),
ft.SubmenuButton(
content=ft.Text("View"),
on_open=handle_submenu_open,
on_close=handle_submenu_close,
on_hover=handle_submenu_hover,
controls=[
ft.SubmenuButton(
content=ft.Text("Zoom"),
controls=[
ft.MenuItemButton(
content=ft.Text("Magnify"),
leading=ft.Icon(ft.icons.ZOOM_IN),
close_on_click=False,
style=ft.ButtonStyle(
bgcolor={
ft.ControlState.HOVERED: ft.colors.PURPLE_200
}
),
on_click=handle_menu_item_click,
),
ft.MenuItemButton(
content=ft.Text("Minify"),
leading=ft.Icon(ft.icons.ZOOM_OUT),
close_on_click=False,
style=ft.ButtonStyle(
bgcolor={
ft.ControlState.HOVERED: ft.colors.PURPLE_200
}
),
on_click=handle_menu_item_click,
),
],
)
],
),
],
)
page.add(ft.Row([menubar]))
ft.app(main)
属性
clip_behavior
是否剪辑该控件的内容。属性值是 ClipBehavior
。
默认为 NONE
。
controls
菜单栏的顶级子菜单项列表。
style
该值是一个 MenuStyle
类的实例。