Image Description

常用状态管理方法:

1.Widget管理自己的状态。

2.Widget管理子Widget状态。

3.混合管理(父Widget和子Widget都管理状态)。

如果状态是用户数据,如复选框的选中状态、滑块的位置,则该状态最好由父Widget管理。

如果状态是有关界面外观效果的,例如颜色、动画,那么状态最好由Widget本身来管理。

如果某一个状态是不同Widget共享的则最好由它们共同的父Widget管理。

Widget 管理自身状态

写一个 TapboxAState类来实际说明,这个类的作用:

1.管理TapboxA的状态。

2.定义  _active: 确定盒子的当前颜色的布尔值。

3.定义 _handleTap( ) 函数,该函数在点击该盒子时更新 _active,并调用 setState( ) 更新UI。

4.实现widget的所有交互式行为。

代码示例

class TapboxA extends StatefulWidget {
  TapboxA({Key key}) : super(key: key);
  
  @override
  _TapboxAState createState() => new _TapboxAState();
}

class _TapboxAState extends State<TapboxA> {
  bool _active = false;
  
  void _handleTap() {
    setState(() {
    _active = !_active;
    });
  }

  Widget build(BuildContext context) {
    return new GestureDetector(
      onTap: _handleTap,
      child: new Container(
        child: new Center(
          child: new Text(
            _active ? 'Active' : 'Inactive',
            style: new TextStyle(fontSize: 32.0, color: Colors.white),
          ),
        ),
        width: 200.0,
        height: 200.0,
        decoration: new BoxDecoration(
          color: _active ? Colors.lightGreen[700] : Colors.grey[600],
        ),
      ),
    );
  }
}