Flutter状态管理插件getx_baik的使用

Getx Baik

[灵感来源于Getx] 本项目仅用于教育和研究目的。 对于生产环境，我不能保证其稳定性。 但是，基础的状态管理只是使用了Flutter自带的setState。

对于导航也没有额外的库， 使用的导航已经是无上下文的。

Getx目前相当流行， 但由于提供了太多功能， 有些开发者可能会选择使用更简单的状态管理工具。 另外，还有一些事情在论坛上引起了一些混乱， 但在我看来这并不是问题，因为这种情况在开源项目中很常见。 无论谁对谁错，我都承认Getx的目标已经实现， 即为了方便开发人员XD。

特别是对于像我这样比较懒的程序员XD XD， 因此就有了Getx Baik，这是一个受Getx启发的项目。 无上下文且易于使用！

Key

• Get.width
• Get.height
• GetWidget
• GetxController
• Get.to
• Get.offAll
• Get.back

Catatan

• 使用GetBuilder包装意味着在背后使用了StatefulWidget

尚未提供

• .obs
• …
• …

示例项目

• https://github.com/codekaze/contoh_getx_baik

Getting Started

main.dart

import 'package:getx_baik/shared/get/get.dart';
import 'package:getx_baik/shared/get/get_builder.dart';
import 'package:getx_baik/shared/get/get_material_app.dart';
import 'package:getx_baik/shared/get/getx_controller.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(GetMaterialApp(
    title: 'Flutter Demo',
    navigatorKey: Get.navigatorKey,
    theme: ThemeData(
      primarySwatch: Colors.blue,
    ),
    home: HomeView(),
  ));
}

class HomeController extends GetxController {
  bool loading = false;
}

class HomeView extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return GetBuilder<HomeController>(
      init: HomeController(),
      builder: (controller) {
        return Scaffold(
          appBar: AppBar(
            title: Text("Home View"),
          ),
          body: Container(
            width: Get.width,
            padding: EdgeInsets.all(20.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                // 如果loading为true，则显示加载指示器
                if (controller.loading == true)
                  Center(
                    child: CircularProgressIndicator(),
                  ),
                // 如果loading为false，则显示点击按钮
                if (controller.loading == false)
                  InkWell(
                    onTap: () async {
                      // 设置loading为true
                      controller.loading = true;
                      // 更新界面
                      controller.update();

                      // 模拟异步操作
                      await Future.delayed(Duration(seconds: 1));

                      // 设置loading为false
                      controller.loading = false;
                      // 更新界面
                      controller.update();
                    },
                    child: Card(
                      color: Colors.orange[400],
                      child: Container(
                        padding: EdgeInsets.all(20.0),
                        child: Text("Test Loading"),
                      ),
                    ),
                  ),
              ],
            ),
          ),
        );
      },
    );
  }
}

示例代码

import 'package:getx_baik/shared/get/get.dart';
import 'package:getx_baik/shared/get/get_builder.dart';
import 'package:getx_baik/shared/get/get_material_app.dart';
import 'package:getx_baik/shared/get/getx_controller.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(GetMaterialApp(
    title: 'Flutter Demo',
    navigatorKey: Get.navigatorKey,
    theme: ThemeData(
      primarySwatch: Colors.blue,
    ),
    home: HomeView(),
  ));
}

class HomeController extends GetxController {
  bool loading = false;
}

class HomeView extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return GetBuilder<HomeController>(
      init: HomeController(),
      builder: (controller) {
        return Scaffold(
          appBar: AppBar(
            title: Text("Home View"),
          ),
          body: Container(
            width: Get.width,
            padding: EdgeInsets.all(20.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                if (controller.loading == true)
                  Center(
                    child: CircularProgressIndicator(),
                  ),
                if (controller.loading == false)
                  InkWell(
                    onTap: () async {
                      controller.loading = true;
                      controller.update();

                      await Future.delayed(Duration(seconds: 1));

                      controller.loading = false;
                      controller.update();
                    },
                    child: Card(
                      color: Colors.orange[400],
                      child: Container(
                        padding: EdgeInsets.all(20.0),
                        child: Text("Test Loading"),
                      ),
                    ),
                  ),
              ],
            ),
          ),
        );
      },
    );
  }
}