Flutter之国际化（多语言处理）

项目内最近加入国际化内容，那么我们需要转化对应语言内容，来展示UI

App国际化开发主要包括：

• 文本国际化
• Widget显示的国际化
• 某些文本在对应语言环境下应该显示为所选择语言内容；

多语言适配：

目前我项目内使用的是：Flutter Intl插件：

1.安装Flutter Intl插件
在Android studio内直接搜索Intl，添加插件即可，我这里已经添加好了；如图：

*安装完成后，先使用Intl初始化一下项目

初始化项目：

系统会默认创建messages_all.dart、messages_en.dart以及intl_en.arb文件*

使用Intl创建对应语言文件，如图：

例如：中文，在弹出框中输入zh即可
我们会发现，会生成对应的intl_zh.arb和messages_zh.dart文件，那么接下来，我们就根据需求编写对应语言文件即可：

arb其它语法：
对于一些例如页面里重复的title，每个页面写一个比较麻烦，我们可以采用使用本地化的过程中传递一些参数：

• {name}：表示传递的参数使用：S.of(context).sayHello(“Flutter”)
• pageTitle就是一个可选参数，

"commonPageTitle":"{pageTitle, select, mine{我的} set{设置} changeHead{修改头像} resetPsw{重置密码} changeNickname{修改昵称} about{关于我们} helpCenter{帮助中心} proviate{隐私管理} feedback{意见反馈} customerService{客服中心} login{登录} register{注册} theme{一键换肤} languege{多语言}}","@commonPageTitle":{"description":"Welcome message on the pageTitle screen","placeholders":{"pageTitle":{}}},

使用时候：S.of(context).commonPageTitle(“mine”)就行啦，根据对应设置key取值

上面输出："我的"或者对应翻译语言

2.pubspec.yaml内添加依赖：

dependencies:
  flutter:
    sdk: flutter
  # 国际化
  flutter_localizations:
    sdk: flutter

3.创建多语言管理类

classLocaleTool{// 获取本地存储的配置语言staticList<String>languageConfig(){List<String> list =["zh",'CN'];String language =CommonSpUtil.getLanguageType();if(language.isNotEmpty){List<String> languageList = language.split('_');if(languageList.length >=2){
        list = languageList;}}return list;}/// 切换语言changeLanguage({required languageStr})async{List list = languageStr.split('_');String languageCode ='zh';String countryCode ="CN";if(list.length ==2){
      languageCode = list[0];
      countryCode = list[1];}var locale =Locale(languageCode, countryCode);/// 更新语言awaitGet.updateLocale(locale);/// 存储本地语言配置awaitCommonSpUtil.saveLanguageType(languageStr);}}

上面CommonSpUtil类，是基于插件sp_util封装的本地存储类：

/// 存语言配置staticsaveLanguageType(String languageType){returnSpUtil.putString(CommonSpUtil.languageType, languageType);}/// 获取语言配置 默认 中文staticStringgetLanguageType(){returnSpUtil.getString(CommonSpUtil.languageType)??"zh_CN";}

好了，上面准备工作基本已经完成了。

4.入口配置：

GetMaterialApp(
          title:'',
          debugShowCheckedModeBanner:false,
          initialBinding:InitBinding(),
          initialRoute:RouterUtil.tabBar,
          getPages:RouterUtil.getPages,// translations: StringRes(),
          defaultTransition:Transition.cupertino,
          locale:LocaleTool.languageConfig().isNotEmpty
              ?Locale(LocaleTool.languageConfig()[0],LocaleTool.languageConfig()[1]):null,//默认展示本地语言
          fallbackLocale:constLocale('zh','CN'),//语言选择无效时，备用语言/// 支持语言
          supportedLocales:S.delegate.supportedLocales,
          localizationsDelegates:[GlobalMaterialLocalizations.delegate,GlobalWidgetsLocalizations.delegate,GlobalCupertinoLocalizations.delegate,S.delegate
          ],
          theme:ThemeData(brightness:Brightness.light),
          darkTheme:ThemeData(brightness:Brightness.dark),/// 配置 本地存储 主题类型
          themeMode:ThemeTool.getLocalThemeModel(),
          builder:EasyLoading.init(builder:(context, child){returnGestureDetector(
              onTap:(){FocusScopeNode currentFocus =FocusScope.of(context);if(!currentFocus.hasPrimaryFocus &&
                    currentFocus.focusedChild !=null){FocusManager.instance.primaryFocus?.unfocus();}},
              child: child,);}),)

5.最后就是切换语言环境

选择对应语言环境，使用多语言管理类切换即可

/// 配置语言 根据需求 进行处理Stringconfiglanguage(String string){String languagestr ="zh_CN";switch(string){case"简体中文":
        languagestr ="zh_CN";break;case"English":
        languagestr ="en_US";break;default:}return languagestr;}LocaleTool().changeLanguage(
   languageStr: logic.configlanguage(
      logic.config[logic.datas[index].toString()]));

效果：

好了，到此多语言就处理完毕了，关键代码已贴出，有问题欢迎各位大佬指正~ 请轻喷。😄