Flutter組件精講與實(shí)戰(zhàn)（套裝上下冊(cè)）

目錄

基礎(chǔ)篇

第1章Flutter與Dart語(yǔ)言

1.1Dart語(yǔ)言概述

1.2Flutter概述

1.3Flutter的編譯模式

1.4Dart與Flutter的語(yǔ)法基礎(chǔ)概述

1.4.1Dart語(yǔ)言的基本數(shù)據(jù)類型

1.4.2Dart語(yǔ)言的變量

1.4.3Dart語(yǔ)言的方法

1.4.4Dart語(yǔ)言的Map、List、Set

1.4.5Dart語(yǔ)言的流程控制

1.4.6Dart語(yǔ)言的異步編程

1.5Android Studio的調(diào)試技巧

1.5.1斷點(diǎn)調(diào)試

1.5.2Flutter Inspector視圖定位工具

1.5.3Flutter Performance內(nèi)存管理工具

1.5.4Flutter 常用命令

第2章MaterialApp組件的精通使用分析

2.1MaterialApp組件精通使用的簡(jiǎn)單描述

2.2MaterialApp基本使用

2.3MaterialApp組件的路由routes配置概述

2.4路由routes配置

2.5路由配置404

2.6路由觀察者

2.6.1基本使用

2.6.2route 解析

2.6.3NavigatorObservers實(shí)戰(zhàn)

2.6.4動(dòng)態(tài)路由實(shí)戰(zhàn)

2.6.5自定義動(dòng)態(tài)路由實(shí)戰(zhàn)

2.6.6自定義圓形過(guò)渡效果路由

2.6.7特殊情況動(dòng)態(tài)路由實(shí)戰(zhàn)

2.6.8關(guān)閉當(dāng)前頁(yè)面

2.7樣式ThemeData精講

2.7.1brightness 屬性分析

2.7.2primarySwatch屬性分析

2.7.3primaryColor屬性分析

2.7.4accentColor屬性分析

2.7.5與觸覺(jué)顯示相關(guān)屬性分析

2.7.6其他主題概述

2.8多主題適配

2.8.1一行代碼將App渲染成灰色

2.8.2淺談Provider進(jìn)行狀態(tài)管理

2.8.3Provider進(jìn)行多數(shù)據(jù)模型狀態(tài)管理

2.9多語(yǔ)言環(huán)境配置

2.9.1配置日期組件顯示中文

2.9.2配置應(yīng)用不適配的系統(tǒng)語(yǔ)言默認(rèn)為英文

2.9.3保存用戶對(duì)應(yīng)用程序語(yǔ)言環(huán)境的偏好設(shè)置

2.9.4應(yīng)用內(nèi)切換語(yǔ)言環(huán)境然后動(dòng)態(tài)更新當(dāng)前語(yǔ)言環(huán)境

2.9.5應(yīng)用內(nèi)顯示文字適配多語(yǔ)言環(huán)境

2.10StatefulWidget、Context、State

2.11語(yǔ)義設(shè)計(jì)Semantics

2.12Widget的分析





第3章Scaffold組件的詳細(xì)綜述

3.1Scaffold的基本使用

3.2FloatingActionButton的詳細(xì)配置

3.2.1FloatingActionButton的類型

3.2.2FloatingActionButton的常用屬性使用分析

3.2.3FloatingActionButton的shape屬性分析

3.3Drawer配置側(cè)拉頁(yè)面

3.3.1用戶信息組件UserAccountsDrawerHeader

3.3.2DrawerHeader

3.3.3單擊按鈕打開與關(guān)閉側(cè)拉頁(yè)面

3.4BottomNavigationBar配置底部導(dǎo)航欄菜單

3.4.1items屬性分析

3.4.2type屬性分析

3.4.3bottomNavigationBar結(jié)合獨(dú)立的StatefulWidget使用

3.4.4bottomNavigationBar頁(yè)面?；罱鉀Q方案

3.5BottomAppBar配置底部導(dǎo)航欄菜單

3.6底部標(biāo)簽欄bottomSheet

第4章AppBar組件的詳細(xì)綜述

4.1AppBar的基本使用

4.1.1title屬性分析

4.1.2線性布局Row在屬性title中的使用

4.1.3Row標(biāo)簽結(jié)合PageView實(shí)現(xiàn)滑動(dòng)切換

4.1.4Row標(biāo)簽結(jié)合TabBarView實(shí)現(xiàn)滑動(dòng)切換

4.1.5MediaQuery解析

