【Flutter】多语言方案二:GetX 版

2024-04-19 14:52
文章标签 语言 方案 flutter getx

本文主要是介绍【Flutter】多语言方案二:GetX 版,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

介绍

多语言方案:GetX版,需要手动自定义字符串引用常量,优点不需要自己管理状态。


文章目录

  • 介绍
  • 运行效果
  • 一、安装 GetX
  • 二、使用
    • 1.语言配置 在lib/core下创建一个language文件夹,文件夹下创建一个local.dart文件
    • 2.language文件夹下创建一个messages.dart文件
    • 3. 主入口MaterialApp改成GetMaterialApp
    • 4. 配置及调用
    • 5.多语言切换


运行效果

在这里插入图片描述


一、安装 GetX

dependencies:
get: ^4.6.6

二、使用

1.语言配置 在lib/core下创建一个language文件夹,文件夹下创建一个local.dart文件

class Local {static const String appName = 'BraveComponent';static const String helloWorld = '你好,世界';static const String followerSystemLanguage = '跟随系统语言';static const String simplifiedChinese = '简体中文';static const String traditionalChinese = '繁体中文';static const String english = '英文';static const String setting = '设置';static const String multiLanguage = '多语言';static const String theme = '主题';
}

2.language文件夹下创建一个messages.dart文件

import 'package:get/get.dart';import 'local.dart';class Messages extends Translations {@overrideMap<String, Map<String, String>> get keys => {'zh_CN': {Local.appName: 'BraveComponent',Local.helloWorld: '你好,世界',Local.followerSystemLanguage: '跟随系统语言',Local.simplifiedChinese: '简体中文',Local.traditionalChinese: '繁体中文',Local.english: '英文',Local.setting: '设置',Local.multiLanguage: '多语言',Local.theme: '主题',},'zh_HK': {Local.appName: 'BraveComponent',Local.helloWorld: '妳好,世界',Local.followerSystemLanguage: '跟隨系統語言',Local.simplifiedChinese: '簡體中文',Local.traditionalChinese: '繁體中文',Local.english: '英文',Local.setting: '設置',Local.multiLanguage: '多語言',Local.theme: '主題',},'en_US': {Local.appName: 'BraveComponent',Local.helloWorld: 'HelloWorld',Local.followerSystemLanguage: 'FollowerSystemLanguage',Local.simplifiedChinese: 'SimplifiedChinese',Local.traditionalChinese: 'TraditionalChinese',Local.english: 'English',Local.setting: 'Setting',Local.multiLanguage: 'MultiLanguage',Local.theme: 'Theme',},};
}

3. 主入口MaterialApp改成GetMaterialApp

main.dart类

import 'package:flutter/material.dart';import 'app.dart';
import 'core/cache/cache/cache.dart';
import 'l10n_app.dart';void main() async {await Cache.instance.init();// runApp(L10nApp()); //flutter_localizations与GetX配合版的多语言runApp(const App()); //GetX版多语言
}

app.dart类

import 'package:brave_component/core/utils/language_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:get/get.dart';import 'core/language/messages.dart';
import 'l10n/l10n.dart';
import 'routes/route_pages.dart';
import 'routes/route_path.dart';class App extends StatefulWidget {const App({super.key});@overrideState<App> createState() => AppState();
}class AppState extends State<App> {@overrideWidget build(BuildContext context) {return GetMaterialApp(initialRoute: RoutePath.main,getPages: RoutePages.getPages,title: 'component',theme: ThemeData(colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),useMaterial3: true,),translations: Messages(),locale: LanguageUtils.getLocale(),fallbackLocale: const Locale("zh", "CN"),localeResolutionCallback: (deviceLocale, supportedLocales) {print('当前语言:${deviceLocale.toString()}');return;},supportedLocales: AppLocalizations.supportedLocales,localizationsDelegates: const [AppLocalizations.delegate,GlobalCupertinoLocalizations.delegate,GlobalWidgetsLocalizations.delegate,GlobalMaterialLocalizations.delegate],);}
}

language_utils.dart类

