General
- 安裝 Flutter 開發環境 (macOS)
- 安裝 Flutter 開發環境 (Windows)
- 使用 Android Studio 建立 Flutter 專案
- 使用 CLI 建立 Flutter 專案
- 更新 Flutter SDK 版本
- Flutter 之專案目錄架構
- 顯示 Layout 線輔助 Layout
- scrcpy 將 Android 手機投影到 macOS
- Hot Reload、Hot Restart 與 Full Restart
- Flutter 使用 MVC 架構分離 UI 與邏輯
- Flutter 使用自訂字型
AVD
Android
Base Widgets
Structual Widgets
Container
- Container 為 Widget 設定 Alignment
- Container 為 Widget 設定背景顏色
- Container 為 Widget 添加 Border
- Container 為 Widget 添加 BoxShadow
- Container 為 Widget 設定 Margin
- Container 為 Widget 設定 Padding
- Container 為 Widget 旋轉
Center
Expanded
Input Widgets
TextFormField
- TextFormField 實現進階輸入框
- TextFormField 設定 Margin
- TextFormField 實現 Password 輸入
- TextFormField 自動關閉 Soft Keyboard
TextField
DropdownButton
DropdownMenu
SizedBox
Interaction Widgets
ElavatedButton
IconButton
Display Widgets
ListView
- ListView 顯示垂直清單
- GestureDetector 取代 ListTile 的 ListView
- ListView 使用 ShrinkView 自行決定高度
- ListView 使用 Event 動態 Filter
- ListView 使用 Getter 動態 Filter
GridView
Layout Widgets
Row
Colomn
Spacer
Positioned
Naviation Widgets
TabBar
- TabBar 實現 Tab 介面 (DefaultTabController)
- TabBar 實現 Tab 介面 (TabController)
- TabBar 不顯示 Divider
- TabBar 使 Icon 與 Text 並列
NavigationBar
Helper Widgets
MediaQuery
- MediaQuery 取得裝置資訊
- MediaQuery 忽略系統設定字型大小
- MediaQuery 動態設定 Margin
- MediaQuery 動態設定 Row 的 Gap
- MediaQuery 動態設定 Column 的 Gap
- MediaQuery 取得字型放大倍率
Feedback Widgets
SnakeBar
ModalBottomSheet
DropdownBottomSheet
- DropdownBottomSheet 顯示下方彈出選單
- DropdownBottomSheet 顯示下方有捲軸選單
- DropdownBottomSheet 顯示兩層選單
- GestureDetector 取代 ListTile 顯示兩層選單