原文

https://medium.com/flutterdev...

参考

  • https://pub.dev/packages/get_it

注释

它的 Flutter 小部件是建设应用一个古代框架。这就像是一种反馈。在这里,咱们从小部件开始创立任何应用程序。屏幕中的每个组件都是一个小部件。这个小部件形容了依据他目前的配置和状态,他的前景应该是什么样的。使您的小部件不具备间接依赖关系,能够使您的代码更好地组织,更容易测试和保护。然而当初您须要一种从 UI 代码拜访这些对象的办法。当我来到 Flutter 从。小部件展现相似于它的想法和以后的设置和状态。Flutter 是一个收费的开源工具,用于开发挪动、桌面、 web 应用程序,只须要一个代码库。

在本文中,咱们将用 Flutter 取得它的包装来阐明什么是 Flutter 取得它。在包的帮忙下,以及如何应用他们在您的 Flutter 应用程序。那么让咱们开始吧。

Flutter :

Flutter 是谷歌的用户界面工具包,它能够帮忙你在创纪录的工夫内为挪动设施、网络和桌面构建丑陋的、本地组合的应用程序。 Flutter 提供了很棒的开发工具,具备惊人的 hot reload 性能

返回文章页面搞定它:

软件包就是这样一种简略的服务定位器,在这个服务定位器中,你有一个地方注册核心,通过注册类,咱们能够失去一个类的实例,咱们应用它来代替继承的小部件或提供者来拜访对象 Is。从你的用户界面。

服务定位器和依赖注入都是管制反转的一种模式。IOC 容许来自任何中央的申请,从注册其类类型到拜访容器。

实施方案:

第一步: 增加依赖项

将依赖项增加到 pubspec ー yaml 文件。

依赖性:

dependencies:  get_it: ^7.2.0

第二步: 进口

import 'package:get_it/get_it.dart';

第三步: 启用 AndriodX

org.gradle.jvmargs=-Xmx1536Mandroid.enableR8=trueandroid.useAndroidX=trueandroid.enableJetifier=true

代码施行:

在解释 GetIt 之前,咱们将在上面的参考文献中给出一个在咱们的代码中应用的 GitIt 办法。

这是咱们的服务定位器。

GetIt getIt = GetIt._instance_;

接下来,咱们创立了一个名为 getappmodel 的抽象类,它扩大了 ChangeNotifier。

abstract class GetItAppModel extends ChangeNotifier {  void incrementCounter();  int get counter;}

当初咱们曾经创立了一个名为 getappmodelimplementation 的类,它从 getappmodel 类中扩大,咱们曾经创立了 incrementCounter ()办法,该办法减少计数器值。

class GetItAppModelImplementation extends GetItAppModel {  int _counter = 0;  GetItAppModelImplementation() {  Future.delayed(Duration(seconds: 3)).then((_) => getIt.signalReady(this));  }  @override  int get counter => _counter;  @override  void incrementCounter() {    _counter++;    notifyListeners();  }}

在这之后,咱们将创立一个计数器应用程序,在这个程序中,咱们曾经在外部获取了两个文本部件,内部是 floatingActionButton,点击它将调用 getappmodel ()类,在计数器应用程序中,该值将在下面的列部件中减少,该列部件由 FutureBuilder 和 getIt.allReady ()包装,在将来的属性中定义。

FutureBuilder(    future: getIt.allReady(),    builder: (context, snapshot) {      if (snapshot.hasData) {        return Scaffold(          body: Center(            child: Column(              mainAxisAlignment: MainAxisAlignment.center,              children: <Widget>[                Text(                  'You have pushed the button this many times:',                ),                Text(                  getIt<GetItAppModel>().counter.toString(),                  style: Theme._of_(context).textTheme.headline4,                ),              ],            ),          ),          floatingActionButton: FloatingActionButton(            onPressed: getIt<GetItAppModel>().incrementCounter,            tooltip: 'Increment',            child: Icon(Icons._add_),          ),        );      } else {        return Column(          mainAxisAlignment: MainAxisAlignment.center,          mainAxisSize: MainAxisSize.min,          children: [            Text('Initialisation'),            SizedBox(              height: 16,            ),            CircularProgressIndicator(),          ],        );      }    })

全副代码:

import 'package:flutter/material.dart';import 'package:flutter_getit_exm/app_model.dart';import 'package:flutter_getit_exm/main.dart';class GetItExm extends StatefulWidget {  GetItExm({Key? key, required this.title}) : super(key: key);  final String title;  @override  _GetItExmState createState() => _GetItExmState();}class _GetItExmState extends State<GetItExm> {  @override  void initState() {    getIt        .isReady<GetItAppModel>()        .then((_) => getIt<GetItAppModel>().addListener(update));    super.initState();  }  @override  void dispose() {    getIt<GetItAppModel>().removeListener(update);    super.dispose();  }  void update() => setState(() => {});  @override  Widget build(BuildContext context) {    return Material(      child: FutureBuilder(          future: getIt.allReady(),          builder: (context, snapshot) {            if (snapshot.hasData) {              return Scaffold(                appBar: AppBar(                  title: Text(widget.title),                ),                body: Center(                  child: Column(                    mainAxisAlignment: MainAxisAlignment.center,                    children: <Widget>[                      Text(                        'You have pushed the button this many times:',                      ),                      Text(                        getIt<GetItAppModel>().counter.toString(),                        style: Theme._of_(context).textTheme.headline4,                      ),                    ],                  ),                ),                floatingActionButton: FloatingActionButton(                  onPressed: getIt<GetItAppModel>().incrementCounter,                  tooltip: 'Increment',                  child: Icon(Icons._add_),                ),              );            } else {              return Column(                mainAxisAlignment: MainAxisAlignment.center,                mainAxisSize: MainAxisSize.min,                children: [                  Text('Waiting for initialisation'),                  SizedBox(                    height: 16,                  ),                  CircularProgressIndicator(),                ],              );            }          }),    );  }}

结语:

在本文中,我解释了 Explore GetIt In Flutter,你能够依据本人的批改和试验,这个小介绍来自 Explore GetIt In Flutter 从咱们这边的演示。

我心愿这个博客将为您提供充沛的信息,在尝试在您的 Flutter 我的项目摸索 GetIt 在 Flutter 。咱们向你展现了什么是摸索和 Flutter 是在您的 Flutter 利用的工作,所以请尝试它。


© 猫哥

  • https://ducafecat.tech/
  • https://github.com/ducafecat
  • 微信群 ducafecat
  • b 站 https://space.bilibili.com/40...

往期

开源

GetX Quick Start

https://github.com/ducafecat/...

新闻客户端

https://github.com/ducafecat/...

strapi 手册译文

https://getstrapi.cn

微信探讨群 ducafecat

系列汇合

译文

https://ducafecat.tech/catego...

开源我的项目

https://ducafecat.tech/catego...

Dart 编程语言根底

https://space.bilibili.com/40...

Flutter 零根底入门

https://space.bilibili.com/40...

Flutter 实战从零开始 新闻客户端

https://space.bilibili.com/40...

Flutter 组件开发

https://space.bilibili.com/40...

Flutter Bloc

https://space.bilibili.com/40...

Flutter Getx4

https://space.bilibili.com/40...

Docker Yapi

https://space.bilibili.com/40...