Page
Page 是 View
控件的容器。
当新的用户会话开始时,会自动创建一个页面实例和根视图。
属性
auto_scroll
如果应自动将滚动条位置移动到末端时为 True
。必须为 False
以使 scroll_to()
方法起作用。
appbar
在页面顶部显示的 AppBar
控件。
banner
banner
在页面顶部显示的 Banner
控件。
在 v0.23.0 中已弃用,并将在 v0.26.0 中删除。请使用 page.overlay.append(banner)
替代。
bgcolor
页面的背景颜色。
颜色值可以是 #ARGB
格式(例如 #FFCC0000
)、#RGB
格式(例如 #CC0000
)的十六进制值,或者是 flet.colors
模块中的命名颜色。
bottom_appbar
在页面底部显示的 BottomAppBar
控件。如果同时提供了 bottom_appbar
和 navigation_bar
属性,则会显示 NavigationBar
。
bottom_sheet
bottom_sheet
显示的 BottomSheet
控件。
在 v0.23.0 中已弃用,并将在 v0.26.0 中删除。请使用 page.overlay.append(bottom_sheet)
替代。
浏览器上下文菜单
用于启用或禁用用户在网页上右键单击时出现的上下文菜单。
值的类型为 BrowserContextMenu
。
🌎 仅网页。
client_ip
🌎 仅限 Web。连接用户的 IP 地址。
client_user_agent
🌎 仅限 Web。连接用户的浏览器详情。
controls
要在页面上显示的控件列表。
例如,添加一个新控件到页面:
- Python
page.controls.append(ft.Text("Hello!"))
page.update()
或使用 page.add()
方法。
实现移除页面顶部的控件:
- Python
page.controls.pop()
page.update()
dark_theme
在深色主题模式下自定义应用程序的主题。
值是 Theme()
类的一个实例 - 更多信息请参见 theming 指南。
debug
如果 Flet 应用的 Flutter 客户端在调试模式下运行,则为 True
。
decoration
背景装饰。
值的类型为BoxDecoration
。
design
保留供将来使用。
dialog
dialog
显示的 AlertDialog
控件。
在 v0.23.0 中已弃用,并将在 v0.26.0 中删除。请使用page.overlay.append(dialog)
替代。
drawer
作为从页面起始边缘滑出的面板显示的 NavigationDrawer
控件。
end_drawer
作为从页面结束边缘滑出的面板显示的 NavigationDrawer
控件。
floating_action_button
显示在页面内容顶部的 FloatingActionButton
控件。
floating_action_button_location
定义 FloatingActionButton
的位置。
属性值是 FloatingActionButtonLocation
。默认值为 END_FLOAT
。
fonts
允许导入自定义字体,并在 Text.font_family
中使用,或通过 theme.font_family
应用于整个应用程序。
Flet 支持以下字体格式:
.ttc
.ttf
.otf
fonts
属性的值是一个字典,其中键是引用该字体的字体系列名称,值是要导入的字体文件的 URL。
字体可以通过提供绝对 URL 从外部资源导入,或通过提供相对 URL 和 assets_dir
从应用程序资源导入。
在 flet.app()
调用中指定 assets_dir
以设置应用程序可用的资源位置。assets_dir
可以是相对于 main.py
目录的相对路径或绝对路径。例如,考虑以下程序结构:
/assets
/fonts
/OpenSans-Regular.ttf
main.py
现在,以下程序从 GitHub 加载 "Kanit" 字体,从资源中加载 "Open Sans"。将 "Kanit" 设置为默认应用程序字体,并为特定的 Text 控件使用 "Open Sans":
import flet as ft
def main(page: ft.Page):
page.fonts = {
"Kanit": "https://raw.githubusercontent.com/google/fonts/master/ofl/kanit/Kanit-Bold.ttf",
"Open Sans": "/fonts/OpenSans-Regular.ttf"
}
page.theme = Theme(font_family="Kanit")
page.add(
ft.Text("This is rendered with Kanit font"),
ft.Text("This is Open Sans font example", font_family="Open Sans")
)
ft.app(target=main, assets_dir="assets")
目前仅支持静态字体,即仅包含一种特定宽度/重量/样式组合的字体,例如 "Open Sans Regular" 或 "Roboto Bold Italic"。
但是,如果您需要在应用中使用可变字体,可以使用 fonttools 创建特定权重的静态“实例化”字体,然后使用这些字体:
fonttools varLib.mutator ./YourVariableFont-VF.ttf wght=140 wdth=85
使用 Wakamai Fondue 在线工具探索可用的字体特性(例如 wght
的可能选项)。
height
包含 Flet 应用的网页或本机操作系统窗口的高度。此属性是只读的。通常在 page.on_resize
处理程序中使用。
horizontal_alignment
子控件应如何水平放置。
属性值是 CrossAxisAlignment
。默认值为 START
。
locale_configuration
应用的区域设置配置。
值的类型为LocaleConfiguration
。
media
提供有关应用媒体(屏幕、窗口)的详细信息。更多信息请参阅 Flutter 文档中的MediaQueryData。
值的类型为PageMediaData
。
在大多数情况下,将内容包装在SafeArea
控件中应该就可以了。
name
在 ft.app()
调用中指定的页面名称。运行为 web 应用时设置页面名称。这是主机名后的 URL 部分。
navigation_bar
在页面底部显示的 NavigationBar
控件。如果同时提供了 bottom_appbar
和 navigation_bar
属性,则会显示 NavigationBar
。
on_scroll_interval
on_scroll
事件的节流时间(毫秒)。默认值为 10
。
overlay
显示在主要页面内容顶部的 Control
列表。
padding
页面内容与其边缘之间的空间。默认值是每侧 10 像素。设置为零填充:
- Python
page.padding = 0
page.update()
填充是 Padding
类的一个实例。
platform
应用程序运行的操作系统。
属性值是 PagePlatform
。
此属性可用于创建自适应 UI,根据操作系统使用不同的控件:
def main(page: ft.Page):
if page.platform == ft.PagePlatform.MACOS:
page.add(ft.CupertinoDialogAction("Cupertino Button"))
else:
page.add(ft.TextButton("Material Button"))
您还可以出于测试目的设置此属性:
import flet as ft
def main(page):
def set_android(e):
page.platform = ft.PagePlatform.ANDROID
page.update()
print("New platform:", page.platform)
def set_ios(e):
page.platform = "ios"
page.update()
print("New platform:", page.platform)
page.add(
ft.Switch(label="Switch A", adaptive=True),
ft.ElevatedButton("Set Android", on_click=set_android),
ft.ElevatedButton("Set iOS", on_click=set_ios),
)
print("Default platform:", page.platform)
ft.app(target=main)
platform_brightness
主机平台当前的亮度模式。
值为只读,类型为Brightness
。
pubsub
用于在应用程序会话之间传递消息的简单发布/订阅实现。
subscribe(handler)
订阅当前应用会话的广播(无主题)消息。handler
是一个具有单个 message
参数的函数或方法,例如:
def main(page: ft.Page):
def on_broadcast_message(message):
print(message)
page.pubsub.subscribe(on_broadcast_message)
subscribe_topic(topic, handler)
订阅当前应用会话的特定主题。handler
是一个具有两个参数的函数或方法:topic
和 message
,例如:
def main(page: ft.Page):
def on_message(topic, message):
print(topic, message)
page.pubsub.subscribe_topic("general", on_message)
send_all(message)
向所有订阅者广播消息。message
可以是任何内容:简单的文字或类实例,例如:
@dataclass
class Message:
user: str
text: str
def main(page: ft.Page):
def on_broadcast_message(message):
page.add(ft.Text(f"{message.user}: {message.text}"))
page.pubsub.subscribe(on_broadcast_message)
def on_send_click(e):
page.pubsub.send_all(Message("John", "Hello, all!"))
page.add(ft.ElevatedButton(text="Send message", on_click=on_send_click))
send_all_on_topic(topic, message)
向特定主题的所有订阅者发送消息。
send_others(message)
向所有订阅者(除发送者外)广播消息。
send_others_on_topic(topic, message)
向特定主题的所有订阅者(除发送者外)发送消息。
unsubscribe()
取消当前应用会话的广播消息订阅,例如:
@dataclass
class Message:
user: str
text: str
def main(page: ft.Page):
def on_leave_click(e):
page.pubsub.unsubscribe()
page.add(ft.ElevatedButton(text="Leave chat", on_click=on_leave_click))
unsubscribe_topic(topic)
取消当前应用会话的特定主题订阅。
unsubscribe_all()
取消当前应用会话的广播消息和所有主题的订阅,例如:
def main(page: ft.Page):
def client_exited(e):
page.pubsub.unsubscribe_all()
page.on_close = client_exited
pwa
如果应用程序作为渐进式 Web 应用(PWA)运行,则为 True
。只读。
query
应用 URL 中 ?
之后的部分。值是 QueryString
的一个实例,带有用于获取查询参数的辅助方法。
route
获取或设置页面的导航路由。有关更多信息和示例,请参见导航和路由部分。
rtl
True
设置文本方向为从右到左。默认值为 False
。
scroll
使页面能够垂直滚动以防止其内容溢出。
值的类型为 ScrollMode
。
session
用于会话数据的简单 KV 存储。
session_id
用户会话的唯一 ID。此属性是只读的。
snack_bar
snack_bar
一个用于显示的SnackBar
控件。
在 v0.23.0 中已弃用,并将在 v0.26.0 中删除。请使用page.overlay.append(snack_bar)
替代。
spacing
页面上控件之间的垂直间距。默认值为 10 虚拟像素。仅当 alignment
设置为 start
、end
或 center
时应用间距。
splash
splash
显示在页面内容顶部的 Control
。ProgressBar
或 ProgressRing
可用作指示某些耗时操作的指示器,例如:
- Python
from time import sleep
import flet as ft
def main(page: ft.Page):
progress_bar = ft.ProgressBar(visible=False)
page.overlay.append(progress_bar)
def button_click(e):
progress_bar.visible = True
e.control.disabled = True
page.update()
sleep(3)
progress_bar.visible = False
e.control.disabled = False
page.update()
page.add(ft.ElevatedButton("Do some lengthy task!", on_click=button_click))
ft.app(main)
在 v0.23.0 中已弃用,并将在 v0.26.0 中删除。请使用page.overlay.append(splash)
替代。