Getx state management

Recently I learned Getx. I tried to use Getx to build the construction of Flutter project. I felt it was really easy to use and fragrant. Getx naturally decouples interface, logic, dependencies, and routing, making it cleaner to use, logic clearer, and code easier to maintain.

Learning a framework is not only to see how to use the document, more important is to see the source code to learn the author’s whole design ideas, design patterns to solve the doubts in the heart;

Learn 1–Obx, learn how Obx uses data to change the automatic UI refresh, get familiar with the whole design process, the following widgets provided in Getx are simple;

GetView

abstract class GetView<T> extends StatelessWidget {
  const GetView({Key key}) : super(key: key);

  final String tag = null;

  T get controller => GetInstance().find<T>(tag: tag);

  @override
  Widget build(BuildContext context);
}
Copy the code

Stateless Widget, simple and useful

  • The premise is that the controller is registered;
  • Use named routes to binging dependency injection routes and inherit GetView directly
  • Widgets that have identified dependencies that have been initialized need to use controller

For example,

GetPage(name: approutes.splash, Page: () => SplashPage(), binding: BindingsBuilder.put(() => Get.put(SplashController())), ), Class SplashPage extends GetView<SplashController> {@override Widget Build (BuildContext context) {return Scaffold( body: Image.asset( R.LOGO_SPLASH_ID, width: double.infinity, height: double.infinity, fit: BoxFit.cover, )); }}Copy the code

GetBuilder

  • GetBuilder is a manual state manager that calls update() when changes are needed.
  • Because GetBuilder is a manual state manager, there is less memory consumption when StreamSubscription is not maintained internally compared to Obx

GetBuilder source code is easy to understand, click to see, a brief introduction to how to use

Final GetControllerBuilder<T> Builder; /// The default is true; If the Controller is already registered, if it is lazily registered, the GetBuilder will delete it when it is removed. If the Controller is not registered, init will be called. Controller final bool global; controller final bool global; controller final bool global; Update (['id']); update(['id']); final Object id; // when there are multiple instances of the same type, the tag is differentiated; Only final String tag; Controller final bool autoRemove; /// The default false controls whether the controller final bool assignId is deleted when GetBuilder is removed. Final Object Function(T value) filter; Final void Function(state state) initState, Dispose, didChangeDependencies; final void Function(GetBuilder oldWidget, State state) didUpdateWidget; // Final T init when controller is not registered;Copy the code

GetX

  • Compared with GetBuilder, Getx automatically responds to data changes,
  • Compared with Obx, Getx can internally initialize controller, call back state life cycle, recycle controller in time, etc.
  • Getx is less efficient than GetBuilder and Obx,

MixinBuilder

  • Integrate Obx and GetBuilder features from the name
  • You can manually control the refresh, also can automatically refresh;
  • The most memory consuming, the least efficient

Getx also provides a number of local refreshes for Weidget ValueBuilder, ObxValue, etc.

Here’s a very useful technique, for example

ObxValue((data) => Switch(value: data.value, onChanged: data, // Rx has a _callable_ function! You can use (flag) => data.value = flag,), false. Obs,), /// response data data,data(); T call([T v]) {if (v! = null) { value = v; } return value; }Copy the code