获取用户输入

使用 Flet 制作交互式 Web 应用程序轻而易举！它不仅限于显示数据，还可以请求用户输入并响应页面控件生成的各种事件。

Button是最重要的输入控件，它click在按下时生成事件：

btn = ElevatedButton("Click me!")
page.add(btn)

网页上的控件产生的所有事件都会不断地发送回你的脚本，那么你如何响应一个按钮的点击呢？

事件

“计数器”应用程序中带有事件的按钮：

import flet
from flet import IconButton, Page, Row, TextField, icons

def main(page: Page):
    page.title = "Flet counter example"
    page.vertical_alignment = "center"

    txt_number = TextField(value="0", text_align="right", width=100)

    def minus_click(e):
        txt_number.value = int(txt_number.value) - 1
        page.update()

    def plus_click(e):
        txt_number.value = int(txt_number.value) + 1
        page.update()

    page.add(
        Row(
            [
                IconButton(icons.REMOVE, on_click=minus_click),
                txt_number,
                IconButton(icons.ADD, on_click=plus_click),
            ],
            alignment="center",
        )
    )

flet.app(target=main)

Flet 提供了许多用于构建表单的控件： TextField、Checkbox、Dropdown、ElevatedButton。

让我们向用户询问名称：

greeter.py

import flet
from flet import ElevatedButton, Text, TextField

def main(page):
    def btn_click(e):
        if not txt_name.value:
            txt_name.error_text = "Please enter your name"
            page.update()
        else:
            name = txt_name.value
            page.clean()
            page.add(Text(f"Hello, {name}!"))

    txt_name = TextField(label="Your name")

    page.add(txt_name, ElevatedButton("Say hello!", on_click=btn_click))

flet.app(target=main)