setState 的作用

1. setState 方法的作用

2. setState 的工作流程

1. 标记 State 为脏状态

2. 重新调用 build 方法

• 由于 Widget 本身是不可变的，所以 build 方法每次都会返回一个新的 Widget 实例来反映 UI 的变化。

• build 方法不会直接修改原始 Widget，而是会基于当前的 State 创建新的 Widget，这个新的 Widget 会替换掉旧的 Widget。

3. Flutter 的高效重建机制

• 树的 diff 算法：Flutter 会比较旧的 Widget 树和新的 Widget 树，找出变化的部分并进行更新。只有在必要的情况下，才会重新构建相关部分，而不会重新构建整个 UI。

• StatefulWidget 与 StatelessWidget 区别：StatefulWidget 的 build 方法会基于最新的 State 返回新的 Widget，而 StatelessWidget 的 build 方法是不可变的，每次调用时都返回相同的 Widget。

4. 更新屏幕

• 更新 UI 元素（例如文本、颜色、布局等）

• 动态创建新 Widget 实例，替换掉旧的 Widget

• 调整布局（如重新计算某个 Widget 的位置或大小）

3. 示例：如何使用 setState

• 点击按钮时：我们调用 _incrementCounter 方法，_incrementCounter 方法内部会调用 setState。

• setState 的作用：setState 通知 Flutter 状态已改变，框架会标记 State 为脏状态，并重新调用 build 方法。

• 更新 UI：build 方法会根据新的 _count 值返回新的 Widget，Flutter 会根据新的 Widget 更新 UI。

4. 总结

• setState 触发了 State 对象的重新构建，实际更新的是 StatefulWidget 的 build 方法返回的新的 Widget，而不是直接修改现有的 Widget。

• UI 更新过程：调用 setState 后，Flutter 会标记 State 为脏状态，重新调用 build 方法并返回新的 Widget，然后更新显示在屏幕上的 UI。

• 高效更新：Flutter 通过 树的 diff 算法 来高效地更新 UI，仅更新发生变化的部分，从而避免了不必要的重绘。