Flutter有哪些常用组件

在 Flutter 中，组件（Widget）是构建 UI 的核心。下面按使用频率和场景分类，整理常用组件，适合入门和日常开发参考。

一、基础布局组件

用于组织和排列子组件

• Container：通用容器（可设置宽高、边距、背景、圆角等）
• Row：水平布局
• Column：垂直布局
• Stack：层叠布局（类似绝对定位）
• Expanded / Flexible：在 Row / Column 中分配空间
• Padding：内边距
• Align / Center：对齐方式
• Wrap：自动换行的流式布局
• GridView：网格布局
• ListView：列表布局（最常用）

二、基础显示组件

用于展示内容和信息

• Text：文本
• Image：图片（网络、本地、资源）
• Icon：图标
• RichText：富文本
• CircleAvatar：圆形头像
• Card：卡片容器
• Divider：分割线

三、交互组件

用于用户操作和反馈

• ElevatedButton / TextButton / OutlinedButton：按钮
• GestureDetector：手势检测（点击、长按、滑动）
• InkWell：带水波纹的点击效果
• TextField：输入框
• Form / TextFormField：表单
• Checkbox / Radio / Switch：选择类控件
• Slider：滑动条
• DropdownButton：下拉选择

四、弹窗与提示

• AlertDialog：对话框
• BottomSheet：底部弹窗
• SnackBar：轻提示
• Tooltip：长按提示
• CupertinoAlertDialog（iOS 风格）

五、状态与生命周期相关

• StatefulWidget / StatelessWidget
• FutureBuilder：异步 UI
• StreamBuilder：流式数据 UI
• AnimatedBuilder：动画
• ValueListenableBuilder：轻量状态更新

六、Material / Cupertino 风格组件

Material（Android 风格）

• Scaffold
• AppBar
• BottomNavigationBar
• FloatingActionButton
• Drawer

Cupertino（iOS 风格）

• CupertinoPageScaffold
• CupertinoNavigationBar
• CupertinoButton
• CupertinoTabBar

七、常用结构组件

• Scaffold：页面骨架
• AppBar：顶部导航
• SafeArea：避免刘海屏遮挡
• SingleChildScrollView：可滚动页面
• CustomScrollView：复杂滚动布局

八、动画组件（进阶）

• AnimatedContainer
• AnimatedOpacity
• Hero
• Transform

如果你愿意，我可以：

• ✅ 按 新手必学 Top 20 给你精简版
• ✅ 用 示例 Demo 演示某个组件
• ✅ 对比 Flutter vs Android / iOS 组件

你更想了解哪一部分？