Flutter 与 Android 原生布局组件对照表（完整版）

本对照表用于帮助 Android 开发者快速理解 Flutter 中的布局组件与原生布局的关系。

---

📘 Flutter ↔ Android 布局组件对照表

Flutter Widget	Android View/Layout	说明
Container	FrameLayout / View	通用容器，可设置背景、边距、对齐等
Row	LinearLayout (horizontal)	横向线性排列
Column	LinearLayout (vertical)	纵向线性排列
Stack	FrameLayout	层叠布局
Positioned (在 Stack 内)	FrameLayout + layout_gravity / margin	绝对定位的子项
Align / Center	RelativeLayout + layout_centerInParent / gravity	对齐到父级
Expanded	LinearLayout + layout_weight	占据剩余空间
Flexible	layout_weight + 自适应	灵活伸缩（类似 weight 的 wrap_content）
SizedBox	View + layout_width/height	固定尺寸
Padding	android:padding	设置内边距
Margin (通过 Padding 外包)	android:layout_margin	Flutter 没有 Margin，通常通过外层 Padding 模拟
Wrap	FlexboxLayout / 自定义 FlowLayout	自动换行布局
Table	TableLayout	表格布局
IntrinsicWidth/Height	wrap_content	尺寸自适应内容（性能差时慎用）
Transform	View.setRotation/Scale/Translation	变换视图
CustomPaint	Canvas + View 自定义绘制	自定义绘图

---

📱 滚动与列表布局

Flutter Widget	Android View/Layout	说明
SingleChildScrollView	ScrollView	单个滚动子项
ListView	ListView / RecyclerView	垂直滚动列表
GridView	GridView / RecyclerView + GridLayoutManager	网格布局
PageView	ViewPager2	翻页组件
CustomScrollView + Slivers	RecyclerView + 多类型 ViewType	自定义滚动内容

---

🔧 复杂布局、定位、对齐

Flutter Widget	Android View/Layout	说明
RelativeLayout 等效	无直接对应（但以下组合可实现）
Stack + Positioned	RelativeLayout + rules	实现子元素相对布局
Align	RelativeLayout + alignParentX/Y	单个子项对齐
LayoutBuilder	onMeasure() + 自定义布局	根据父布局约束决定子布局
CustomMultiChildLayout	ViewGroup + onLayout()	自定义多个子控件位置
FractionallySizedBox	百分比布局（无直接原生对应）	占父布局一定比例
Positioned.fill	match_parent	填满父容器
OverflowBox	clipChildren=false	允许子项溢出父容器

---

🧩 页面结构与导航

Flutter Widget	Android View/Layout	说明
Scaffold	Activity + 页面根布局	页面基础骨架
AppBar	Toolbar	顶部导航栏
BottomNavigationBar	BottomNavigationView	底部导航栏
Drawer	DrawerLayout + NavigationView	左右侧滑菜单
TabBar + TabBarView	TabLayout + ViewPager2	顶部 Tab 页面切换
Navigator + Route	FragmentManager / Intent	页面导航系统

---

🎨 控件级对应（附加）

Flutter Widget	Android View	说明
Text	TextView	显示文本
TextField	EditText	输入框
ElevatedButton	Button	默认按钮
IconButton	ImageButton	图标按钮
Image	ImageView	显示图片
Checkbox	CheckBox	复选框
Radio	RadioButton	单选按钮
Switch	Switch	开关按钮
Slider	SeekBar	滑动条
ProgressIndicator	ProgressBar	进度条
AlertDialog	AlertDialog	弹窗对话框
SnackBar	Toast / Snackbar	底部提示
DropdownButton	Spinner	下拉菜单

---

🧠 总结建议

• Flutter 更强调组合式声明性布局，Android 更偏向静态 XML。
• Flutter 的 Stack + Positioned 是最接近 RelativeLayout 的实现方式。
• 灵活使用 Align、Expanded、Flexible 可以覆盖大部分 Android 布局需求。