import 'package:brave_component/l10n/l10n.dart';
import 'package:flutter/widgets.dart';
import 'package:get/get.dart';import '../../l10n_app.dart';
import '../cache/helpers/cache_helper.dart';
import '../enums/language.dart';class LanguageUtils {static String getLanguage(BuildContext context, String code) {late String language;switch (code) {case 'fs-Lan':language = context.l10n.followerSystemLanguage;break;case 'zh-CN':language = context.l10n.simplifiedChinese;break;case 'zh-HK':language = context.l10n.traditionalChinese;break;case 'en-US':language = context.l10n.english;break;default:language = context.l10n.followerSystemLanguage;break;}return language;}static Locale? getLocale() {Locale? locale;String code = CacheHelper.countryCode;List<String> lang = code.split('-');locale = (code == Language.fsLan.countryCode)? Get.deviceLocale: Locale(lang[0], lang[1]);return locale;}static void updateLocale(String countryCode, {bool isL10n = false}) {List<String> lang = countryCode.split('-');Get.updateLocale((countryCode == Language.fsLan.countryCode)? Get.deviceLocale!: Locale(lang[0], lang[1]));CacheHelper.saveCountryCode(countryCode);if (isL10n) {L10nAppState.setting.changeLocale!();}}
}

4. 配置及调用

translations: Messages(),//所有的多语言翻译资源
locale: Get.deviceLocale,//跟随系统设置语言 持久化以后这里改一下
fallbackLocale: Locale("zh", "CN"),//未提供当前Locale翻译时,备用的翻译
  - 使用   Text(Local.helloWorld.tr)  

5.多语言切换

multi_language_view.dart类

import 'package:brave_component/core/enums/language.dart';
import 'package:brave_component/core/language/local.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';import '../../../../../core/res/colours.dart';
import '../../../../../widgets/base/texts.dart';
import 'multi_language_logic.dart';class MultiLanguagePage extends StatelessWidget {MultiLanguagePage({super.key});final logic = Get.find<MultiLanguageLogic>();@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Texts.fontSize18Normal(Local.multiLanguage.tr,color: Colours.titleColor),leading: GestureDetector(onTap: () {Get.back(result: 'changeLanguage');},child: const Icon(Icons.arrow_back),),),body: Container(padding: const EdgeInsets.symmetric(vertical: 15),// child: ListView(//   children: ListTile.divideTiles(//           context: context,//           tiles: Language.values//               .map((e) =>//                   GetBuilder<MultiLanguageLogic>(builder: (logic) {//                     return ListTile(//                       title: Texts.fontSize14Normal(e.title,//                           color: Colours.titleColor),//                       trailing: e.countryCode == logic.countryCode//                           ? const Icon(Icons.check,//                               color: Colours.primaryColor)//                           : null,//                       onTap: () {//                         logic.changeLanguage(e.countryCode);//                       },//                     );//                   }))//               .toList())//       .toList(),// ),child: ListView.separated(itemBuilder: (context, index) {return _itemContent(context, index);},separatorBuilder: (_, index) => const Divider(),itemCount: Language.values.length),),);}Widget _itemContent(BuildContext context, int index) {return GetBuilder<MultiLanguageLogic>(builder: (logic) {return Container(padding: const EdgeInsets.symmetric(horizontal: 15),height: 44,child: GestureDetector(onTap: () {logic.changeLanguage(Language.values[index].countryCode);},child: Row(children: [Expanded(child: Texts.fontSize14Normal(Language.values[index].title,color: Colours.titleColor)),Visibility(visible:logic.countryCode == Language.values[index].countryCode,child: const Icon(Icons.check, color: Colours.primaryColor))],),),);});}
}

multi_language_logic.dart类

import 'package:brave_component/core/cache/helpers/cache_helper.dart';
import 'package:get/get.dart';import '../../../../../core/utils/language_utils.dart';class MultiLanguageLogic extends GetxController {late String countryCode;@overridevoid onInit() {super.onInit();countryCode = CacheHelper.countryCode;}void changeLanguage(String code) {countryCode = code;LanguageUtils.updateLocale(code);update();}
}

multi_language_binding.dart类


import 'package:get/get.dart';import 'multi_language_logic.dart';class MultiLanguageBinding extends Bindings {@overridevoid dependencies() {Get.lazyPut(() => MultiLanguageLogic());}
}

language.dart类

enum Language {fsLan(title: "跟随系统语言", countryCode: "fs-Lan"),zhCN(title: "简体中文", countryCode: "zh-CN"),zhHK(title: "繁体中文", countryCode: "zh-HK"),enUS(title: "English", countryCode: "en-US");final String title;final String countryCode;const Language({required this.title, required this.countryCode});
}

