看官方的stocks源码,发现有国际化的部分,这块不知道怎么弄,因此就各种地方查找资料。资料都是正确的,但是就是能对于小白来说比较难懂,因此,写篇博客详细记录如何用intl制作国际化文件。
工具
- vsCode
步骤以及解释
1 打开vsCode
2 点击view->command-palette...
3 选择flutter:new project
4 给工程起个名字 intl_name( 工程名字不支持大写) 回车,保存文件到相关目录下
目前工程结构如图
5 添加intl 依赖包
打开pubspec.yaml 文件,添加代码如下,并save下,这时候vscode会加载这两个依赖包
intl: 0.15.7
intl_translation: 0.17.3
- 这里intl的版本查找我们可以在这个网址查找
6 创建一个需要本地化的dart文件,这里我在lib目录下创建名字问stock_string.dart文件 和 intl文件夹(该文件保存我们需要的dart转换成的art文件)
- 该文件下还没有本地化的字符串
7 转换 stock_string.dart 文件到art文件.
-
打开vscode的控制台,找到命令行
- 输入命令
$:flutter pub pub run intl_translation:extract_to_arb --output-dir=lib/intl lib/stock_string.dart
- --output-dir=lib/intl 指定我们将dart 文件输出到那个文件夹下
- lib/stock_string.dart 该位置是说我们需要将这个dart文件转换成art文件
该命令执行结束后会在intl文件夹下生成一个intl_messages.arb文件
该文件中只有下列数据
{
"@@last_modified": "2019-03-21T16:49:24.250876"
}
8 在stock_string.dart文件中添加需要国际化的数据,并save下该文件
import 'package:intl/intl.dart';
class StockStrings {
String title() {
return Intl.message(
'<Stocks>',
name: 'title',
desc: 'Title for the Stocks application',
locale: "_localeName",
);
}
String market() => Intl.message(
'MARKET',
name: 'market',
desc: 'Label for the Market tab',
locale: "_localeName",
);
String portfolio() => Intl.message(
'PORTFOLIO',
name: 'portfolio',
desc: 'Label for the Portfolio tab',
locale: "_localeName",
);
}
9 重新运行命令
flutter pub pub run intl_translation:extract_to_arb --output-dir=lib/intl lib/stock_string.dart
查看intl_messages.arb文件
+这个时候我们看intl_messages.arb 中有本地化文件了
- 这里需要说明下,intl_messages.arb 全部来自stock_string.dart 文件中Intl.message()函数下的字符串
10 将art文件转换成dart文件.在终端运行命令
flutter pub pub run intl_translation:generate_from_arb --output-dir=lib/intl --generated-file-prefix=stock_ --no-use-deferred-loading lib/*dart lib/intl/*.arb
这个时候在intl文件夹下生成两个文件,stock_messages_all.dart 和stock_messages_messages.dart
- --output-dir=lib/intl 将arb 转换成dart 代码路径
- --generated-file-prefix=stock_ 生成文件的前缀,也可以不加
- lib/intl/*.arb 需要转换的arb文件路径
这时候控制台会有个信息
No @@locale or _locale field found in intl_messages, assuming 'messages' based on the file name.
这是因为我们在生成的intl_messages文件中,json中没有@@locale key
- intl_messages 其实就是个模板文件。供生成其他语言copy使用的
11假设我们需要生成en 语言,我们直接将intl_messages.arb文件改成stock_en.arb文件,在该文件中加入@@locale 字段,消除警告。再重新运行上述命令
{
"@@last_modified": "2019-03-21T16:56:39.952170",
"@@locale":"en",
"title": "<Stocks>",
"@title": {
"description": "Title for the Stocks application",
"type": "text",
"placeholders": {}
},
"market": "MARKET",
"@market": {
"description": "Label for the Market tab",
"type": "text",
"placeholders": {}
},
"portfolio": "PORTFOLIO",
"@portfolio": {
"description": "Label for the Portfolio tab",
"type": "text",
"placeholders": {}
}
}
这个时候在intl 文件夹下生成了文件stock_messages_en.dart文件,与stocks_en.arb 文件对应。其实这里的stock_messages_messages文件可以删除了。