Flutter国际化，实时切换app内的本地语言

前言：

        Flutter项目需要支持国际化，就是在app内实时切换不同的语言，满足不同用户的需求。Flutter默认支持英文的文本和组件，如果需要添加本地的支持，直接在Plugins引入插件Flutter Intl，就可以初始化intl和添加添加我们想添加的每一种语言。 接下来我简单总结一下在Flutter项目中如何实现国际化，有需要的话可以参考。

思路：

     1.在Plugins引入插件Flutter Intl
     2.在pubspec.yaml 文件中添加依赖flutter_localizations
     3.初始化intl和添加语言
     4.设置MaterialApp语言环境
     5.在App内实现语言切换

实现的步骤：

1.在Plugins引入插件Flutter Intl

    

2.在pubspec.yaml文件中添加依赖flutter_localizations

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter
  

  cupertino_icons: ^1.0.0
  provider: ^4.3.1 #用于实时切换语言的状态管理

3.初始化intl和添加语言

3.1 初始化intl (Tools->Flutter Intl-> Initialize for the Project)

在pubspec.yaml中自动增加字段：

flutter_intl:
  enabled: true

在lib目录下增加 generated 和 l10n一个包( intl_en.arb,添加英文语言) 

{
  "home": "Home",
  "settingLanguage": "Set Language",
  "settingLanguageEnglish": "English",
  "settingLanguageChinese": "Chinese"
}

3.2添加语言( intl_zh.arb，添加中文语言)

{
  "home": "首页",
  "settingLanguage": "设置语言",
  "settingLanguageEnglish": "英文",
  "settingLanguageChinese": "中文"
}

4.设置MaterialApp语言环境

MaterialApp(      
          localizationsDelegates: [
            GlobalMaterialLocalizations.delegate,
            GlobalCupertinoLocalizations.delegate,
            GlobalWidgetsLocalizations.delegate,
            S.delegate
          ],          
          supportedLocales: [
            const Locale('zh', 'CN'),
            const Locale('en', 'US'),
          ],
          
        )

5.在App内实现语言切换

5.1封装CurrentLocale方法

import 'package:flutter/material.dart';

class CurrentLocale with ChangeNotifier {
  Locale _locale = const Locale('zh','CN');

  Locale get value => _locale;
  void setLocale(locale)
  {
    _locale = locale;
    notifyListeners();
  }
}

5.2设置实时切换语言的状态管理

runApp(MultiProvider(
    providers: [ChangeNotifierProvider(create: (context) => CurrentLocale())],
    child: MyApp(),
  ));

5.3在MaterialApp添加状态管理

Consumer<CurrentLocale>(
      builder: (context, currentLocale, child) {
        return MaterialApp(     
          localizationsDelegates: [
            GlobalMaterialLocalizations.delegate,
            GlobalCupertinoLocalizations.delegate,
            GlobalWidgetsLocalizations.delegate,
            S.delegate
          ],
          locale: currentLocale.value,//设置首要支持的语言
          supportedLocales: [
            const Locale('zh', 'CN'),
            const Locale('en', 'US'),
          ],
          ...
        );
      },
    )

5.4弹出语言切换的对话框

SimpleDialog(
           title: Text(S.of(context).settingLanguage), 
           children: <Widget>[
              SimpleDialogOption(
                onPressed: () {
                Navigator.pop(context, 1);
               },
             child: Padding(
                padding: const EdgeInsets.symmetric(vertical: 6),
                child: Text(S.of(context).settingLanguageChinese),
              ),
            ),
            SimpleDialogOption(
                 onPressed: () {
                  Navigator.pop(context, 2);
                 },
              child: Padding(
                   padding: const EdgeInsets.symmetric(vertical: 6),
                   child: Text(S.of(context).settingLanguageEnglish),
              ),
            ),
         ],
)

5.5语言切换的方法

if (i != null) {
       if (i == 1) {
            Provider.of<CurrentLocale>(context, listen: false)
                 .setLocale(const Locale('zh', "CH"));
      } else {
            Provider.of<CurrentLocale>(context, listen: false)
                 .setLocale(const Locale('en', "US"));
      }
 }

6.总结

在Flutter上已经实现国际化的功能啦，欢迎大家围观。源码地址: https://github.com/wupeilinloveu/flutter_language ，如果有什么疑问的话，欢迎留言！