--- theme: smartblue --- 持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第2天，[点击查看活动详情](https://juejin.cn/post/7099702781094674468 "https://juejin.cn/post/7099702781094674468") ## 背景之前有个需求做Flutter的多语言国际化嘛，然后立马想起有[Intl](https://pub.dev/packages/intl)，看着文档唰唰唰写完了，自测，嗯，没有问题，转头就扔去测试。然后开会领导问我，“你这个文案都是在哪里管理啊？” “emmm，项目代码内，本地憋” “嗯？那我要修改怎么办？” “改完发版咯” “那不行啊！那文案有问题我还等你发版啊？文案你自己管理吗？” “emmm，好吧” 行吧，看来不能简单的摸鱼了。 ## 分析首先分析一下，一个简单的intl结构如下 ``` -generated --intl ---messages_all.dart ---messages_en.dart ---messages_zh.dart --l10n.dart -l10n --intl_en.arb --intl_zh.arb ``` `generated`中的为**自动生成**的文件，`l10n`中则为我们的多语言文件，`intl_**.arb`的内容基本是键值对的`json`（不考虑有‘@’注释辅助信息的情况）。看起来好像是无法处理，因为重点在`generated`中，而`generated`都是自动生成的，即使修改，再次运行命令就会被**覆盖**。不妨往下接着看看，首先`l10n.dart`中有两个类，一个为`S`，即我们获取`Localizations.of()`拿到文案的类；一个是`AppLocalizationDelegate`。 `S`我是使用`flutter_intl`自动生成的，除非想自己写`S`，不然不大可能修改`S`来另外管理。以下是一个基本的`S` ```dart class S { S(); static S? _current; static S get current { assert(_current != null, 'No instance of S was loaded. Try to initialize the S delegate before accessing S.current.'); return _current!; } static const AppLocalizationDelegate delegate = AppLocalizationDelegate(); static Future load(Locale locale) { final name = (locale.countryCode?.isEmpty ?? false) ? locale.languageCode : locale.toString(); final localeName = Intl.canonicalizedLocale(name); return initializeMessages(localeName).then((_) { Intl.defaultLocale = localeName; final instance = S(); S._current = instance; return instance; }); } static S of(BuildContext context) { final instance = S.maybeOf(context); assert(instance != null, 'No instance of S present in the widget tree. Did you add S.delegate in localizationsDelegates?'); return instance!; } static S? maybeOf(BuildContext context) { return Localizations.of(context, S); } /// `test title` String get test { return Intl.message( 'test title', name: 'test', desc: '', args: [], ); } } ``` 而`AppLocalizationDelegate`就不同了，它基本是固定的，主要功能是注册到`MaterialApp`的`localizationsDelegates`，然后我们就可以在`Localizations`拿到对应的翻译文案。所以我们可以考虑编写**自己的Delegates**。 ```dart class AppLocalizationDelegate extends LocalizationsDelegate { const AppLocalizationDelegate(); List get supportedLocales { return const [ Locale.fromSubtags(languageCode: 'en'), Locale.fromSubtags(languageCode: 'zh'), ]; } @override bool isSupported(Locale locale) => _isSupported(locale); @override Future load(Locale locale) => S.load(locale); @override bool shouldReload(AppLocalizationDelegate old) => false; bool _isSupported(Locale locale) { for (var supportedLocale in supportedLocales) { if (supportedLocale.languageCode == locale.languageCode) { return true; } } return false; } } ``` 简单来说，就是定义**支持的语言列表**，以及**load**怎么加载得到对应的`S`。那么这个**load**就是重点信息了，我们怎么把我们自己的资源加载进去呢？看看`intl`是怎么做的，即`S.load()`。 ```dart static Future load(Locale locale) { final name = (locale.countryCode?.isEmpty ?? false) ? locale.languageCode : locale.toString(); // 获取intl可识别格式的localeName final localeName = Intl.canonicalizedLocale(name); // 加载对应localeName的翻译Messages return initializeMessages(localeName).then((_) { // 加载成功后设置defaultLocale，并把S实例返回 Intl.defaultLocale = localeName; final instance = S(); S._current = instance; return instance; }); } ``` 上面我简单写了下注释，重点即是`initializeMessages`，跟着继续来到`messages_all.dart`。 ```dart /// User programs should call this before using [localeName] for messages. Future initializeMessages(String localeName) async { // 验证Locale是否支持是否有效 var availableLocale = Intl.verifiedLocale( localeName, (locale) => _deferredLibraries[locale] != null, onFailure: (_) => null); if (availableLocale == null) { return new Future.value(false); } // 可以异步等待操作 var lib = _deferredLibraries[availableLocale]; await (lib == null ? new Future.value(false) : lib()); // 实例化MessageLookup() initializeInternalMessageLookup(() => new CompositeMessageLookup()); // 找到对应Locale的Messages并add到messageLookup中 messageLookup.addLocale(availableLocale, _findGeneratedMessagesFor); return new Future.value(true); } ``` 大致描述了下功能，可以看到，官方已经预留了**异步加载**的位置，也就是说他的设计是**支持远程**的。异步远程找到地方了，那么重点就是`messageLookup.addLocale(availableLocale, _findGeneratedMessagesFor);`，远程拉取的资源，还需要添加到`messageLookup`中，因为最终`Localizations`获取的文案，就是`messageLookup`中的。 ```dart abstract class MessageLookup { String? lookupMessage(String? messageText, String? locale, String? name, List