构造函数

flutter官方给的示例代码，没有对构造函数进行语法解释，记录一下详解。

class MyWidget extends StatefulWidget {final String userName;MyWidget({Key key, this.userName}) : super(key: key);_MyWidgetState createState() => _MyWidgetState();
}class _MyWidgetState extends State<MyWidget> {}

key

key 表示 widget 的标识符. flutter 会为每一个 widget 自动指定 key 值，一旦对不同的 widget 指定了相同的’key’属性, 那么在 widget 被渲染为 element 时就会被复用.

# 调用自己得构造函数
MyWidget();# 调用父类构造函数，并传一个参数key。（将当前widget得默认的key值传给父类得key属性值）.
super(key:key)

关于构造函数中这个大括号的意思解释：

1.调用自己得构造函数，并声明可选参数
2.通过大括号{}来申明可选参数，如果去掉大括号，就表示必选参数
3.调用 MyWidget 时,如果是可选参数，

示例：MyWidget 定义可选参数，RaisedButton 调用

// 申明一个可选参数 userName
class MyWidget extends StatefulWidget {final String userName;MyWidget({this.userName}) : super();_MyWidgetState createState() => _MyWidgetState();
}
class _MyWidgetState extends State<MyWidget> {}// 调用可选参数类:
RaisedButton(child: Text('raiseButton'),onPressed: () {String str = "Ifredom";Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) {return new MyWidget(userName: str); // 注意写法},));},
),

// 申明一个必选参数: userName
class MyWidget extends StatefulWidget {final String userName;MyWidget(this.userName) : super(); // 注意此处去掉了大括号_MyWidgetState createState() => _MyWidgetState();
}
class _MyWidgetState extends State<MyWidget> {}// 调用可选参数类:
RaisedButton(child: Text('raiseButton'),onPressed: () {String str = "Ifredom";Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) {return new MyWidget(str); // 注意写法,因为参数是必选，所以可以直接根据参数位置推断，写法上就省略了username，},));},
),

思考题：关于传参，如果想要传一个必选参数，和一个可选参数，应该如何写呢？

关于冒号`:`的含义

冒号的作用就是初始化。在执行构造函数体之前,初始化实例变量.

class MyWidget extends StatefulWidget {// final String userName;final String userName;MyWidget() : userName = 'ifredom’s name!';_MyWidgetState createState() => _MyWidgetState();
}

所以示例中的代码，我们使用的一个变种写法，调用 super()这个内置方法，去对父类进行初始化.
下面的示例中，MyWidget 继承自 StatefulWidget，而父类 StatefulWidget 构造函数中有一个属性叫做 key,没有属性叫做 userName.

class MyWidget extends StatefulWidget {// final String userName;final String userName;MyWidget() : super(userName : 'ifredom’s name!'); // 此句代码错误，对比使用// MyWidget() : super(key: key); // 此句正确_MyWidgetState createState() => _MyWidgetState();
}

关于`key`的使用场景

当使用 Stateless Widget 时，我们并不需要使用 key，
当使用 Stateful Widget 时，widget 内有数据移动和改变并且需要显示到界面时才需要 key，否则可以不写。
在具有相同父级的[Element]中，键必须是唯一的。[Key]的子类应该是[LocalKey]或[GlobalKey]的子类。

# Key表示类型，key表示为当前widget的标识符，是flutter自动送给你的值,所以不用像 userName 一样去声明一下.
> MyWidget({Key key, this.userName})# 此语法表示 ：在构造函数体执行之前进行变量的初始化，变量使用逗号分隔，该过程叫初始化列表
# 第一个`key`为父类定义的一个属性名，类似于userName（不可更改，默认名为key），第二个`key`为自己的`key`，由flutter隐式创造
> :super(key: key)# 生成额外得key的方法
> : super(key: new ObjectKey(userName));

参考资料

硅谷大佬-王叔不秃

------ 如果文章对你有用，感谢右上角 >>>点赞 | 收藏 <<<

flutter - 构造函数相关推荐

【Flutter】Future 与 FutureBuilder 异步编程代码示例 ( FutureBuilder 构造函数设置 | 处理 Flutter 中文乱码 | 完整代码示例 )
文章目录一.FutureBuilder 简介二.处理 Flutter 中的中文乱码三.完整代码示例四.相关资源一.FutureBuilder 简介 FutureBuilder 本质是组件 : ...
【Flutter】Image 组件 ( Image 组件简介 | Image 构造函数 | Image.network 构造函数 | Image.asset 构造函数 )
文章目录一.Image 组件简介二.Image 构造函数三.Image.network 构造函数四.Image.file 构造函数五.Image.asset 构造函数六.Image.mem ...
【Flutter】GridView 网格布局 ( GridView.count 构造函数 | crossAxisCount 参数指定每行元素个数 )
文章目录一.GridView 网格布局简介二.完整代码示例三.相关资源一.GridView 网格布局简介 GridView 可用于显示网格布局 ; 一般使用 GridView.count 函数 ...
Flutter学习笔记：identical函数的用法以及常量构造函数的特点
identical函数用法: bool identical( Object? a, Object? b ) 作用:检查两个引用是否指向同一个对象,简单说就是检查两个实例是否共用一个存储空间例1: ...
类的初始化列表_【Flutter 111】Flutter手把手教程Dart语言——类、类的的成员变量和方法、类的构造函数...
类 Dart是一种面向对象的语言,所有对象都是一个类的实例,而所有的类都继承自Object类.每个除了Object类之外的类都只有一个超类,一个类的代码可以在其它多个类继承中重复使用. 类的实例变量 ...
flutter中的生命周期
前言和其他的视图框架比如android的Activity一样,flutter中的视图Widget也存在生命周期,生命周期的回调函数提现在了State上面.理解flutter的生命周期,对我们写出一个 ...
用Flutter + Dart快速构建一款绝美移动App
作者 | Wojciech Kuroczycki 译者 | 弯月来源 | CSDN(ID:CSDNnews) 如今,与前端或移动相关的新框架层出不穷.所有从事Web开发的人都应该熟悉各种目不暇接的新 ...
构建你的第一个Flutter视频通话应用
Flutter 1.0 发布也已经有一段时间了,春节后声网发布了Flutter平台上的Agora Flutter SDK(一个基于 Flutter 开发的 Plugin),今天我们就来看一下如何使用A ...
Flutter 布局控件完结篇
本文对Flutter的29种布局控件进行了总结分类,讲解一些布局上的优化策略,以及面对具体的布局时,如何去选择控件. 1. 系列文章 Flutter 布局详解 Flutter 布局(一)- Conta ...

flutter - 构造函数

构造函数

key

关于冒号`:`的含义

关于`key`的使用场景

参考资料

flutter - 构造函数相关推荐

最新文章

热门文章

flutter - 构造函数

构造函数

key

关于冒号:的含义

关于key的使用场景

参考资料

flutter - 构造函数相关推荐

最新文章

热门文章

关于冒号`:`的含义

关于`key`的使用场景