Flutter组件精讲与实战

目录

基础篇

第1章Flutter与Dart语言

1.1Dart语言概述

1.2Flutter概述

1.3Flutter的编译模式

1.4Dart与Flutter的语法基础概述

1.4.1Dart语言的基本数据类型

1.4.2Dart语言的变量

1.4.3Dart语言的方法

1.4.4Dart语言的Map、List、Set

1.4.5Dart语言的流程控制

1.4.6Dart语言的异步编程

1.5Android Studio的调试技巧

1.5.1断点调试

1.5.2Flutter Inspector视图定位工具

1.5.3Flutter Performance内存管理工具

1.5.4Flutter 常用命令

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

2.1MaterialApp组件精通使用的简单描述

2.2MaterialApp基本使用

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

2.4路由routes配置

2.5路由配置404

2.6路由观察者

2.6.1基本使用

2.6.2route 解析

2.6.3NavigatorObservers实战

2.6.4动态路由实战

2.6.5自定义动态路由实战

2.6.6自定义圆形过渡效果路由

2.6.7特殊情况动态路由实战

2.6.8关闭当前页面

2.7样式ThemeData精讲

2.7.1brightness 属性分析

2.7.2primarySwatch属性分析

2.7.3primaryColor属性分析

2.7.4accentColor属性分析

2.7.5与触觉显示相关属性分析

2.7.6其他主题概述

2.8多主题适配

2.8.1一行代码将App渲染成灰色

2.8.2浅谈Provider进行状态管理

2.8.3Provider进行多数据模型状态管理

2.9多语言环境配置

2.9.1配置日期组件显示中文

2.9.2配置应用不适配的系统语言默认为英文

2.9.3保存用户对应用程序语言环境的偏好设置

2.9.4应用内切换语言环境然后动态更新当前语言环境

2.9.5应用内显示文字适配多语言环境

2.10StatefulWidget、Context、State

2.11语义设计Semantics

2.12Widget的分析

第3章Scaffold组件的详细综述

3.1Scaffold的基本使用

3.2FloatingActionButton的详细配置

3.2.1FloatingActionButton的类型

3.2.2FloatingActionButton的常用属性使用分析

3.2.3FloatingActionButton的shape属性分析

3.3Drawer配置侧拉页面

3.3.1用户信息组件UserAccountsDrawerHeader

3.3.2DrawerHeader

3.3.3单击按钮打开与关闭侧拉页面

3.4BottomNavigationBar配置底部导航栏菜单

3.4.1items属性分析

3.4.2type属性分析

3.4.3bottomNavigationBar结合独立的StatefulWidget使用

3.4.4bottomNavigationBar页面保活解决方案

3.5BottomAppBar配置底部导航栏菜单

3.6底部标签栏bottomSheet

第4章AppBar组件的详细综述

4.1AppBar的基本使用

4.1.1title属性分析

4.1.2线性布局Row在属性title中的使用

4.1.3Row标签结合PageView实现滑动切换

4.1.4Row标签结合TabBarView实现滑动切换

4.1.5MediaQuery解析

4.2TabBar结合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经典布局效果

4.10AppBar、SliverAppBar对比

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文字粗细设置fontWeight

5.2.5文字斜体设置

5.2.6文字间距设置

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中文字对齐方式

5.3.1文字过长显示省略号

5.3.2文字自动换行设置

5.3.3弹性布局综述

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

5.5富文本RichText使用案例

5.6文本标签

5.6.1文本标签构建

5.6.2文本标签结合流式布局使用

5.7AnimatedDefaultTextStyle的使用分析

第6章文本输入框TextField组件

6.1TextField组件的基本使用

6.1.1输入的文字不可见

6.1.2设置输入的英文首字母大写

6.1.3设置弹出的键盘类型

6.1.4键盘回车键的样式与功能

6.1.5键盘回车键切换输入框

6.1.6FocusNode输入框焦点事件的捕捉与监听

6.1.7TextField 输入文本对齐配置

6.2TextField组件的设置及允许输入的文本格式

6.2.1输入字数限制

6.2.2输入行数限制

6.2.3只允许输入数字

6.2.4只允许输入英文字母A~Z的大小写

6.2.5自定义TextInputFormatter

6.3TextField组件InputDecoration

6.3.1TextField组件去掉默认的下画线

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组件光标样式配置

6.7一个搜索框

6.7.1搜索框SearchStaticBar组件构建

6.7.2搜索输入框SearchTextFieldBar组件构建

6.7.3搜索输入框使用案例

