[flutter-14]StatefulWidget-State

1. StatefulWidget-State

1.1 定义到widget中的数据都是不可变的、必须定义为final、为什么？

• 是因为flutter在设计的时候就决定了一旦widget中展示的数据发生变化、就需要重新构建整个widget。
• flutter通过一些机制来限定定义到widget中的成员变量必须是final的。

1.2 flutter如何做到我们在开发中定义在widget中的数据一定是final的呢？

• widget 源码:

@immutable
abstract class Widget extends DiagnosticableTree {
	// ...省略代码
}

• @immutable(注解)关键字: 被@immutable注解修饰的类或者子类都必须是不可变的。

1.3 flutter 如何存储widget状态？

• widget是不可变的、那么statefulwidget是如何来存储可变的状态的？
  • statelesswidget无所谓、因为它里面的数据通常都是定义好就不再修改了。
  • statefulwidget是有状态的、这个如何做到呢？
    • flutter将statefulwidget设计成两个类：
      • 一个类继承自statefulwidget、作为widget树的一部分
      • 一个类继承自state、用于记录statefulwidget会变化的状态、并且根据变化的状态、构建出新的widget。

1.4 创建一个statefulwidget的格式

// StatefulWidget
class MyStatefulWidget extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // 将创建的State返回
    return MyState();
  }
}

// State
class MyState extends State<MyStatefulWidget> {
  @override
  Widget build(BuildContext context) {
    return <构建自己的Widget>;
  }
}

// 范例
class ContentfulWidget extends StatefulWidget {
  @override
  _ContentState createState() => _ContentState(); // 简约写法
  ContentfulWidget(this.counter); // 自定义类
  final int counter; // 定义的final变量
}

class _ContentState extends State<ContentfulWidget> {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(
            'You have pushed the button this many times:',
            style: TextStyle(fontSize: 15),
          ),
          Text(
            '${widget.counter}',
            style: TextStyle(fontSize: 40),
          ),
        ],
      ),
    );
  }
}