本對照表用于幫助 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 布局需求。