[Flutter] StatefulWidget 有状态的 widget

StatefulWidget 可以根据外部变量的变化而进行内容的刷新,其设计模式是:

  1. 指定一个 StatefulWidget,并 override 父类方法返回一个 state 对象
class CardHome extends StatefulWidget {
  @override
  State<CardHome> createState() => CardHomeState();
}
  1. 在 state 对象中保存状态属性,并根据状态动态渲染新的 widget,且 State 对象也有 ```build(buildContext:) 函数用于构造 widget

class CardHomeState extends State<CardHome> {
  int level = 2;
  @override
  Widget build(BuildContext context) {
    return Text("Hello - $level";
}
  1. 在 State 中可以调用 setState(fn) 函数进行状态的刷新,重新 build widget
class CardHomeState extends State<CardHome> {
  int level = 2;
  @override
  Widget build(BuildContext context) {
    return Row(
        children: <Widget>[
            Text("Hello - $level";
            FlatButton(
                onPress: () {
                    setState(() { level+= 1;)});
                },
                icon: Icon(Icons.add),
                );
        ],
    );
}