Flutter国际化插件i18n_extension_importer的使用

Flutter国际化插件i18n_extension_importer的使用

引言

i18n_extension_importer 是一个由 Johann Bauer 开发的库,用于支持导入 .PO.JSON 文件。这些文件可以包含应用的本地化文本。

导入

目前,该库仅支持 .PO.JSON 文件的导入。如果你希望为其他格式添加支持,可以提交 Pull Request (PR) 到 GitHub 仓库。

添加翻译文件

首先,将你的翻译文件作为资源添加到应用中。目录结构应该类似于:

app
 \_ assets
    \_ locales
       \_ de.po
       \_ fr.po
        ...

然后,你可以使用 GettextImporterJSONImporter 来导入这些文件。

import 'package:i18n_extension/io/import.dart';
import 'package:i18n_extension/i18n_extension.dart';

class MyI18n {
  static TranslationsByLocale translations = Translations.byLocale("en");

  static Future<void> loadTranslations() async {
    translations += await GettextImporter().fromAssetDirectory("assets/locales");
  }
}

extension Localization on String {
  String get i18n => localize(this, MyI18n.translations);
  String plural(value) => localizePlural(value, this, MyI18n.translations);
  String fill(List<Object> params) => localizeFill(this, params);
}

使用示例

main.dart 中使用这些类和扩展方法,确保在应用启动时加载翻译文件。

在 main.dart 中使用

import 'package:flutter/material.dart';
import 'package:i18n_extension/i18n_extension.dart';
import 'my_i18n.dart'; // 假设你将上述代码保存在 my_i18n.dart 文件中

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await MyI18n.loadTranslations(); // 确保在应用启动前加载翻译文件
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('i18n Extension Example')),
        body: Center(
          child: Text('Hello World'.i18n),
        ),
      ),
    );
  }
}

注意事项

  • 当使用 .po 文件时,不要包含国家代码,因为这些代码是由文件名生成的,而文件名中不包含国家代码。
  • 如果需要导入其他自定义格式,可以利用 Translation()Translation.byLocale() 构造函数来创建翻译对象。只要能从文件格式中生成一个映射(Map),就可以使用这些构造函数。

导出工具

Johann Bauer 还贡献了一个导出工具 GetStrings,用于自动导出项目中的所有可翻译字符串。你可以在项目根目录下运行以下命令来获取可翻译的字符串列表:

dart run i18n_extension_importer:getstrings

这将会生成一个 strings.json 文件,其中包含所有的可翻译字符串。你可以将此文件发送给翻译人员或导入到翻译服务中,如 Crowdin、Transifex 或 Lokalise。你也可以将其用作 CI 管道的一部分,以确保翻译模板始终保持最新。

示例代码

print("Hello World!".i18n); // 这会正常工作。

// 但是,由于工具不会执行代码,因此它无法识别以下情况:
var x = "Hello World";
print(x.i18n);

更多关于Flutter国际化插件i18n_extension_importer的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter国际化插件i18n_extension_importer的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


i18n_extension_importer 是一个 Flutter 插件,用于简化国际化(i18n)的实现。它通常与 i18n_extension 插件配合使用,帮助开发者更轻松地管理和导入国际化字符串。

安装插件

首先,你需要在 pubspec.yaml 文件中添加 i18n_extensioni18n_extension_importer 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  i18n_extension: ^4.0.0
  i18n_extension_importer: ^1.0.0

然后运行 flutter pub get 来安装依赖。

创建国际化文件

  1. 创建国际化字符串文件:在 lib 目录下创建一个 i18n 文件夹,然后在其中创建多个 .i18n.json 文件,每个文件对应一种语言。例如:

    • lib/i18n/en.i18n.json
    • lib/i18n/es.i18n.json
    • lib/i18n/zh.i18n.json
  2. 编写国际化字符串:在每个 .i18n.json 文件中,你可以定义键值对,键是字符串的标识符,值是对应的翻译。例如:

    en.i18n.json:

    {
      "hello": "Hello",
      "welcome": "Welcome to Flutter"
    }
    

    es.i18n.json:

    {
      "hello": "Hola",
      "welcome": "Bienvenido a Flutter"
    }
    

    zh.i18n.json:

    {
      "hello": "你好",
      "welcome": "欢迎使用 Flutter"
    }
    

使用 i18n_extension_importer 导入国际化字符串

  1. 生成 Dart 文件:使用 i18n_extension_importer 自动生成 Dart 文件。在终端中运行以下命令:

    flutter pub run i18n_extension_importer
    

    这个命令会扫描 lib/i18n 目录下的 .i18n.json 文件,并生成一个 translations.g.dart 文件。

  2. 在代码中使用国际化字符串:在生成的 translations.g.dart 文件中,你会看到一些自动生成的代码。你可以在你的 Flutter 应用中使用这些字符串。例如:

    import 'package:flutter/material.dart';
    import 'i18n/translations.g.dart';
    
    class MyApp extends StatelessWidget {
      [@override](/user/override)
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
            appBar: AppBar(
              title: Text(I18n.of(context).welcome),
            ),
            body: Center(
              child: Text(I18n.of(context).hello),
            ),
          ),
        );
      }
    }
    

设置语言环境

为了让应用根据用户的语言环境显示正确的翻译,你可以在 MaterialApp 中设置 localesupportedLocales

import 'package:flutter/material.dart';
import 'i18n/translations.g.dart';

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      locale: Locale('es'), // 设置默认语言为西班牙语
      supportedLocales: [
        Locale('en', 'US'),
        Locale('es', 'ES'),
        Locale('zh', 'CN'),
      ],
      home: Scaffold(
        appBar: AppBar(
          title: Text(I18n.of(context).welcome),
        ),
        body: Center(
          child: Text(I18n.of(context).hello),
        ),
      ),
    );
  }
}
回到顶部