当前位置: 首页 > article >正文

详细讲解Flutter GetX的使用

Flutter GetX 框架详解:状态管理、路由与依赖注入

GetX 是 Flutter 生态中一款强大且轻量级的全功能框架,集成了状态管理、路由管理和依赖注入三大核心功能。其设计理念是简洁高效,通过最小的代码实现最大的功能,特别适合快速开发和中小型项目。下面从基础到高级全面解析 GetX 的使用。

一、核心概念与优势

1. 三大核心功能

状态管理:比 Provider 更简单,无需 BuildContext,支持多种响应式模式。
路由管理:无需 context 即可导航,支持命名路由、路由守卫和过渡动画。
依赖注入:自动管理控制器生命周期,实现懒加载和单例模式。

2. 主要优势

零 Boilerplate:最少的样板代码,提升开发效率。
高性能:通过减少不必要的 widget 重建提升应用性能。
易测试:控制器与 UI 分离,便于单元测试。
跨平台一致性:在 iOS、Android、Web 和桌面端表现一致。

二、基础使用:快速上手

1. 添加依赖

在 pubspec.yaml 中添加:

dependencies:flutter:sdk: flutterget: ^4.6.5  # 最新稳定版

2. 状态管理示例

使用 GetX 或 Obx 创建响应式状态:

import 'package:flutter/material.dart';
import 'package:get/get.dart';// 1. 创建控制器
class CounterController extends GetxController {var count = 0.obs;  // 创建可观察的变量void increment() => count.value++;  // 更新状态
}// 2. 在UI中使用
class HomePage extends StatelessWidget {// 获取控制器实例(自动依赖注入)final CounterController controller = Get.put(CounterController());Widget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('GetX 示例')),body: Center(// 使用 Obx 监听状态变化child: Obx(() => Text('计数: ${controller.count}', style: TextStyle(fontSize: 24))),),floatingActionButton: FloatingActionButton(onPressed: controller.increment,child: Icon(Icons.add),),);}
}

三、状态管理进阶

1. 多种状态管理方式

简单状态管理(GetX/Obx):适合小型项目和简单状态。
响应式状态(Rx):使用 .obs 创建可观察对象,支持多种数据类型。
GetBuilder:轻量级状态管理,手动控制更新,适合复杂场景。

2. 响应式编程示例

Obx 和 ObxBuilder:
GetX 提供了 Obx 和 ObxBuilder 两个小部件来观察和响应状态的变化。Obx 将自动重新构建,以显示由 .obs 属性包装的变量的新值。

class UserController extends GetxController {// 可观察的用户对象var user = User(name: '张三', age: 20).obs;void updateAge(int newAge) {// 修改状态并通知监听者user.update((val) {val?.age = newAge;});}
}// 在UI中使用
Obx(() => Text('用户年龄: ${userController.user.value.age}'));

ObxBuilder:

ObxBuilder(builder: (bool condition) {return Text('Condition: $condition');},condition: myController.condition,
);

GetBuilder:
GetBuilder 允许你在小部件构建中手动触发更新。它接受一个回调函数,每当回调中的状态发生变化时,该小部件都会重新构建。

GetBuilder<MyController>(builder: (controller) {return Text('Count: ${controller.count}');},
);

3. 状态生命周期管理

class MyController extends GetxController {// 初始化时调用void onInit() {super.onInit();print('控制器初始化');}// 首次进入视图时调用void onReady() {super.onReady();print('视图已加载');}// 销毁时调用void onClose() {super.onClose();print('控制器销毁');}
}

四、路由管理

1. 简单导航

// 无参数跳转
Get.to(SecondPage());// 导航到带有名称的新屏幕
Get.toNamed('/details');// 返回
Get.back();// 带参数跳转
Get.to(SecondPage(), arguments: 'Hello GetX');// 在目标页面获取参数
final args = Get.arguments;

2. 命名路由

