Flet 做了一件听起来有点“离谱”的事——它让你只用 Python。就能同时建立桌面、Web 和移动端应用，连一行 HTML、CSS、JavaScript 都不需要写。它的底层是 Flutter 渲染引擎，界面漂亮、性能扎实。怎么说呢，如果你是一个 Python 开发者。却一直被前端的复杂性挡在门外Flet 就是为你准备的。

一、环境搭建：从基础开始

Flet 的安装极其简单，一行命令搞定：

pip install 'flet'

安装完成后验证一下版本：

flet --version

运行方式有两种：

# 桌面应用
flet run app.py
# Web 应用
flet run --web app.py

痛点：很多人因为环境配置繁琐而放弃尝试。Flet 的“一键安装”极大降低了入门门槛。

二、第一个 Flet 应用：Hello World

每一个 Flet 应用的结构都非常固定。掌握这个模板，后面的一切都是往里填内容。

import flet as ft
def main:
page.title = "我的第一个 Flet 应用"
page.window.width = 800 # 可自定义窗口宽度
page.window.height = 600 # 可自定义窗口高度
page.add)
ft.app

这三行逻辑。就是 Flet 的主要骨架：

flowchart LR
A --> B
B --> C
C --> D
D --> E

• Page 是整个应用的根容器，相当于一张白纸。
• ft.Text 是最基础的文本控件。
• page.add 把控件“贴”到页面上。

三、主要控件：建立界面的积木

基础显示控件

import flet as ft
def main:
page.add(
ft.Text,ft.Text,ft.Icon,ft.Image,)
ft.app

输入控件

import flet as ft
def main:
def on_submit:
page.add)
name_field.value = ""
page.update
name_field = ft.TextField(
label="请输入姓名",hint_text="例如：张三",width=300。on_submit=on_submit,)
dropdown = ft.Dropdown(
label="选择城市",width=300,options=,)
checkbox = ft.Checkbox
page.add(name_field,dropdown,checkbox,ft.ElevatedButton)
ft.app

按钮家族

四、布局程序：让界面整齐起来

Row 与 Column

 import f let as f t def m a i n: p age . h o r i z o n t a l _ a l i g n m e n t = f . CrossAxisAlignment.CENTER # Row : 横向排列 rowdemo = f . Row,bgcolor=f . Colors.BLUE100,padding=f . EdgeInsets.all,),f . Container,bgcolor=f . Colors.GREEN100,padding=f.EdgeInsets.all,),f . Container,bgcolor=f.ColorS.RED100。padding=f.EdgeInsets.all,),],width=None ) # Column :纵向排列 coldemo = f.Column,f.Text,f.Text,],) p.age.add,coldemo ) 

ft.app

痛点 * 对齐问题 – 默认左对齐导致视觉不平衡 * 尺寸约束 – 未设置 width 或 height 时会出现内容溢出 * 响应式需求 – 在手机上布局会乱掉，需要手动适配

：万能包装器

Container 是 Flet 最灵活的容器，可以加背景色、圆角、阴影和内边距。

import f let as f t
conta I ner,bgcolor=f.Col ors.WHITE,borderradius=None,padding=None,shadow=f.BoxShadow(spreadradius=None,blur_radius=None,color=
)

痛点 * 阴影与圆角组合使用时容易产生层级冲突 * 过多嵌套导致性能下降

响应式布局

html

import fl etas d e p o rt s
def m a i n:
row_ s =)。fl.et.Column]),fl.et.Column]),] fl.et.ResponsiveRow


痛点
* 列数计算失误导致元素挤占或留白过多
* 时需手动刷新视图


五、事件处理与状态管理 

主要规则

在 Flet 中，每次修改控件属性后都必须调用 update 才会刷新 UI。
类似 React 的 setState但更直观。



 import fl etas d e p o rt s def m a i n: c ou ntt ex t(""。size=None,weight=
) def inc: c ou ntt.ex te v al u e=str+1);c ou ntt.ex te.update def dec:c ou ntt.ex te.v al u e=str-1);怎么说呢，c ou ntt.ex te.update d ef re see:c ou ntt.ex te.v al u e="";c ou ntt.ex te.update p age.add(fl.et.Row(alignment=
fl.et.MainAxisAlignment.CENTER,controls=,),fl .
et.Row(alignment=
fl.et.MainAxisAlignment.CENTER,controls=,)) 



