flutter 國(guó)際化方面，在網(wǎng)上蠻多的肯污。這篇文章只是記錄翘单，用來(lái)穩(wěn)固我的記憶力。
部署環(huán)境&初始化
這邊用到vscode進(jìn)行開(kāi)發(fā)蹦渣，需要下載 Flutter Intl 插件哄芜。
image.png
下載完成后，在項(xiàng)目中的
pubspec.yaml添加依賴庫(kù)柬唯。
...
dependencies:
flutter_localizations:
sdk: flutter
...
在vscode中按command\ctrl+shift+p认臊，然后會(huì)彈出一個(gè)輸入vscode內(nèi)置命令的輸入框和下拉結(jié)果。
在flutter項(xiàng)目中锄奢，首次需要搜索Flutter Intl: Initialize命令失晴，回車即可初始化和生成國(guó)際化相關(guān)文件代碼。
image.png
image.png
就在項(xiàng)目中lib中默認(rèn)生成了以下文件：
|-- generated 自動(dòng)生成的文件拘央，不需要手動(dòng)編輯
|-- intl
| |-- messages_all.dart 橋接多個(gè)語(yǔ)言文件 下面en zh等文件涂屁。
| |-- messages_en.dart 轉(zhuǎn)譯文件 自動(dòng)從l10n/intl_en.arb 提取key/value 自動(dòng)生成代碼
|-- l10n.dart 入口文件代碼，不需要手動(dòng)編輯
|-- l10n 存放國(guó)際化json文件位置 arb=json
|-- intl_en.arb
在入口Widget添加堪滨，localizationsDelegates 和 supportedLocales變量胯陋。
import 'package:flutter_localizations/flutter_localizations.dart';
import 'generated/l10n.dart';
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
localizationsDelegates: [
S.delegate,
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate,
],
supportedLocales: S.delegate.supportedLocales,
title: 'Flutter Demo',
home: new MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
新增國(guó)際化
添加新的國(guó)際化文件可以搜索Flutter Intl: Add Locale命令蕊温，回車會(huì)切換到輸入國(guó)際化編碼袱箱。
image.png
會(huì)提示輸入國(guó)際化編碼遏乔，例如簡(jiǎn)體中文就 zh_Hans_CN。
image.png
然后就會(huì)在l10n文件夾发笔，自動(dòng)添加 intl_zh_Hans_CN.arb文件盟萨，以及在generated/l10n中生成轉(zhuǎn)譯文件。
注：在ios中按需添加以下配置：
image.png
在代碼中使用
首先在arb文件里面分別添加國(guó)家化了讨。
intl_en.arb
{
"hello": "hello"
}
intl_zh_Hans_CN.arb
{
"hello": "你好"
}
保存后就會(huì)在轉(zhuǎn)譯文件自動(dòng)生成相應(yīng)代碼捻激。
在頁(yè)面上使用：
Widget build(BuildContext context) {
return Column(children: [
Text(
S.current.hello,
),
]);
}
頁(yè)面內(nèi)國(guó)際化切換
Flutter項(xiàng)目默認(rèn)是自動(dòng)跟隨系統(tǒng)語(yǔ)言的。
頁(yè)面內(nèi)切換語(yǔ)言前计。
const locale = Locale('zh', 'CN');
MyApp.of(context).setLocale(locale)
