Row 使用 SpaceBetween 水平向左右兩側對齊
將兩個 Widget 同時水平向左右兩側對齊是常見需求,可使用 Row
的mainAxisAlignment: MainAxisAlignment.spaceBetween
實現。
失くすものさえない今が強くなるチャンスよ
將兩個 Widget 同時水平向左右兩側對齊是常見需求,可使用 Row
的mainAxisAlignment: MainAxisAlignment.spaceBetween
實現。
AVD 也可直接從 CLI 啟動,不必從 Android Studio 啟動。
若以 Android Studio 開啟 AVD,由於預設 DNS 是虛擬的,因此無法打 API,必須以 CLI 指定 DNS 啟動 AVD。
Flutter 已經定義了很多預設目錄,但一些常用元素並沒有,團隊可依據需求自行定義之。
DropdownBottomSheet
典型都是使用 ListView
搭配 ListTile
實現,但 ListTile
自帶 Padding,可能會無法達成 Designer
的設計要求,可使用沒有自帶 Padding 的 GestureDector
取代 ListTile
。
IconButton
自帶 Margin,如想以一排 IconButton
實現 ToolBar
時,會發現 IconButton
自帶的 Margin 很不方便,此時可使用 GestureDetector
實現 IconButton
。
Flutter 並沒有提供 DropdownBottomSheet
顯示兩層選單,必須自行使用 ModalBottomSheet
、ListView
與 Padding
實現。
Flutter 並沒有提供 DropdownBottomSheet
顯示下方有捲軸選單,必須自行使用 ModalBottomSheet
、 ListView
與 Scrollbar
實現。
ModalButtonSheet
為手機風格的下拉選單,可自行設計所顯示的 UI。
Flutter 並沒有提供 DropdownBottomSheet
顯示下方彈出選單,必須自行使用 ModalBottomSheet
與 ListView
實現。
NavigationBar
所切換的每個 Page,實務上由於會非常複雜,會將每個 Page 抽出成獨立檔案。
NavigationBar
為智慧手機經典介面,將 Button
放在底部方便使用者快速切換頁面。
DropdownButton
可實現兩層下拉選單。
Scrcpy 可將 Android 手機畫面投影到 macOS 上,特別適合開會分享畫面。
IconButton
可實現只有 Icon 的 Button。
當點擊 TextFormField
時,會自動顯示 Soft Keyboard,但點擊其他地方,卻不會自動關閉 Soft Keyboard,必須自行關閉之。
Flutter 並沒有特別提供 Password
,可透過 TextFormField
實現。
Flutter 的 MaterialApp
支援 Theme,可分別自訂 Light Mode 與 Dark Mode 的顏色。
Flutter 的 MaterialApp
支援 Theme,可透過 ThemeData.light()
與 ThemeData.dark()
簡單支援 Light Mode 與 Dark Mode。
為了避免 User 設定系統字型大小而造成跑版,可透過 MediaQuery
設定。
MediaQuery
可以幫助你取得螢幕的 尺寸
、方向
、縮放比例
等資訊,常用於製作 Responsive Design。
ElavatedButton
亦可設定成背景為 漸層色
,但必須搭配 Container
與 BoxDecoration
才能實現。
ElavatedButton
可顯示突起的 Button。
一般 Toast
是由上方彈出,而 SnakeBar
是由下方彈出。
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 介面。
Expanded
只能作為 Flex
的內層,它可以按比例 延伸
Flex
內層占用的空間。因為 Column
與 Row
都繼承自 Flex
,所以 Expanded
也可以用於 Column
與 Row
。
Container
可替 Widget 加以 旋轉
。