flutter中文文档:https://flutter.cn、https://flutterchina.club/docs/
电子书:https://book.flutterchina.club/
文档: http://laomengit.com/
flutter 功能例子: https://ducafecat.tech/
类型:
num、int、double、String、void、dynamic、set、list、map(Numbers、Strings、Booleans、Lists、Sets、Maps、Runes、Symbels、null)
定义变量:var、const、final
字符串插值: 变 量 、 变量、 变量、{变量}
?./??/泛型/minxins、
空安全:
1、
可空(?)类型的使用:
我们可以通过将?跟在类型的后面来表示它后面的变量或参数可接受Null:
class CommonModel {
String? firstName; //可空的成员变量
int getNameLen(String? lastName /*可空的参数*/) {
int firstLen = firstName?.length ?? 0;
int lastLen = lastName?.length ?? 0;
return firstLen + lastLen;
}
}
对于可空的变量或参数在使用的时候需要通过Dart 的避空运算符?.来进行访问,否则会抛出编译错误。
2、
当程序启用空安全后,类的成员变量默认是不可空的,所以对于一个非空的成员变量需要指定其初始化方式:
class CommonModel {
List names=[];//定义时初始化
final List colors;//在构造方法中初始化
late List urls;//延时初始化
CommonModel(this.colors);
3、
延迟初始化(late)的使用
对于无法在定义时进行初始化,并且又想避免使用?.,那么延迟初始化可以帮到你。通过late修饰的变量,可以让开发者选择初始化的时机,并且在使用这个变量时可以不用?.。
late List urls;//延时初始化
setUrls(List urls){
this.urls=urls;
}
int getUrlLen(){
return urls.length;
}
延时初始化虽然能为我们编码带来一定便利,但如果使用不当会带来空异常的问题,所以在使用的时候一定保证赋值和访问的顺序,切莫颠倒。
4、
State的空安全适配
State的空安全适配主要是根据它的成员变量是否可空进行分类:
可空的变量:通过?进行修饰
不可空的变量:可采用以下两种方式进行适配
定义时初始化
使用late修饰为延时变量
flutter 组件库:
https://api.flutter.dev/flutter/painting/Accumulator-class.html
属性:
width: 172, // 宽
height: 66, // 高
margin: EdgeInsets.only(top: 15), // margin EdgeInsets
padding: EdgeInsets.only(top: 12, left: 30), // padding EdgeInsets
decoration: BoxDecoration(
color: Colors.white, // 颜色或者背景色 Colors
borderRadius: BorderRadius.circular(10), // 圆角 BorderRadius
borderRadius: BorderRadius.only(topLeft: Radius.circular(10),topRight: Radius.circular(10)), // 设置上左和上右的圆角
border: Border.all(width: 3, style: BorderStyle.solid, color: ColorUtil.color('#EDEFF8')) // 边框 Border BorderStyle
border: Border(left: BorderSide(color: ColorUtil.color('ECEDF4'), width: 3)) // 左边border BorderSide,
image: DecorationImage( // 背景图设置 DecorationImage
image: AssetImage('${imgPath}detail_bg.png'), // 图片
fit: BoxFit.fill, // 填充方式
),
boxShadow: [
BoxShadow(
color: ColorUtil.color('DEDFE5'),
blurRadius: 25.0,
spreadRadius: 5.0,
offset: Offset(1.5, 1.5)) // 偏移
],
gradient: LinearGradient( // 渐变
begin: Alignment.topCenter, // 开始渐变方向
end: Alignment.bottomCenter, // 结束方向
colors: [
ColorUtil.color('80DDD8'), // 开始颜色
ColorUtil.color('448F87'), // 结束颜色
]
)
),
===
状态组件:
StatefulWidget:
@override
createState
MaterialApp/Scaffold/AppBar/BottomNavigationBar/RefeshInddcator/Image/TextField/PageView
StatelessWidget
@override
Widget build(BuildContext context)
Container/Text/Icon/CloseButton/BackButton/Chip/Divider/Card/AlertDialog
===
// 布局相关组件
Containe