基于GetX 搭建通用flutter 项目《二》(界面规范抽象类)
基于GetX 搭建通用flutter 项目《三》(暗黑模式)
基于GetX 搭建通用flutter 项目《五》(基于GetX 进行动态刷新)
-
DEMO更新日志
2022-07-14 完成国际化 2022-06-22 完成暗黑模式功能开发 2022-06-16 完成项目基础架构
您能在这里看到啥
- 运行效果
- 语言配置
- 切换方法
- 项目地址
运行效果
语言配置
1. pubspec.yaml 国际化配置
导入官方国际化库 flutter_localizations,如下所示
dependencies:
flutter:
sdk: flutter
# 国际化库
flutter_localizations:
sdk: flutter
2. 入口配置-MaterialApp
导入官方库之后，我们需要在app入口处，也要遵守其代理，配置语言文件，以及你所支持的语言类型
@override
Widget build(BuildContext context) {
String rootroutes = UtilsTool.configrootpageid();
/// 这个是为了获取本地存储的当前语言的类型
List<String> launch = configlaunch();
return ScreenUtilInit(
designSize: const Size(375, 667),
minTextAdapt: true,
splitScreenMode: true,
builder: (_) {
return GestureDetector(
/// 全局点击 事件
onTap: () => CommentTools.keydissmiss(context),
/// 通过GetX 创建根视图
child: GetMaterialApp(
/// 入口路由
initialRoute: rootroutes,
/// 所有路由集合
getPages: RouterS.getAllRoutS(),
/// 是否显示 导航栏右上角 debug 标识
debugShowCheckedModeBanner: false,
builder: (context, child) => MediaQuery(
//设置文字大小不随系统设置改变
data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
child: easyLoading(context, child),
),
initialBinding: AllControllerBinding(),
theme: ThemeData(brightness: Brightness.light),
darkTheme: ThemeData(brightness: Brightness.dark),
/// 配置 本地存储 主题类型
themeMode: ThemeTool.getlocalprofileaboutThemeModel(),
/// 国际化配置 代理
localizationsDelegates: const [
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate, // iOS
],
/// 语言配置文件
translations: LanguageInfoConfig(),
/// 配置当前语言
locale: Locale(launch[0], launch[1]),
/// 如果配置前语言失败了，默认配置语言
fallbackLocale: const Locale("zh", "CN"),
/// 本地支持语言类型
supportedLocales: const [
Locale('zh', 'CN'),
Locale('en', 'US'),
],
),
);
},
);
}
从上面代码中，我们可以看到有两个方法是需要，我们做单独处理的，
configlaunch();
// 获取配置语言
List<String> configlaunch() {
List<String> list = ["zh", 'CN'];
String launch = CommonSpUtil.getLaunchType();
List<String> lochlist = launch.split('_');
if (lochlist.length == 2) {
list = lochlist;
}
return list;
}
通过这个方法我们可以获取到一个数组类似于["zh", 'CN']这样的数组，然后在入口配置-MaterialApp配置中，初始化locale: Locale(launch[0], launch[1]) 这个方法
在这里面我们也使用了和暗黑模式一样的本地持有化方案。CommonSpUtil.getLaunchType()，点进去，我们来看一下代码
/// 存语言配置
static saveLauchType({required String launch}) {
return SpUtil.putString(NormalFlagIdConfig.launchType, launch);
}
/// 获取语言配置
static String getLaunchType() {
return SpUtil.getString(NormalFlagIdConfig.launchType) ?? "zh_CN";
}
到这里基本上，你的国际化的配置功能完成了，但是也缺少了最关键的一个配置项，那就是国际化语言的配置文件，如果没有这个文件，前面的配置基本上是白费的，好，我们再来看一下国际化文件配置。
LanguageInfoConfig(),
由于我们是基于GetX 做的国际化，所以我们这个配置文件，最关键的就是要继承Translations，当我们点击去发现，Translations只是一个简答抽象类
abstract class Translations {
Map<String, Map<String, String>> get keys;
}
我们只需要重写get keys 这个方法即可，虽然我没有完整的看GetX的源码，但是可以理解当我们切换语言的时候，通过更新机制，就会重新获取当前的key，用get 的好处就是，每次刷新的时候，都会重新获取对应的事件。在下面我也会举个例子，我在实际开发中，犯的错误。好，我们接着往下看。
class LanguageInfoConfig extends Translations {
@override
Map<String, Map<String, String>> get keys => {
"zh_CN": {
LanguageConfig.mygeneral: "通用",
LanguageConfig.mythemesetting: "深色模式",
LanguageConfig.mythemesystem: "跟随系统",
},
"en_US": {
LanguageConfig.mygeneral: "General",
LanguageConfig.mythemesetting: "Dark Mode",
LanguageConfig.mythemesystem: "Automatic",
}
};
}
这就是我们的语言配置文件，不过你想使用plist文件，也是可以的，只是 "zh_CN": 对应的是你plist文件解析的map.
当然我们还是需要一个把String转换成GetX,可以动态修改 .tr类 ，所以我这边把通用的方法抽离成一个通用的方法，如下
String configLanguageMessage(String str) {
return str.tr;
}
然后就是怎么使用，我这里会举两个使用实例
1.再创建一个launchmsg 配置类，
class LauchNormalMsg {
/// 通用
/// 这是正确的方法
/// 当你再次调用的时候，他就会重新调用对应的方法，能达到我们想要的预期
static String get general => configLanguageMessage(LanguageConfig.mygeneral);
/// 如果你使用static 作为修饰符，下面这种写法就是错误的
/// 因为static 相对于来说，只会创建一个次，所有当你切换语言后，再去使用LauchNormalMsg.genera这个方法的时候，
/// 你会发现，你的语言没有发生变化，是的，就是没有变换，因为这个方法只会创建一次
/// 以后再去获取，他也不会重新调用，永远都是第一次调用的时候。
static String general = configLanguageMessage(LanguageConfig.mygeneral)
}
使用的时候
Text(
LauchNormalMsg.general
)
2.直接调用configLanguageMessage() 方法
Text(
configLanguageMessage(LanguageConfig.mygeneral)
)
具体您使用哪种都可以，各有利弊吧，您自己决定吧。
切换方法
切换语言的界面，也是模仿文件的，如果想看界面逻辑，就直接看
项目 吧。这里我就不详细的讲了，我就把切换方式，在这里讲解一下,因为比较简单，就直接上代码了
/// 切换语言
void changelaunch() async {
List list = launchStr.split('_');
String languageCode = 'zh';
String countryCode = "CN";
if (list.length == 2) {
languageCode = list[0];
countryCode = list[1];
}
var locale = Locale(languageCode, countryCode);
/// 更新语言
await Get.updateLocale(locale);
/// 存储本地语言配置
await CommonSpUtil.saveLauchType(launch: launchStr);
}
到此，国际化配置完成
