NavigationBar 支援每個 Page 獨立檔案
NavigationBar
所切換的每個 Page,實務上由於會非常複雜,會將每個 Page 抽出成獨立檔案。
失くすものさえない今が強くなるチャンスよ
NavigationBar
所切換的每個 Page,實務上由於會非常複雜,會將每個 Page 抽出成獨立檔案。
NavigationBar
為智慧手機經典介面,將 Button
放在底部方便使用者快速切換頁面。
DropdownButton
可實現兩層下拉選單。
Flutter 並沒有提供 DropdownBottomSheet
顯示兩層選單,必須自行使用 ModalBottomSheet
、ListView
與 Padding
實現。
Flutter 並沒有提供 DropdownBottomSheet
顯示下方有捲軸選單,必須自行使用 ModalBottomSheet
、 ListView
與 Scrollbar
實現。
Flutter 並沒有提供 DropdownBottomSheet
顯示下方彈出選單,必須自行使用 ModalBottomSheet
與 ListView
實現。
ModalButtonSheet
為手機風格的下拉選單,可自行設計所顯示的 UI。
Scrcpy 可將 Android 手機畫面投影到 macOS 上,特別適合開會分享畫面。
IconButton
可實現只有 Icon 的 Button。
當點擊 TextFormField
時,會自動顯示 Soft Keyboard,但點擊其他地方,卻不會自動關閉 Soft Keyboard,必須自行關閉之。
Flutter 並沒有特別提供 Password
,可透過 TextFormField
實現。
雖然理論上 Material Design 要使用內建的顏色變數,如 primary
、secondary
…,但實務上 Designer 可能並不使用這些變數,我們也可以在 Material Design 使用 Figma 的變數。
Pixel Overflow 是 Flutter 開發中常遇到的問題,透過由 MediaQuery
取得裝置長寬,可動態設定 Column
的 Gap 避免 Pixel Overflow。
Pixel Overflow 是 Flutter 開發中常遇到的問題,透過由 MediaQuery
取得裝置長寬,可動態設定 Row
的 Gap 避免 Pixel Overflow。
Flutter 的 MaterialApp
支援 Theme,可分別自訂 Light Mode 與 Dark Mode 的顏色。
Flutter 的 MaterialApp
支援 Theme,可透過 ThemeData.light()
與 ThemeData.dark()
簡單支援 Light Mode 與 Dark Mode。
Pixel Overflow 是 Flutter 開發中常遇到的問題,透過由 MediaQuery
取得裝置長寬,可動態設定 Margin 避免 Pixel Overflow。
為了避免 User 設定系統字型大小而造成跑版,可透過 MediaQuery
設定。
MediaQuery
可以幫助你取得螢幕的 尺寸
、方向
、縮放比例
等資訊,常用於製作 Responsive Design。
ElavatedButton
亦可設定成背景為 漸層色
,但必須搭配 Container
與 BoxDecoration
才能實現。
ElavatedButton
可顯示突起的 Button。
一般 Toast
是由上方彈出,而 SnakeBar
是由下方彈出。
若以 Android Studio 開啟 AVD,由於預設 DNS 是虛擬的,因此無法打 API,必須以 CLI 指定 DNS 啟動 AVD。
MaterialApp
可建立 Android 風格頁面。
TextFormField
預設會占滿整個 Column,且本身也沒有提供 Margin 設定,但可透過 Padding
提供 TextFormField
所需的 Margin。
CupertinoApp
可建立 iOS 風格頁面。
當整個頁面到不需要 State 時,可簡單地使用 StatelessWidght
即可。
大多數的頁面到需要 State,如經典的 Counter,可簡單地使用 StatefulWidght
實現。
TextFormField
可實現進階輸入框,搭配 TextEditingController
可支援 Two Way Binding。
DropdownButton 預設在下方會有一條橫線,也可加以取消顯示。
DropdownButton
可實現進階下拉選單,實務上資料會來自 API 的 List<Map>
,可使用 map()
將其轉成 DropdownMenuItem
。
DropdownButton
可實現進階下拉選單。
DropdownMenu
可實現下拉選單。
生物辨識登入
已經成為手機登入的標配,local_auth
可 啟動
該裝置的生物辨識登入。
生物辨識登入
已經成為手機登入的標配,local_auth
可實現 Android、iOS、macOS 與 Windows 的 跨平台
生物辨識登入。
Flutter 的 TabBar
預設會顯示 Divider,若不想顯示,將 dividerColor
設定為 Transparent
即可。
TabBar
、TabBarView
與 DefaultTabController
可實現 Tab 介面。
Column
可將 Widget 垂直排列
。
Row
可將 Widget 水平排列
。
Expanded
只能作為 Flex
的內層,它可以按比例 延伸
Flex
內層占用的空間。因為 Column
與 Row
都繼承自 Flex
,所以 Expanded
也可以用於 Column
與 Row
。