查看官方文档以及Flutter中文网.还是觉得国际化处理的太过复杂.想着是否有合适的第三方控件.还真找到一款能像以往iOS和安卓端.xml格式输入所有的翻译文档.那就是Flutter_i18n.先看看安装以及使用
安装:
在Plugins中搜索然后安装
image.png
自动生成res/values/strings_en.arb.然后在里面编辑
{
"app_name":"app_name",
"app_test": "app_test"
}
即会在lib/目录下生成generated/i18n.dart(我们代码中主要是使用该文件)
image.png
如果需要添加新的语言环境.只需要在values目录右键创建arb文件即可
image.png
即可选出对应的语言环境和地区
image.png
例如添加中文以后出现strings_zh_CN.arb.在里面编辑
{
"app_name": "",
"app_test": "App调试"
}
使用:
看了很多文章.总是出现
The getter 'app_name' was called on null , Receiver: null, Tried calling 'app_name'
具体原因个人猜测:
1.onGenerateTitle: (BuildContext context) => S.of(context).app_name,方法未编辑
2.使用地方不正确.不应在MyApp中使用.而应在home:子Widget中使用
不正确使用.png
正确使用.png
切换当前语言环境.使用GlobalKey绑定一个可变StatefulWidget.去更改当前环境.然后更新所有的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,
);
}
}
网友评论