这里关于GetX的binding用法不会的可以参考Flutter 多语言、主题切换之GetX库!这个博主开发的GetX插件,生成模版代码提高研发效率,建议看看用起来。

持久化就不赘述了,参考源码

源码

上一篇 多语言方案一:flutter_localizations 与 GetX 配合版

这篇关于【Flutter】多语言方案二:GetX 版的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/917854

相关文章

Go 语言中的select语句详解及工作原理

《Go语言中的select语句详解及工作原理》在Go语言中,select语句是用于处理多个通道(channel)操作的一种控制结构,它类似于switch语句,本文给大家介绍Go语言中的select语... 目录Go 语言中的 select 是做什么的基本功能语法工作原理示例示例 1:监听多个通道示例 2:带

C语言函数递归实际应用举例详解

《C语言函数递归实际应用举例详解》程序调用自身的编程技巧称为递归,递归做为一种算法在程序设计语言中广泛应用,:本文主要介绍C语言函数递归实际应用举例的相关资料,文中通过代码介绍的非常详细,需要的朋... 目录前言一、递归的概念与思想二、递归的限制条件 三、递归的实际应用举例(一)求 n 的阶乘(二)顺序打印

Java图片压缩三种高效压缩方案详细解析

《Java图片压缩三种高效压缩方案详细解析》图片压缩通常涉及减少图片的尺寸缩放、调整图片的质量(针对JPEG、PNG等)、使用特定的算法来减少图片的数据量等,:本文主要介绍Java图片压缩三种高效... 目录一、基于OpenCV的智能尺寸压缩技术亮点:适用场景:二、JPEG质量参数压缩关键技术:压缩效果对比

SpringBoot首笔交易慢问题排查与优化方案

《SpringBoot首笔交易慢问题排查与优化方案》在我们的微服务项目中,遇到这样的问题:应用启动后,第一笔交易响应耗时高达4、5秒,而后续请求均能在毫秒级完成,这不仅触发监控告警,也极大影响了用户体... 目录问题背景排查步骤1. 日志分析2. 性能工具定位优化方案:提前预热各种资源1. Flowable

Java进行文件格式校验的方案详解

《Java进行文件格式校验的方案详解》这篇文章主要为大家详细介绍了Java中进行文件格式校验的相关方案,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录一、背景异常现象原因排查用户的无心之过二、解决方案Magandroidic Number判断主流检测库对比Tika的使用区分zip

Flutter打包APK的几种方式小结

《Flutter打包APK的几种方式小结》Flutter打包不同于RN,Flutter可以在AndroidStudio里编写Flutter代码并最终打包为APK,本篇主要阐述涉及到的几种打包方式,通... 目录前言1. android原生打包APK方式2. Flutter通过原生工程打包方式3. Futte

IDEA中Git版本回退的两种实现方案

《IDEA中Git版本回退的两种实现方案》作为开发者,代码版本回退是日常高频操作,IntelliJIDEA集成了强大的Git工具链,但面对reset和revert两种核心回退方案,许多开发者仍存在选择... 目录一、版本回退前置知识二、Reset方案:整体改写历史1、IDEA图形化操作(推荐)1.1、查看提

C语言中的数据类型强制转换

《C语言中的数据类型强制转换》:本文主要介绍C语言中的数据类型强制转换方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录C语言数据类型强制转换自动转换强制转换类型总结C语言数据类型强制转换强制类型转换:是通过类型转换运算来实现的,主要的数据类型转换分为自动转换

利用Go语言开发文件操作工具轻松处理所有文件

《利用Go语言开发文件操作工具轻松处理所有文件》在后端开发中,文件操作是一个非常常见但又容易出错的场景,本文小编要向大家介绍一个强大的Go语言文件操作工具库,它能帮你轻松处理各种文件操作场景... 目录为什么需要这个工具?核心功能详解1. 文件/目录存javascript在性检查2. 批量创建目录3. 文件

C语言实现两个变量值交换的三种方式

《C语言实现两个变量值交换的三种方式》两个变量值的交换是编程中最常见的问题之一,以下将介绍三种变量的交换方式,其中第一种方式是最常用也是最实用的,后两种方式一般只在特殊限制下使用,需要的朋友可以参考下... 目录1.使用临时变量(推荐)2.相加和相减的方式(值较大时可能丢失数据)3.按位异或运算1.使用临时