查看官方文檔以及Flutter中文網(wǎng).還是覺得國際化處理的太過復(fù)雜.想著是否有合適的第三方控件.還真找到一款能像以往iOS和安卓端.xml格式輸入所有的翻譯文檔.那就是Flutter_i18n.先看看安裝以及使用
安裝:
在Plugins中搜索然后安裝
自動生成res/values/strings_en.arb.然后在里面編輯
{
"app_name":"app_name",
"app_test": "app_test"
}
即會在lib/目錄下生成generated/i18n.dart(我們代碼中主要是使用該文件)
如果需要添加新的語言環(huán)境.只需要在values目錄右鍵創(chuàng)建arb文件即可
即可選出對應(yīng)的語言環(huán)境和地區(qū)
例如添加中文以后出現(xiàn)strings_zh_CN.arb.在里面編輯
{
"app_name": "",
"app_test": "App調(diào)試"
}
使用:
看了很多文章.總是出現(xiàn)
The getter 'app_name' was called on null , Receiver: null, Tried calling 'app_name'
具體原因個人猜測:
1.onGenerateTitle: (BuildContext context) => S.of(context).app_name,方法未編輯
2.使用地方不正確.不應(yīng)在MyApp中使用.而應(yīng)在home:子Widget中使用
切換當(dāng)前語言環(huán)境.使用GlobalKey綁定一個可變StatefulWidget.去更改當(dāng)前環(huán)境.然后更新所有的Widget即可
完整代碼:
import 'package:flutter/material.dart';
import 'generated/i18n.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
void main() => runApp(MyApp());
GlobalKey<_FreeLocalizations> freeLocalizationStateKey =
new GlobalKey<_FreeLocalizations>(); // 1
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
onGenerateTitle: (BuildContext context) => S.of(context).app_name,
localizationsDelegates: const [
S.delegate,
//如果你在使用 material library宛乃，需要添加下面兩個delegate
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
],
supportedLocales: S.delegate.supportedLocales,
// localeListResolutionCallback: S.delegate.listResolution(fallback: const Locale('zh', 'CN')),
title: S.of(context).app_test,
theme: new ThemeData(
primarySwatch: Colors.blue,
),
home: new Builder(builder: (context) {
return new FreeLocalizations(
key: freeLocalizationStateKey,
child: new MyHomePage(),
);
}),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key}) : super(key: key);
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
bool flag = true;
void changeLocale() {
if (flag) {
freeLocalizationStateKey.currentState
.changeLocale(const Locale('zh', "CN"));
} else {
freeLocalizationStateKey.currentState
.changeLocale(const Locale('en', ""));
}
flag = !flag;
}
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: AppBar(
title: new Text(S.of(context).app_test), // 此處
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
S.of(context).app_test,
),
Text(
'$_counter',
style: Theme.of(context).textTheme.display1,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: changeLocale,
tooltip: 'Increment',
child: Icon(Icons.add),
)); // Th
}
}
class FreeLocalizations extends StatefulWidget {
final Widget child;
FreeLocalizations({Key key, this.child}) : super(key: key);
@override
State<FreeLocalizations> createState() {
return new _FreeLocalizations();
}
}
class _FreeLocalizations extends State<FreeLocalizations> {
Locale _locale = const Locale('en', '');
changeLocale(Locale locale) {
setState(() {
_locale = locale;
});
}
@override
Widget build(BuildContext context) {
return new Localizations.override(
context: context,
locale: _locale,
child: widget.child,
);
}
}
