Flutter应用实现国际化插件azbox的使用

Flutter应用实现国际化插件azbox的使用

图片展示

安装说明 在 pubspec.yaml 文件中添加依赖：

dependencies:
  azbox-localization: <last_version>

配置应用 在应用中添加 Azbox 插件示例：

import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:azbox/azbox.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Azbox.ensureInitialized(
    apiKey: 'Your API Key',
    projectId: 'Your project ID');
  
  runApp(
    Azbox(
      child: MyApp()
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: context.localizationDelegates,
      supportedLocales: context.supportedLocales,
      locale: context.locale,
      home: MyHomePage()
    );
  }
}

Azbox localization widget 属性

初始化库 在主函数中调用 Azbox.ensureInitialized() 初始化库。

void main() async {

  WidgetsFlutterBinding.ensureInitialized();

  // ...
  // 需要在 runApp() 前调用
  await Azbox.ensureInitialized(
    apiKey: 'Your API Key',
    projectId: 'Your project ID');
    
  // ...
  runApp(....)
  // ...
}

更改或获取语言 Azbox 使用扩展方法 [BuildContext] 访问语言。

context.setLocale(Locale('en', 'US'));
print(context.locale.toString());

翻译 主要翻译函数是 translate()。

Text('title').translate() // Text widget
print('title'.translate()); // String
var title = translate('title') // Static function
Text(context.translate('title')) // Extension on BuildContext

参数

示例

{
   "msg":"{} are written in the {} language",
   "msg_named":"Azbox localization is written in the {lang} language",
   "msg_mixed":"{} are written in the {lang} language",
   "gender":{
      "male":"Hi man ;) {}",
      "female":"Hello girl :) {}",
      "other":"Hello {}"
   }
}

// args
Text('msg').translate(args: ['Azbox localization', 'Dart']),

// namedArgs
Text('msg_named').translate(namedArgs: {'lang': 'dart'}),

// args 和 namedArgs
Text('msg_mixed').translate(args: ['Azbox localization'], namedArgs: {'lang': 'dart'}),

// gender
Text('gender').translate(gender: _gender ? "female" : "male"),

链接翻译 如果有一个翻译键总是与另一个键具有相同的具体文本，可以链接到它。只需将内容前缀为 @: 符号，然后跟随完整翻译键名称和所需的命名空间。

示例

{
  ...
  "example": {
    "hello": "Hello",
    "world": "World!",
    "helloWorld": "@:example.hello @:example.world"
  }
  ...
}

print('example.helloworld'.translate()); // Output: Hello World!

格式化链接翻译 如果语言区分字符的大写小写，可能需要控制链接本地化消息的大写小写。链接消息可以使用修饰符 @.modifier:key 格式化。

示例

{
  ...
  "example": {
    "fullName": "Full Name",
    "emptyNameError": "Please fill in your @.lower:example.fullName"
  }
  ...
}

重置语言 重置语言到设备语言。

RaisedButton(
  onPressed: (){
    context.resetLocale();
  },
  child: Text(LocaleKeys.reset_locale).translate(),
)

获取设备语言 获取设备语言。

print(${context.deviceLocale.toString()}) // OUTPUT: en_US

删除保存的语言 从设备存储中清除保存的语言。

RaisedButton(
  onPressed: (){
    context.deleteSaveLocale();
  },
  child: Text(LocaleKeys.reset_locale).translate(),
)

获取 Azbox localization widget 属性 随时通过 [BuildContext] 获取 Azbox localization widget 的的主要属性：supportedLocales、localizationDelegates。

代码生成 支持 JSON 文件的代码生成，运行终端命令 flutter pub run azbox_localization:generate -h 查看帮助信息。

命令行参数

局部化资产加载类 步骤：

1. 打开终端，在项目文件夹路径下运行 flutter pub run azbox_localization:generate
2. 更改资产加载并粘贴导入。

import 'generated/codegen_loader.g.dart';
...
void main(){
  runApp(Azbox(
    child: MyApp(),
  ));
}
...

局部化键 如果有许多本地化键且感到困惑，键生成会帮助你。代码编辑器会自动提示键。

步骤：

1. 打开终端，在项目文件夹路径下运行 flutter pub run azbox_localization:generate -f keys -o locale_keys.g.dart
2. 粘贴导入。

import 'generated/locale_keys.g.dart';

如何使用生成的键

print(LocaleKeys.title.translate()); // String
// 或者
Text(LocaleKeys.title).translate(); // Widget

扩展助手 字符串到语言

'en_US'.toLocale(); // Locale('en', 'US')
'en|US'.toLocale(separator: '|') // Locale('en', 'US')

语言到字符串带分隔符

Locale('en', 'US').toStringWithSeparator(separator: '|') // en|US