flutter选中状态,flutter 保持页面状态

Flutter状态管理--GetX的简单使用

一、前言

创新互联公司是一家专注于网站制作、成都网站建设与策划设计,溧阳网站建设哪家好?创新互联公司做网站,专注于网站建设十余年,网设计领域的专业建站公司;建站业务涵盖:溧阳等地区。溧阳做网站价格咨询:028-86922220

Flutter开发，就需要对各种状态的管理，就是在请求数据的时候需要实时变化，各种交互变化等，在没有使用GetX之前使用Provider,用Provider的时候觉得真香，挺方便的，需要刷新的时候直接 notifyListeners(); 用了GetX之后觉得Provider太繁琐了。这边介绍下GetX的使用以及常用的方法。

二、 GetX

GetX 是 Flutter 上的一个轻量且强大的解决方案：高性能的状态管理、智能的依赖注入和便捷的路由管理。

1、相关优势：

三、使用

1、第一步 引入get

2、第二步

修改入口、配置路由

3、路由

Routes类

Pages类

4、状态管理

我一般一个page对应一个controller， controller来处理逻辑，控制page.

简单使用

5、依赖注入

依赖注入也是我喜欢的，可以减少很多工作。

第一步

第二步

6、跨页面交互

7、黑暗模式

可以参考前期写的博客。 黑暗模式的适配

Flutter （三） 状态管理

Flutter （二）布局

Flutter （三） 状态管理

Flutter （四） Map转模型

Flutter （五） 网络请求

Flutter （六） 保留界面状态

Flutter （七） 混合开发 [配置]

Flutter （八） 混合开发 [Flutter完整项目嵌入到原生]

Flutter的setState（状态刷新）

Flutter有两个常用的状态类：

标记为dirty，执行的markNeedsBuild，定义在Element类中：

当前Element节点被标记为dirty，同时调用owner的scheduleBuildFor方法：

将element元素添加到全局的“脏”链表里。

BuildOwner用来管理哪些需要更新的Widget。这个owner最开始被初始化的地方在WidgetsBinding的initInstances方法中，随后初始化了onBuildScheduled方法，对应执行的是_handleBuildScheduled，定义在WidgetsBinding类中：

ensureVisualUpdate 方法定义在SchedulerBinding类中：

在提交下一帧绘制的时候会调用到scheduleFrame方法，提交给引擎绘制，看看scheduleFrame方法，也定义在SchedulerBinding类中：

提交给引擎绘制之后，会收到onDrawFrame的回调，最终执行到_handleDrawFrame方法中，对应的是handleDrawFrame方法，定义在SchedulerBinding类中：

在RendererBinding的initInstances方法中添加了一个回调到这个List中，对应的是RenderBinding的drawFrame方法，对应的节点进行绘制渲染操作。

WidgetsBinding中的drawFrame方法：

看看这里的buildScope方法，定义在BuildOwner方法中。在上面 scheduleBuildFor 方法介绍中有提到："scheduleBuildFor 是把一个 element 添加到 _dirtyElements 链表，以便当[WidgetsBinding.drawFrame]中调用 buildScope 的时候能够重构 element。onBuildScheduled()是一个 BuildOwner 的回调"。在 drawFrame 中调用 buildOwner.buildScope(renderViewElement)更新 elements。

_dirtyElements列表在遍历的过程中执行rebuild方法，此时将所有标记为dirty的Element节点依次执行rebuild，preformRebuild，build，updateChild，update方法，执行界面更新。完成build，update操作完成之后，后续会将需要绘制的RenderObject添加到需要layout的列表中，等待绘制渲染。所有绘制完成之后将_dirtyElments列表清空，_inDirtyList标记位置为false。

提交给引擎绘制渲染

看看super.drawFrame()，这里就执行到了RendererBinding类中，定义如下：

这里就是将最终需要绘制渲染的画面提交给引擎的地方了，绘制完成之后就在界面显示更新后的视图了。

Flutter状态管理（五）：Redux

Flutter状态管理系列：

Flutter状态管理（一）：ScopedModel

Flutter状态管理（二）：Provider

Flutter状态管理（三）：BLoC（Business Logic Component）

Flutter状态管理（四）：ReactiveX之RxDart

Flutter状态管理（五）：Redux

有做过H5前端开发的朋友应该很早就接触过这个，Redux在React/VUE中，与在Flutter/Dart中概念一样，没有任何区别；唯一的区别只是使用上的不同。

它主要由三部分组成：

下图是一个完整的数据触发及更新流程：

我们看到上面整个数据流，都是单向的，由View发起，最后到View的更新；

为啥这样设计？

小节二介绍了Redux最基本的原理，但是，如何用Redux来做一些异步操作，比如：加载数据、请求API等？这里就引出来了Redux的中间件（Middleware），中间件能够让我们使得action在到达reducer之前，做些其它“动作”！有了中间件，我们不但可以请求API，还可以改变action，使得分发到其它reducer中去；

上图是有Middleware的流程图。

Redux在Flutter中的使用与在JavaScript中的使用方式稍微有点不同，为啥？

因为JavaScript是弱类型语言，而Dart是强类型语言，这就使得在JS中每个reducer可以独立管理，而在Flutter中需要由一个大对象来管理！

无论在JS中还是在Flutter中，通常都将action、reducer、store各自建一目录，放在redux目录下，目录结构如下：

ReduxPage在build中，也可以直接用StoreBuilder（参考ReduxPage2中写法），因为StoreBuilder也是InheritedWidget。

正因为Redux在Flutter中与在JS中不同，因此，在Flutter中，建议：