用 Python 类封装组件状态

html
 import fla CounterCard: title:str ="计数器" d ef __ init__: self._count:int =0 self._label =
fl .
et .
Tex T,size=None,weigh=t.ft.FontWeight.BOLD) self.content =
fl .
et .
Colu mn(horizontal_alignment=
fl.
CrossAxisAlignment.CENTER,controls=,None]=field d ef __ init__: ...
...


再看此项目涵盖了。



功能
技术要点




列表展示
ListTile,动态添加/删除


编辑模式
双视图切换


状态同步
每个任务实例独立维护




痛点
* 列表渲染频繁导致卡顿，需要调整 update 范围
* 编辑/删除交互不够直观，需要细化 UI 指引


七、多页面导航与路由 

html
 import fla tes def m a i n: ...


路由工作流程的观点是，

mermaid flowchart TD A-->B-->C-->D-->E-->F-->G-->H-->I-->F;

痛点


路由切换时未及时销毁旧 View 会占用内存

深度嵌套页面导致返回逻辑混乱



八、异步编程：让界面不卡顿 

html
' import asyncio import fla tes async de fin fetch_data: btn.disabled=True progress.visible=True status.value ='加载中...' page.update;await asyncio.sleep;progress.visible=False status.value ='✅ 数据加载完成！' btn.disabled=False;page.update，...


配合  实际请求：

html
async def load_users: async with httpx.AsyncClient as client:
resp = await client.get users =
resp.json
...



网络错误未捕获导致程序崩溃

UI 更新频繁影响体验。需要控制刷新频率



九、主题与样式：让应用更专业 

全局主题配置

对话框与通知

html
// SnackBar：轻量提示页.open))
// AlertDialog：确认弹窗页.open


痛点



场景
常见问题




深浅模式切换
切换后部分元素仍保持原色


多语言支持
文本硬编码导致国际化困难





十、打包发布：一键部署到各网站 

bash

f let build windows 

f let build macos 

f let build web




目标网站    | 特殊要求    | 输出产物    |说明




windows 无特殊要求 /exe 安装包 /exe 自带依赖运行即可 /windows 程序可直接运行  #Windows 下无额外依赖，仅需 python 安装即可直接运行；若需离线安装，则可好的 exe 文件拖拽至 Release 页面即可；如果想把 exe 换成 MSI 包，你可以使用 Inno Setup 或 NSIS 来创建 MSI 安装程序；怎么说呢，如果想做自定义安装程序。你可以使用 NSIS 或 Inno Setup 来制作自定义安装程序；如果想把 exe 换成 AppImage 包，你可以使用 PyInstaller+AppImageTools 来生成 AppImage 包；怎么说呢，如果想把 exe 换成 Flatpak 包。你可以使用 PyInstaller+Flatpak Tools 来生成 Flatpak 包；如果想把 exe 换成 Snap 包，你可以使用 PyInstaller+Snapcraft 来生成 Snap 包；如果想把 exe 换成 deb 包，你可以使用 PyInstaller+Debian Tools 来生成 deb 包；"



痛点



网站
要求
出现的问题




Windows
无特殊要求
如果缺少 Visual C++ Redistributable。会报错


macOS
macOS 程序
未签名会被 Gatekeeper 拦截


Android
Android SDK & NDK
ABI 不匹配导致 APK 无法安装


iOS
XCode + Apple ID
必须通过 TestFlight 或 App Store 审核





知识地图的观点是，Flet 学习方法总览 



Dive into core concepts → Components → Layouts → State & Events → Routing → Async → Theme & Style → Build & Deploy.

A complete project serves as a practical reference to tie all topics toger.

The learning curve is moderate;each layer adds depth but remains approachable due to Python’s simplicity.

Beginners should start with “Hello World” example and progressively add features.

The ecosystem offers official docs + community tutorials that cover all major aspects.





MOTIVATION:\



MOTIVATION:


….




…