Flutter GetX-依赖注入

Smoothness 2022/12/14 GetX

本文介绍Flutter的GetX的依赖注入懒加载。

只有使用Get.find才能更新视图，直接使用控制器去更新视图是不起作用的。

# Get.put

控制器

import 'package:get/get.dart';

class PutController extends GetxController {
  final _count = 0.obs;
  set count(value) => _count.value = value;
  get count => _count.value;

  add() => _count.value++;
}

1
2
3
4
5
6
7
8
9

第一个视图：put controller 实时更新

import 'package:flutter/material.dart';
import 'package:flutter_application_1/pages/put/controller.dart';
import 'package:flutter_application_1/pages/put/put_next.dart';
import 'package:get/get.dart';

class PutView extends StatelessWidget {
  PutView({Key key}) : super(key: key);

  final controller = Get.put<PutController>(PutController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Put'),
      ),
      body: Column(
        children: [
          GetX<PutController>(
            init: controller,
            initState: (_) {},
            builder: (_) => Text('${_.count}'),
          ),
          ElevatedButton(
              onPressed: () {
                controller.add();
              },
              child: const Text('add')),
          ElevatedButton(
            onPressed: () {
              Get.to(PutNextView());
            },
            child: const Text('next page'),
          )
        ],
      ),
    );
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

第二个视图：find controller 延时更新

import 'package:flutter/material.dart';
import 'package:flutter_application_1/pages/put/controller.dart';
import 'package:get/get.dart';

class PutNextView extends StatelessWidget {
  PutNextView({Key key}) : super(key: key);

  final controller = Get.find<PutController>();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Put Next'),
      ),
      body: Column(
        children: [
          GetX<PutController>(
            init: controller,
            builder: (_) => Text('${_.count}'),
          ),
          ElevatedButton(
              onPressed: () {
                controller.add();
              },
              child: const Text('add')),
        ],
      ),
    );
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

# Get.lazyPut + GetView 懒加载

控制器

import 'package:get/get.dart';

class LazyController extends GetxController {
  final _count = 0.obs;
  set count(value) => _count.value = value;
  get count => _count.value;

  add() => _count.value++;

  @override
  void onInit() {
    super.onInit();
    print("onInit");
  }

  @override
  void onClose() {
    super.onClose();
    print("onClose");
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

第一个视图

import 'package:flutter/material.dart';
import 'package:flutter_application_1/common/router/app_routes.dart';
import 'package:flutter_application_1/pages/lazyPut/controller.dart';
import 'package:get/get.dart';

class LazyPutView extends StatelessWidget {
  const LazyPutView({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('lazy put'),
      ),
      body: Column(
        children: [
          GetX<LazyController>(
            init: Get.find<LazyController>(),
            initState: (_) {},
            builder: (_) => Text('${_.count}'),
          ),
          const SizedBox(
            height: 20,
          ),
          ElevatedButton(
            onPressed: () {
              Get.find<LazyController>().add();
            },
            child: const Text('add')
          ),
          ElevatedButton(onPressed: () {
            Get.toNamed(AppRoutes.Home + AppRoutes.LazyNext);
          }, child: const Text('Next GetView Page'))
        ],
      ),
    );
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

第二个视图

import 'package:flutter/material.dart';
import 'package:flutter_application_1/pages/lazyPut/controller.dart';
import 'package:get/get.dart';

class NextPageView extends GetView<LazyController> {
  const NextPageView({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('MyPage')),
      body: Column(
        children: [
          Obx(() => Text('value -> ${controller.count}')),
          ElevatedButton(
            onPressed: () {
              controller.add();
            },
            child: const Text('add'),
          ),
        ],
      ));
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

绑定bindings

import 'package:flutter_application_1/pages/lazyPut/controller.dart';
import 'package:get/get.dart';

class LazyBinding implements Bindings {
  @override
  void dependencies() {
    Get.lazyPut<LazyController>(() => LazyController());
  }
}

1
2
3
4
5
6
7
8
9

路由

GetPage(
  name: AppRoutes.LazyPut, 
  binding: LazyBinding(), 
  page: () => const LazyPutView()
),

1
2
3
4
5

28-Flutter GetX-状态管理 01-python