Flutter自带国际化适配自动生成方案

1. 介绍

在研究别人的项目期间,突然发现了此方案,特意分享,原来flutter自己已经有一套成熟的国际化生成功能,配置完成后,只需要编写arb即可,主要有以下步骤

• 1.新建一个l10n.yaml文件
• 2.添加和配置所需文件
• 3.更改pubspec.yaml
• 4.flutter packages get
• 5.使用

1. 新建一个l10n.yaml文件

添加内容如下:

arb-dir: lib/l10n/arb
template-arb-file: app_en.arb
output-localization-file: app_localizations.dart
nullable-getter: false 
1
2
3
4

解析:

• arb-dir: arb 所在的目录
• template-arb-file: 默认使用的arb文件
• output-localization-file: 导出的文件名
• nullable-getter: 获取国际化文本是否可空

2. 添加和配置所需文件

新建文件及文件夹如下:

• 项目下的lib* arb* app_en.arb* app_es.arb* l10n.dart

app_en.arb 文件内容

{"@@locale": "en","appName": "Remarks","@appName": {"description": "备注"}
} 
1
2

@appName表示配置一些东西,description表示添加注释,app_es.arb 同理可得

l10n.dart 代码如下:(导入的内容虽然有报错,先不用管)

import 'package:flutter/widgets.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

export 'package:flutter_gen/gen_l10n/app_localizations.dart';

extension AppLocalizationsX on BuildContext {AppLocalizations get l10n => AppLocalizations.of(this);
} 
1
2
3
4
5
6
7

3. 更改pubspec.yaml

添加generate属性

flutter:uses-material-design: true# 添加这个属性generate: true 
1

4. 运行flutter packages get

运行成功后,可以在.dart_tool目录下,生成了国际化适配的代码,再重新查看之前报错的代码,都正常了

5.使用

MaterialApp修改如下:

需要使用的地方:

arb的内容还有很多,例如,添加参数等,自行可研究,以上完!