自定义控件
虽然 Flet 提供了 100 多个内置控件,可以单独使用,但使用 Flet 编程的真正美丽之处在于所有这些控件可以使用 Python 对象oriented 编程概念来创建可重用的 UI 组件。
您可以通过样式化和/或组合现有的 Flet 控件在 Python 中创建自定义控件。
样式控件
您可以创建的最简单的自定义控件是样式控件,例如,具有特定颜色和行为的按钮,该按钮将在应用程序中多次使用。
要创建样式控件,您需要创建一个继承自 Flet 控件的新类,例如 ElevatedButton
:
class MyButton(ft.ElevatedButton):
def __init__(self, text):
super().__init__()
self.bgcolor = ft.colors.ORANGE_300
self.color = ft.colors.GREEN_800
self.text = text
您的控件具有构造函数,以便自定义属性和事件,并传递自定义数据。请注意,您必须在自己的构造函数中调用 super().__init__()
,以便访问 Flet 控件的属性和方法,该控件是您继承的。
现在,您可以在应用程序中使用 MyButton 控件:
import flet as ft
def main(page: ft.Page):
page.add(MyButton(text="OK"), MyButton(text="Cancel"))
ft.app(target=main)
![](/img/docs/custom-controls/styled-controls.png)
处理事件
类似于属性,您可以将事件处理程序作为参数传递到自定义控件类构造函数中:
import flet as ft
class MyButton(ft.ElevatedButton):
def __init__(self, text, on_click):
super().__init__()
self.bgcolor = ft.colors.ORANGE_300
self.color = ft.colors.GREEN_800
self.text = text
self.on_click = on_click
def main(page: ft.Page):
def ok_clicked(e):
print("OK clicked")
def cancel_clicked(e):
print("Cancel clicked")
page.add(
MyButton(text="OK", on_click=ok_clicked),
MyButton(text="Cancel", on_click=cancel_clicked),
)
ft.app(target=main)