void main() {runApp(GetMaterialApp(initialRoute: '/',getPages: [GetPage(name: '/', page: () => HomePage()),GetPage(name: '/second', page: () => SecondPage()),GetPage(name: '/third',page: () => Third(),transition: Transition.zoom  ),// 动态路由GetPage(name: '/user/:id', page: () => UserPage()),],));
}// 使用命名路由跳转
Get.toNamed('/second');// 获取动态参数
final userId = Get.parameters['id'];

3. 路由守卫

GetPage(name: '/admin',page: () => AdminPage(),middlewares: [AuthMiddleware(), // 自定义中间件],
);class AuthMiddleware extends GetMiddleware {RouteSettings? redirect(String? route) {if (!isLoggedIn) {return RouteSettings(name: '/login');}return null;}
}

五、依赖注入

1. 简单注入

// 注册单例
Get.put(ApiService());// 注册工厂模式(每次获取新实例)
Get.lazyPut(() => DatabaseService());// 在任何地方获取实例
final api = Get.find<ApiService>();

2. 控制器生命周期管理

// 自动管理生命周期
Get.put(HomeController());// 手动控制生命周期
final controller = Get.put(HomeController(), permanent: true);
Get.delete<HomeController>(); // 手动销毁

六、高级功能

1. 国际化支持

class TranslationService extends Translations {Map<String, Map<String, String>> get keys => {'en_US': {'hello': 'Hello World'},'zh_CN': {'hello': '你好,世界'},};
}// 使用
GetMaterialApp(translations: TranslationService(),locale: Locale('zh', 'CN'),fallbackLocale: Locale('en', 'US'),
);// 在UI中使用
Text('hello'.tr);

2. 对话框和 Snackbar

// 简单对话框
Get.defaultDialog(title: '提示',middleText: '确定要删除吗?',confirm: TextButton(onPressed: () => Get.back(result: true),child: Text('确定'),),cancel: TextButton(onPressed: () => Get.back(result: false),child: Text('取消'),),
);// Snackbar
Get.snackbar('通知','操作成功',snackPosition: SnackPosition.BOTTOM,
);

七、最佳实践

控制器分层:根据功能拆分控制器,避免单个控制器过于庞大。
状态粒度控制:合理划分状态管理范围,避免全局状态滥用。
避免过度使用 GetX:对于简单项目,可选择性使用部分功能,无需全部集成。
结合其他工具:与 Dio(网络请求)、Hive(本地存储)等工具配合使用。

八.实用功能总结

1.路由和导航:

Get.to():打开新页面。
Get.toNamed():通过路由名称打开新页面。
Get.off():关闭当前页面并打开新页面。
Get.offAll():关闭所有页面并打开新页面。
Get.back():返回上一个页面。
Get.until():返回到指定页面。
Get.offNamed():关闭指定路由页面。
Get.toNamed(“/profile/1”):打开具有参数的命名路由。

2.状态管理:

GetBuilder():使用 GetX 控制器构建特定部分的界面。
Obx():用于监听和响应控制器中的可观察对象的变化。
GetX():构建整个页面并监听控制器的变化。

3.依赖注入:

Get.put(() => YourController()):注册和创建 GetX 控制器。
Get.lazyPut(() => YourController()):懒加载 GetX 控制器。
Get.find():获取控制器实例。

4.路由参数和参数管理:

Get.parameters:获取当前页面的路由参数。
Get.arguments:获取当前页面的参数(包括路由参数和其他参数)。
Get.arguments:获取上一个页面的参数。
Get.parameters[‘paramName’]:访问特定参数。

5.多语言和国际化:

GetMaterialApp():用于多语言和国际化的应用程序。
Get.updateLocale(Locale(‘en’, ‘US’)):更改应用程序的当前区域设置。

6.日志记录:

Get.log():记录日志消息,包括信息、警告、错误等级别。
Get.lazyPut(() => YourController(), tag: ‘YourTag’):为控制器设置标签以便于调试。

7.小部件操作:

Get.delete(YourController()):删除控制器。
Get.offAndToNamed(‘/newRoute’):关闭当前页面并打开另一个页面。
Get.offUntil():返回到指定页面。

8.主题和样式:

ThemeService().theme:获取当前主题。
Get.changeTheme(YourTheme()):更改应用程序主题。

9.其他工具:

GetUtils.isNullOrBlank():检查字符串是否为空或空白。
GetUtils.isEmail():检查字符串是否为有效的电子邮件地址。
GetUtils.isPhoneNumber():检查字符串是否为有效的电话号码。

九、总结

GetX 是一个功能强大、易于上手的 Flutter 框架,通过统一的 API 解决了状态管理、路由和依赖注入三大痛点。其核心优势在于简洁高效和零 context 依赖,特别适合快速开发和中小规模项目。建议开发者在新项目中尝试使用,能显著提升开发体验和代码质量。

相关文章:

详细讲解Flutter GetX的使用

Flutter GetX 框架详解&#xff1a;状态管理、路由与依赖注入 GetX 是 Flutter 生态中一款强大且轻量级的全功能框架&#xff0c;集成了状态管理、路由管理和依赖注入三大核心功能。其设计理念是简洁高效&#xff0c;通过最小的代码实现最大的功能&#xff0c;特别适合快速开发…...

ReLU 新生:从死亡困境到强势回归

背景 在深度学习领域&#xff0c;激活函数的探索已成为独立研究课题。诸如 GELU、SELU 和 SiLU 等新型激活函数&#xff0c;因具备平滑梯度与出色的收敛特性&#xff0c;正备受关注。经典 ReLU 凭借简洁性、固有稀疏性及其独特优势拓扑特性&#xff0c;依旧受青睐。然而&#…...

tensorflow image_dataset_from_directory 训练数据集构建

以数据集 https://www.kaggle.com/datasets/vipoooool/new-plant-diseases-dataset 为例 目录结构 训练图像数据集要求&#xff1a; 主目录下包含多个子目录&#xff0c;每个子目录代表一个类别。每个子目录中存储属于该类别的图像文件。 例如 main_directory/ ...cat/ ...…...

QuickJS 如何发送一封邮件 ?

参阅&#xff1a;bellard.org‌ : QuickJS 如何使用 qjs 执行 js 脚本 在 QuickJS 中发送邮件需要依赖外部库或调用系统命令&#xff0c;因为 QuickJS 本身不包含 SMTP 功能。以下是两种实现方法&#xff1a; 方法 1&#xff1a;调用系统命令&#xff08;推荐&#xff09; 使…...

clickhouse 和 influxdb 选型

以下是 ClickHouse、InfluxDB 和 HBase 在体系架构、存储引擎、数据类型、性能及场景的详细对比分析: 🏗️ ‌一、体系架构对比‌ ‌维度‌‌ClickHouse‌‌InfluxDB‌‌HBase‌‌设计目标‌大规模OLAP分析,高吞吐复杂查询 时序数据采集与监控,优化时间线管理高吞吐随机…...

GOOUUU ESP32-S3-CAM 果云科技开发板开发指南(一)(超详细!)Vscode+espidf 通过摄像头拍摄照片并存取到SD卡中,文末附源码

看到最近好玩的开源项目比较多&#xff0c;就想要学习一下esp32的开发&#xff0c;目前使用比较多的ide基本上是arduino、esp-idf和platformio&#xff0c;前者编译比较慢&#xff0c;后两者看到开源大佬的项目做的比较多&#xff0c;所以主要学习后两者。 本次使用的硬件是GO…...

C++学习思路

C++知识体系详细大纲 一、基础语法 (一)数据类型 基本数据类型 整数类型(int, short, long, long long)浮点类型(float, double, long double)字符类型(char, wchar_t, char16_t, char32_t)布尔类型(bool)复合数据类型 数组结构体(struct)联合体(union)枚举类型…...

全流程开源!高德3D贴图生成系统,白模一键生成真实感纹理贴图

导读 MVPainter 随着3D生成从几何建模迈向真实感还原&#xff0c;贴图质量正逐渐成为决定3D资产视觉表现的核心因素。我们团队自研的MVPainter系统&#xff0c;作为业内首个全流程开源的3D贴图生成方案&#xff0c;仅需一张参考图与任意白模&#xff0c;即可自动生成对齐精确…...

使用Conda管理服务器多版本Python环境的完整指南

在服务器环境中管理多个Python版本是开发者和系统管理员常见的需求&#xff0c;尤其是当不同项目依赖特定版本的Python时。本文将重点介绍如何通过Conda实现多版本Python的隔离与管理&#xff0c;确保服务器环境的稳定性和灵活性。 为什么需要多版本Python管理&#xff1f; 服…...

html 滚动条滚动过快会留下边框线

滚动条滚动过快时&#xff0c;会留下边框线 但其实大部分时候是这样的&#xff0c;没有多出边框线的 滚动条滚动过快时留下边框线的问题通常与滚动条样式和滚动行为有关。这种问题可能出现在使用了自定义滚动条样式的情况下。 注意&#xff1a;使用方法 6 好使&#xff0c;其它…...

数据通信与计算机网络——数据与信号

主要内容 模拟与数字 周期模拟信号 数字信号 传输减损 数据速率限制 性能 注&#xff1a;数据必须被转换成电磁信号才能进行传输。 一、模拟与数字 数据以及表示数据的信号可以使用模拟或者数字的形式。数据可以是模拟的也可以是数字的&#xff0c;模拟数据是连续的采用…...

【LLM大模型技术专题】「入门到精通系列教程」LangChain4j与Spring Boot集成开发实战指南

LangChain4j和SpringBoot入门指南 LangChain4jLangchain4j API语言模型消息类型内存对象ChatMemory接口的主要实现设置 API 密钥SpringBoot Configuration配置ChatLanguageModelStreamingChatLanguageModel初始化ChatModel对象模型配置分析介绍说明通过JavaConfig创建ChatModel…...

Flask 基础与实战概述

一、Flask 基础知识 什么是 Flask? Flask 是一个基于 Python 的轻量级 Web 框架(微框架)。 特点:核心代码简洁,给予开发者更多选择空间。 与 Django 对比: Django 创建空项目生成多个文件,Flask 仅需一个文件即可实现简单应用(如 "Hello, World!")。 Flask …...

东芝Toshiba e-STUDIO2110AC打印机信息

基本信息 产品类型&#xff1a;数码复合机颜色类型&#xff1a;彩色涵盖功能&#xff1a;复印、打印、扫描接口类型&#xff1a;标配为 Ethernet&#xff08;RJ45&#xff09;10/100/1000BASE - T、USB2.0 高速&#xff1b;选配为 Wireless Lan、IEEE802.11b/g/n、blueteeth。中…...

Vue3 GSAP动画库绑定滚动条视差效果 绑定滚动条 滚动条动画 时间轴

介绍 GSAP 用于创建高性能、可控制的动画效果。由 GreenSock 团队开发&#xff0c;旨在提供流畅、快速、稳定的动画效果&#xff0c;并且兼容各种浏览器。 提供了多个插件&#xff0c;扩展了动画的功能&#xff0c;如 ScrollTrigger&#xff08;滚动触发动画&#xff09;、Dra…...

grafana-mcp-analyzer:基于 MCP 的轻量 AI 分析监控图表的运维神器!

还在深夜盯着 Grafana 图表手动排查问题&#xff1f;今天推荐一个让 AI 能“读图说话”的开源神器 —— grafana-mcp-analyzer。 想象一下这样的场景&#xff1a; 凌晨3点&#xff0c;服务器告警响起。。。你睁着惺忪的眼睛盯着复杂的监控图表 &#x1f635;‍&#x1f4ab;花…...

git commit 执行报错 sh: -/: invalid option

目录 目录 1. 检查 Git 钩子脚本&#xff08;核心步骤&#xff09;2. 临时绕过钩子&#xff08;快速提交&#xff09;3. 修复钩子依赖环境4. 重新初始化 Husky&#xff08;如适用&#xff09;5. 验证用户配置 Tips&#xff1a; 如果是 clone 下来的新项目直接进行 步骤 4 。…...

uniapp 设置手机不息屏

在使用 UniApp 开发应用时&#xff0c;有时需要在设备长时间未操作时实现息屏保护功能&#xff0c;以节省电量和保护屏幕。以下是如何在 UniApp 中实现这一功能的步骤。 示例一 // 保持屏幕常亮 uni.setKeepScreenOn({keepScreenOn: true });// 监听应用进入后台事件 uni.onH…...

【题解-洛谷】B3622 枚举子集(递归实现指数型枚举)

题目&#xff1a;B3622 枚举子集&#xff08;递归实现指数型枚举&#xff09; 题目描述 今有 n n n 位同学&#xff0c;可以从中选出任意名同学参加合唱。 请输出所有可能的选择方案。 输入格式 仅一行&#xff0c;一个正整数 n n n。 输出格式 若干行&#xff0c;每行…...

(LeetCode 每日一题)3170. 删除星号以后字典序最小的字符串(贪心+栈)

题目&#xff1a;3170. 删除星号以后字典序最小的字符串 思路&#xff1a;贪心栈&#xff0c;时间复杂度0(n)。 对于每一个‘ * ’&#xff0c;优先选最右边的最小字符&#xff0c;才会使最终得到的字符串最小。 用栈&#xff0c;来记录每个字符的位置下标。细节看注释。 C版本…...

Protobuf 中的类型查找规则

a.proto syntax "proto2"; //protoc3生成代码兼容proto2语法 package pkgA; message Example { }ba.proto package pkgB.pkgA; message Example { }b.proto syntax "proto3"; //protoc3生成代码兼容proto2语法 package pkgB; import "test1/a.pr…...

Python项目中添加环境配置文件

在Python项目中添加配置文件有多种方式&#xff0c;每种方式对应不同的依赖包和读取方法。以下是 7种主流配置管理方案&#xff0c;包含安装命令、配置示例和变量读取方法&#xff1a; 1. .env 文件&#xff08;推荐简单项目&#xff09; 依赖包: python-dotenv pip install …...

【区块链基础】区块链的 Fork(分叉)深度解析:原理、类型、历史案例及共识机制的影响

区块链的 Fork(分叉)全面解析:原理、类型、历史案例及共识机制的影响 在区块链技术的发展过程中,Fork(分叉)现象是不可避免且极具影响力的一个环节。理解区块链分叉的形成原因、具体表现以及共识机制对分叉的作用,对于深入把握区块链技术架构及其治理机制至关重要。 本…...

IOS 打包账号发布上传和IOS Xcode证书配置

xcode下载 https://developer.apple.com/download/all/ App发布 https://appstoreconnect.apple.com/ https://appstoreconnect.apple.com/teams/83ba877c-af24-4fa5-aaf2-e9b9b6066e82/apps/6473148620/testflight/groups/eb983352-b2e2-4c29-bbb7-071bf7287795 https://devel…...

使用 HTML + JavaScript 实现文章逐句高亮朗读功能

在这个信息爆炸的时代&#xff0c;我们每天都要面对大量的文字阅读。无论是学习、工作还是个人成长&#xff0c;阅读都扮演着至关重要的角色。然而&#xff0c;在快节奏的生活中&#xff0c;我们往往难以找到足够的安静时间专注于阅读。本文用 HTML JavaScript 实现了一个基于…...

【CSS-4】掌握CSS文字样式:从基础到高级技巧

文字是网页内容的核心载体&#xff0c;良好的文字样式设计不仅能提升可读性&#xff0c;还能增强网站的整体视觉效果。本文将全面介绍CSS中控制文字样式的各种属性和技巧&#xff0c;帮助您打造专业级的网页排版。 1. 基础文字属性 1.1 字体设置 (font-family) body {font-f…...

双碳时代,能源调度的难题正从“发电侧”转向“企业侧”

安科瑞刘鸿鹏 摘要 在“双碳”战略和能源结构转型的大背景下&#xff0c;企业储能电站逐步成为提升能源利用效率、增强用能韧性的重要手段。随着系统规模扩大与运行复杂度提升&#xff0c;如何对光伏、储能、负荷等流进行实时调控&#xff0c;成为智慧用能的关键。ACCU100微…...

3. 简述node.js特性与底层原理

&#x1f63a;&#x1f63a;&#x1f63a; 一、Node.js 底层原理&#xff08;简化版&#xff09; Node.js 是一个 基于 Chrome V8 引擎构建的 JavaScript 运行时&#xff0c;底层核心由几部分组成&#xff1a; 组成部分简要说明 1.V8 引擎 将 JS 编译成机器码执行&#xff0…...

OpenCV CUDA模块图像处理------创建一个模板匹配(Template Matching)对象函数createTemplateMatching()

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 创建一个用于在 GPU 上执行模板匹配的 TemplateMatching 对象。 该函数返回一个指向 TemplateMatching 的智能指针&#xff08;Ptr&#xff09;…...

【Kubernetes】K8s 之 ETCD - 恢复备份

ETCD 是一个高可用的分布式键值存储&#xff0c;常用于存储配置信息和服务发现等。当系统出现故障或数据损坏时&#xff0c;能够快速恢复成先前的状态是维护系统稳定性的关键。ETCD 提供了备份和恢复功能&#xff0c;以确保数据持久性和可靠性&#xff0c;一起来看看如何操作吧…...