第7章Container组件

7.1Container组件的基本使用

7.1.1Container的大小限定分析

7.1.2Container自适应包裹子Widget

7.2Container组件的内外边距

7.2.1EdgeInsets分析

7.2.2Padding分析

7.2.3Container在ListView中对子item自适应包裹

7.3Container组件decoration应用

7.3.1BoxDecoration在Container中的应用分析

7.3.2BoxDecoration在Container中的配置阴影

7.3.3BoxDecoration在Container中的配置渐变过渡样式

7.3.4BoxDecoration配置背景图像

7.3.5BoxDecoration的shape属性配置使用

7.3.6ShapeDecoration在Container中的使用分析

7.4自定义ShapeBorder

7.4.1打洞效果

7.4.2手撕优惠券的效果

7.5AnimatedContainer的基本使用

7.6ConstrainedBox组件的使用分析

第8章按钮组件

8.1MaterialButton的使用分析

8.1.1ButtonThemeData的使用分析

8.1.2各种Color的使用分析

8.1.3MaterialButton的回调函数说明

8.1.4MaterialButton的shape使用分析

8.1.5MaterialButton的宽和高分析

8.1.6MaterialButton的子Widget分析

8.1.7MaterialButton的内边距分析

8.1.8RaisedButton的使用分析

8.1.9FlatButton的使用分析

8.1.10OutlineButton的使用分析

8.2FloatingActionButton

8.2.1属性mini分析

8.2.2属性shape分析

8.2.3标签样式

8.2.4与Scaffold的底部bottomNavigationBar综合使用

8.2.5两个页面的过渡动画

8.2.6悬浮按钮的旋转变换

8.2.7悬浮按钮实现向上弹出的菜单效果

8.2.8带有加载进度的ProgressButton按钮使用

8.3IconButton系列

8.3.1PopupMenuButton按钮的使用

8.3.2实现类似微信首页右上角的小弹框

8.4自定义动画效果按钮AnimatedButton

8.5自定义进度交互的动画按钮

8.5.1实现背景填充效果的按钮

8.5.2AnimatedStatusButton的自定义分析

第9章UI布局

9.1线性布局Column

9.1.1Column中子Widget的对齐方式分析

9.1.2Column中子Widget按比例分布

9.1.3Column的宽与高自适应

9.2线性布局Row

9.2.1Row中子Widget的对齐方式分析

9.2.2Row中子Widget按比例分布

9.3弹性布局Flex

9.4流式布局Wrap

9.5基于Wrap实现的tag标签使用

9.6流式布局Flow

9.6.1初探FlowDelegate

9.6.2圆形动态弹出菜单

9.6.3类似开源中国的圆形动态菜单

9.6.4向上弹出的动态菜单

9.7层叠布局Stack

9.7.1Positioned分析

9.7.2Stack中使用Align

第10章图片Image组件

10.1加载资源图片

10.2加载不同分辨率资源图片

10.3Android与iOS中屏幕分辨率简析

10.3.1分辨率

10.3.2屏幕尺寸

10.3.3屏幕密度

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

10.3.5dip与ppi的区别

10.3.6rpx

10.3.7vw、vh

10.3.8Android中的图片加载

10.3.9iOS中的图片加载

10.3.10Flutter程序*终加载图片

10.3.11Flutter中获取屏幕相关信息

10.3.12asset静态方法参数分析使用

10.4通过Image组件加载图片

10.4.1通过FileImage加载手机存储目录下的图片

10.4.2Android与iOS平台下的存储目录分析

10.4.3获取手机的存储目录空间路径

10.4.4清除数据和清除缓存的区别

10.5通过FadeInImage组件加载图片

10.6通过DecorationImage组件加载图片

10.7Image.network的使用

10.8加载圆角图片

10.9RawImage的使用分析

10.10高斯模糊效果

10.11将Widget保存为图片

10.12图片添加水印

10.13缩放图片、拖动图片

10.14为图片添加水波纹单击事件

第11章复选框CheckBox组件

11.1复选框CheckBox的基本使用

11.2CheckboxListTitle的基本使用

11.3实现圆形的复选框

11.4一个注册页面

11.4.1在页面initState之前的准备

11.4.2在build函数中的构建

第12章单选框Radio组件

12.1单选框Radio的基本使用

12.2单选框Radio属性使用分析

12.3RadioListTitle组件的使用分析

12.4一个优惠券选择弹框

12.4.1优惠券数据的模拟

12.4.2底部弹框的显示

12.4.3优惠券弹框UI构建