4.2TabBar結(jié)合TabBarView


4.3AppBar的bottom屬性

4.4AppBar的leading屬性

4.5AppBar的actions屬性

4.5.1Icon的樣式配置

4.5.2AppBar的iconTheme與actionsIconTheme

4.6AppBar的flexibleSpace屬性

4.7SliverAppBar使用分析

4.8FlexibleSpaceBar使用分析

4.9SliverAppBar經(jīng)典布局效果

4.10AppBar、SliverAppBar對(duì)比

4.11AppBar的shape屬性分析

第5章文本顯示Text組件

5.1文本顯示組件的基本使用

5.2樣式組件TextStyle的使用分析

5.2.1樣式組件TextStyle的inherit

5.2.2樣式組件TextStyle的顏色配置

5.2.3文字大小fontSize

5.2.4文字粗細(xì)設(shè)置fontWeight

5.2.5文字斜體設(shè)置

5.2.6文字間距設(shè)置

5.2.7文字基線textBaseline分析

5.2.8裝飾decoration分析

5.2.9自定義字體fontFamily配置

5.2.10字體列表fontFamilyFallback配置

5.2.11字體陰影shadows配置

5.2.12文本高度height配置

5.3Text中文字對(duì)齊方式

5.3.1文字過(guò)長(zhǎng)顯示省略號(hào)

5.3.2文字自動(dòng)換行設(shè)置

5.3.3彈性布局綜述

5.4富文本RichText組件的使用分析

5.5富文本RichText使用案例

5.6文本標(biāo)簽

5.6.1文本標(biāo)簽構(gòu)建

5.6.2文本標(biāo)簽結(jié)合流式布局使用

5.7AnimatedDefaultTextStyle的使用分析

第6章文本輸入框TextField組件

6.1TextField組件的基本使用

6.1.1輸入的文字不可見

6.1.2設(shè)置輸入的英文首字母大寫

6.1.3設(shè)置彈出的鍵盤類型

6.1.4鍵盤回車鍵的樣式與功能

6.1.5鍵盤回車鍵切換輸入框

6.1.6FocusNode輸入框焦點(diǎn)事件的捕捉與監(jiān)聽

6.1.7TextField 輸入文本對(duì)齊配置

6.2TextField組件的設(shè)置及允許輸入的文本格式

6.2.1輸入字?jǐn)?shù)限制

6.2.2輸入行數(shù)限制

6.2.3只允許輸入數(shù)字

6.2.4只允許輸入英文字母A~Z的大小寫

6.2.5自定義TextInputFormatter

6.3TextField組件InputDecoration

6.3.1TextField組件去掉默認(rèn)的下畫線

6.3.2TextField邊框裝飾OutlineInputBorder

6.3.3TextField邊框裝飾線的顏色配置

6.3.4TextField不可編輯

6.4TextField組件配置提示文本

6.4.1TextField的labelText使用

6.4.2TextField的preIcon使用

6.4.3TextField的countText使用

6.4.4TextField的helperText與errorText

6.5TextField組件控制器TextEditingController

6.6TextField組件光標(biāo)樣式配置

6.7一個(gè)搜索框

6.7.1搜索框SearchStaticBar組件構(gòu)建

6.7.2搜索輸入框SearchTextFieldBar組件構(gòu)建

6.7.3搜索輸入框使用案例

第7章Container組件

7.1Container組件的基本使用

7.1.1Container的大小限定分析

7.1.2Container自適應(yīng)包裹子Widget

7.2Container組件的內(nèi)外邊距

7.2.1EdgeInsets分析

7.2.2Padding分析

7.2.3Container在ListView中對(duì)子item自適應(yīng)包裹

7.3Container組件decoration應(yīng)用

7.3.1BoxDecoration在Container中的應(yīng)用分析

7.3.2BoxDecoration在Container中的配置陰影

7.3.3BoxDecoration在Container中的配置漸變過(guò)渡樣式

7.3.4BoxDecoration配置背景圖像

7.3.5BoxDecoration的shape屬性配置使用

7.3.6ShapeDecoration在Container中的使用分析

7.4自定義ShapeBorder

7.4.1打洞效果

7.4.2手撕優(yōu)惠券的效果

7.5AnimatedContainer的基本使用

7.6ConstrainedBox組件的使用分析

第8章按鈕組件

8.1MaterialButton的使用分析

8.1.1ButtonThemeData的使用分析

8.1.2各種Color的使用分析

8.1.3MaterialButton的回調(diào)函數(shù)說(shuō)明

