flutter入坑，如何使用setState修改widget状态？

た入场券 2023-03-13 05:07 9阅读 0赞

flutter的widget是区分有状态和无状态的，也就是说在无状态的widget中，我们不可以对widget进行修改变动，而在有状态的widget中，我们可以进行状态的修改，也就是说我们可以通过使用setState对widget进行一些数据、样式的修改。

> 1.  有些widgets是有状态的, 有些是无状态的
> 2.  如果用户与widget交互，widget会发生变化，那么它就是有状态的.
> 3.  widget的状态（state）是一些可以更改的值, 如一个slider滑动条的当前值或checkbox是否被选中.
> 4.  widget的状态保存在一个State对象中, 它和widget的布局显示分离。
> 5.  当widget状态改变时, State 对象调用`setState()`, 告诉框架去重绘widget.

widget本身可以处理自己的状态数据，也可以通过父widget，那么如何使用setState进行widgets重绘呢？

1.  首先我们要创建一个StatefullWidget的子类，生成一个有状态的widget。
2.  之后我们要创建一个State子类，并在有状态widget类中进行返回，来对widget的状态进行管理。
3.  最后，将创建的有状态子类插入主Widget中

下面是最简单的代码，看看也就明白了。

import 'package:flutter/material.dart';
    
    void main() {
      runApp(MyApp());
    }
    
    class MyApp extends StatelessWidget {
      // 主方法
      @override
      Widget build(BuildContext context) {
        return StateTest();
      }
    }
    
    /**
     * 有状态Widget
     */
    class StateTest extends StatefulWidget {
      @override
      State<StatefulWidget> createState() {
        return _StatetTextState();
      }
    }
    
    /**
     * State类
     */
    class _StatetTextState extends State<StateTest> {
      bool _light = false;
    
      @override
      Widget build(BuildContext context) {
        return Container(
          child: GestureDetector(
            onTap: () {
              print('点击了'+_light.toString());
              setState(() {
                _light = true;
              });
            },
            child: Text(
              'Hello World!',
              textDirection: TextDirection.ltr,
            ),
          ),
        );
      }
    }

结束语

![format_png][]

[format_png]: /images/20230312/b863c92b97a249638baf8d6976dd1e09.png