StatefulWidget

StatefulWidget 是有状态控件,这样的控件拥有自己的私有数据和业务逻辑,基本定义过程如下:

定义有状态的控件

  1. // 定义一个 电影详情 控件,继承自 StatefulWidget
  2. class MovieDetail extends StatefulWidget {
  3. // 构造函数,初始化当前组件必须的 id 属性
  4. MovieDetail({Key key, @required this.id}) : super(key: key);
  5. // 电影的Id值
  6. final String id;
  7. // StatefulWidget 控件必须实现 createState 函数
  8. // 在 createState 函数中,必须返回一个继承自 State<T> 状态类的对象
  9. // 这里的 _MovieDetailState 就继承自 State<T>
  10. _MovieDetailState createState() => new _MovieDetailState();
  11. }

定义继承自 State<T> 的状态类

  1. // 这个继承自 State<T> 的类,专门用来定义有状态控件的 业务逻辑 和 私有数据
  2. class _MovieDetailState extends State<MovieDetail> {
  3. // build 函数是必须的,用来渲染当前有状态控件对应的 UI 结构
  4. @override
  5. Widget build(BuildContext context) {
  6. // 注意:在这个 _MovieDetailState 状态类中,可以使用 widget 对象访问到 StatefulWidget 控件中的数据并直接使用
  7. // 例如:widget.id
  8. return Text('MovieDetail --' + widget.id);
  9. }
  10. }

定义和修改私有数据

  1. // 这个继承自 State<T> 的类,专门用来定义有状态控件的 业务逻辑 和 私有数据
  2. class _MovieDetailState extends State<MovieDetail> {
  3. // 1. 定义私有状态数据【以 _ 开头的数据,是当前类的私有数据】
  4. int _count;
  5. // 2. 通过 initState 生命周期函数,来初始化私有数据
  6. @override
  7. void initState() {
  8. super.initState();
  9. // 2.1 把 _count 的值初始化为 0
  10. _count = 0;
  11. }
  12. // build 函数是必须的,用来渲染当前有状态控件对应的 UI 结构
  13. @override
  14. Widget build(BuildContext context) {
  15. // 注意:在这个 _MovieDetailState 状态类中,可以使用 widget 对象访问到 StatefulWidget 控件中的数据并直接使用
  16. // 例如:widget.id
  17. return Column(
  18. children: <Widget>[
  19. Text('MovieDetail --' + widget.id + ' --- ' + _count.toString()),
  20. RaisedButton(
  21. child: Icon(Icons.add),
  22. // 3. 指定点击事件的处理函数为 _add
  23. onPressed: _add,
  24. )
  25. ],
  26. );
  27. }
  28. // 4. 定义 _count 自增的函数【以 _ 开头的函数,是私有函数】
  29. void _add() {
  30. // 如果要为私有数据重新赋值,必须调用 setState() 函数
  31. setState(() {
  32. // 让私有数据 _count 自增 +1
  33. _count++;
  34. });
  35. }
  36. }