8.1.4MaterialButton的shape使用分析

8.1.5MaterialButton的寬和高分析

8.1.6MaterialButton的子Widget分析

8.1.7MaterialButton的內(nèi)邊距分析

8.1.8RaisedButton的使用分析

8.1.9FlatButton的使用分析

8.1.10OutlineButton的使用分析

8.2FloatingActionButton

8.2.1屬性mini分析

8.2.2屬性shape分析

8.2.3標(biāo)簽樣式

8.2.4與Scaffold的底部bottomNavigationBar綜合使用

8.2.5兩個(gè)頁(yè)面的過(guò)渡動(dòng)畫

8.2.6懸浮按鈕的旋轉(zhuǎn)變換

8.2.7懸浮按鈕實(shí)現(xiàn)向上彈出的菜單效果

8.2.8帶有加載進(jìn)度的ProgressButton按鈕使用

8.3IconButton系列

8.3.1PopupMenuButton按鈕的使用

8.3.2實(shí)現(xiàn)類似微信首頁(yè)右上角的小彈框

8.4自定義動(dòng)畫效果按鈕AnimatedButton

8.5自定義進(jìn)度交互的動(dòng)畫按鈕

8.5.1實(shí)現(xiàn)背景填充效果的按鈕

8.5.2AnimatedStatusButton的自定義分析

第9章UI布局

9.1線性布局Column

9.1.1Column中子Widget的對(duì)齊方式分析

9.1.2Column中子Widget按比例分布

9.1.3Column的寬與高自適應(yīng)

9.2線性布局Row

9.2.1Row中子Widget的對(duì)齊方式分析

9.2.2Row中子Widget按比例分布

9.3彈性布局Flex

9.4流式布局Wrap

9.5基于Wrap實(shí)現(xiàn)的tag標(biāo)簽使用

9.6流式布局Flow

9.6.1初探FlowDelegate

9.6.2圓形動(dòng)態(tài)彈出菜單

9.6.3類似開源中國(guó)的圓形動(dòng)態(tài)菜單

9.6.4向上彈出的動(dòng)態(tài)菜單

9.7層疊布局Stack

9.7.1Positioned分析

9.7.2Stack中使用Align

第10章圖片Image組件

10.1加載資源圖片

10.2加載不同分辨率資源圖片

10.3Android與iOS中屏幕分辨率簡(jiǎn)析

10.3.1分辨率

10.3.2屏幕尺寸

10.3.3屏幕密度

10.3.4Android中的屏幕像素密度(dip與dp)

10.3.5dip與ppi的區(qū)別

10.3.6rpx

10.3.7vw、vh

10.3.8Android中的圖片加載

10.3.9iOS中的圖片加載

10.3.10Flutter程序最終加載圖片

10.3.11Flutter中獲取屏幕相關(guān)信息

10.3.12asset靜態(tài)方法參數(shù)分析使用

10.4通過(guò)Image組件加載圖片

10.4.1通過(guò)FileImage加載手機(jī)存儲(chǔ)目錄下的圖片

10.4.2Android與iOS平臺(tái)下的存儲(chǔ)目錄分析

10.4.3獲取手機(jī)的存儲(chǔ)目錄空間路徑

10.4.4清除數(shù)據(jù)和清除緩存的區(qū)別

10.5通過(guò)FadeInImage組件加載圖片

10.6通過(guò)DecorationImage組件加載圖片

10.7Image.network的使用

10.8加載圓角圖片

10.9RawImage的使用分析

10.10高斯模糊效果

10.11將Widget保存為圖片

10.12圖片添加水印

10.13縮放圖片、拖動(dòng)圖片

10.14為圖片添加水波紋單擊事件

第11章復(fù)選框CheckBox組件

11.1復(fù)選框CheckBox的基本使用

11.2CheckboxListTitle的基本使用

11.3實(shí)現(xiàn)圓形的復(fù)選框

11.4一個(gè)注冊(cè)頁(yè)面

11.4.1在頁(yè)面initState之前的準(zhǔn)備

11.4.2在build函數(shù)中的構(gòu)建

第12章單選框Radio組件

12.1單選框Radio的基本使用

12.2單選框Radio屬性使用分析

12.3RadioListTitle組件的使用分析

12.4一個(gè)優(yōu)惠券選擇彈框

12.4.1優(yōu)惠券數(shù)據(jù)的模擬

12.4.2底部彈框的顯示

12.4.3優(yōu)惠券彈框UI構(gòu)建