在码农的世界里,优美的应用体验,来源于程序员对细节的处理以及自我要求的境界,年轻人也是忙忙碌碌的码农中一员,每天、每周,都会留下一些脚印,就是这些创作的内容,有一种执着,就是不知为什么,如果你迷茫,不妨来瞅瞅码农的轨迹。



优美的音乐节奏带你浏览这个效果的编码过程坚持每一天,是每个有理想青年的追求追寻年轻人的脚步,也许你的答案就在这里如果你迷茫 不妨来瞅瞅这里



我在 2020年时,总结过 Bloc 、Provider、Stream 跨组件通信的使用方式,大家有兴趣可以来瞅瞅


Flutter Provider 异步通信、Provider状态管理 Flutter BLoC 异步通信、BlocBuilder的基本使用、BlocProvider的初探 Flutter StreamBuilder 实现的一个倒计时功能 Flutter StreamBuilder 异步更新数据 Flutter StreamController 异步通信、Streamr 流异步通信 Flutter ValueNotifier 异步通信、ValueListenableBuilder异步更新数据


在2021年,Provider扩展了5.0,使用起来更方便,于是我重新录制制作了一期教程,大家可以点击这里来查看【网易云视频课程】;当然大家也可以关注一下公众号(biglead),视频教程是首先在公众号中免费播出,每日都会有技术类的内容发布。

在 Flutter 开发中,跨组件通信,数据更新,这些常被称为状态管理,GetX 是一个比较轻量级的状态管理框架,本节讲解的是 GetX 的基本使用。

在2021年4月初,我们在应用开发中大量使用了 GetX,目前看来效果还不错,于是我最近也出了一套GetX的从入门到源码原理的分析教程,欢迎大家关注更新。


【1 GetX 基本使用路由管理】【2 GetX 使用入门 程序计数器】


第一步 使用 GetMaterialApp

//程序入口
void main() {
runApp(RootApp());
}

class RootApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
//使用 GetX第一步
return GetMaterialApp(
theme: ThemeData(
primarySwatch: Colors.blue,
),
//默认显示的首页页面
home: CountObsMainPage(),
);
}
}

GetMaterialApp 对于路由、snackbar、国际化、bottomSheet、对话框以及与路由相关的高级apis和没有上下文(context)的情况下是起重要作用的,它只是一个Widget,它的子组件是默认的MaterialApp。

第二步定义 Controller

import 'package:get/get.dart';

///第一步定义 Controller
class CountController extends GetxController{

//声明为被观察者
RxInt _count = 0.obs;

RxInt get getCount => _count;

//操作方法
void addCount() {
_count++;
}

}

第三步 操作数据与显示数据

就是定义就是定义页面主体显示 你甚至都不用使用 StatefulWidget,代码如下:

class CountObsMainPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Gex 响应编程"),
),
backgroundColor: Colors.white,

///填充布局
body: Container(
padding: EdgeInsets.all(30),
width: double.infinity,
height: double.infinity,
child: Column(
children: [


GetX<CountObsController>(
//初始化控制器
init: CountObsController(),
//监听回调
builder: (CountObsController controller) {
return Text("当前 count 的值为 ${controller.getCount}");
},
),


//观察者自动更新
Obx(() {
return Text(
"Obx 当前 count 的值为 ${Get.find<CountObsController>().getCount}");
}),



],
)),
//点击按钮修改值
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () {
Get.find<CountObsController>().addCount();
},
),
);
}
}

完毕

不局限于思维,不局限语言限制,才是编程的最高境界。

以小编的性格,肯定是要录制一套视频的,随后会上传

有兴趣 你可以关注一下公众号 biglead 来获取最新的学习资料