Flutter国际化代码生成插件translations_code_gen的使用

Translations Code Generator

这是一款用于为Dart/Flutter项目生成国际化代码的简单工具。

快速开始 • Pub.dev

安装

1. 添加依赖

在 pubspec.yaml 文件中添加依赖：

dependencies:
  translations_code_gen: ^1.2.1

2. 运行此命令

flutter pub get

使用

1. 在 assets 文件夹中创建翻译文件

在项目的根目录下创建一个名为 assets 的文件夹，并在其中创建名为 en.json 和 ar.json 的文件，并添加以下内容：

例子：assets/translations/en.json

{
  "GENERAL": {
    "HELLO": "Hello",
    "WELCOME": "Welcome"
  },
  "HOME": {
    "TITLE": "Home"
  }
}

例子：assets/translations/ar.json

{
  "GENERAL": {
    "HELLO": "مرحبا",
    "WELCOME": "أهلا بك"
  },
  "HOME": {
    "TITLE": "الرئيسية"
  }
}

2. 将翻译文件路径添加到 pubspec.yaml 或 translations_code_gen.yaml 文件中

在 pubspec.yaml 文件中添加以下内容：

translations_code_gen:
  keys:
    input: 'assets/translations/en.json'
    output: 'lib/translations/keys.dart'
  values:
    input: 'assets/translations/'
    output: 'lib/translations/values/'

运行以下命令以生成翻译的 keys 和 values：

flutter pub run translations_code_gen

-g 或 --generate 标志是可选的。如果不使用它，工具将自动生成 Dart 键和值代码。

这将在 lib/translations/keys.dart 文件中生成以下键：

// GENERATED CODE - DO NOT MODIFY BY HAND
// ignore_for_file: constant_identifier_names, camel_case_types

class GENERAL {
  static const String HELLO = "GENERAL.HELLO";
  static const String WELCOME = "GENERAL.WELCOME";
}

class HOME {
  static const String TITLE = "HOME.TITLE";
}

并将在 lib/translations/values/ 文件夹下的 en.dart 和 ar.dart 文件中生成以下值：

例子：lib/translations/values/en.dart

// GENERATED CODE - DO NOT MODIFY BY HAND
// ignore_for_file: constant_identifier_names

import '../keys.dart'; // 有时你需要更改此路径以匹配你的项目结构

const Map<String, String> _general  = {
  GENERAL.HELLO: "Hello",
  GENERAL.WELCOME: "Welcome",
};

const Map<String, String> _home  = {
  HOME.TITLE: "Home",
};

final Map<String, String> enValues = {
  ..._general,
  ..._home,
};

例子：lib/translations/values/ar.dart

// GENERATED CODE - DO NOT MODIFY BY HAND
// ignore_for_file: constant_identifier_names

import '../keys.dart'; // 有时你需要更改此路径以匹配你的项目结构

const Map<String, String> _general  = {
  GENERAL.HELLO: "مرحبا",
  GENERAL.WELCOME: "أهلا بك",
};

const Map<String, String> _home  = {
  HOME.TITLE: "الرئيسية",
};

final Map<String, String> enValues = {
  ..._general,
  ..._home,
};

你可能需要更改键的导入路径以匹配你的项目结构。

3. 使用生成的代码

import 'package:flutter/material.dart';

import './translations/keys.dart';

// 任何翻译包

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(HOME.TITLE.tr()),
      ),
      body: Center(
        child: Text(GENERAL.HELLO.tr()),
      ),
    );
  }
}

4. 同上，但使用 --generate 标志

flutter pub run translations_code_gen --generate=json-values

有四种类型的代码生成模式：

• dart（默认）：生成 Dart 键和值代码。
• dart-keys：仅生成 Dart 键。
• dart-values：仅生成 Dart 值。
• json-values：仅生成 JSON 值。

使用 --generate=json-values 标志的输出

例子：lib/translations/values/en.json

{
  "GENERAL.HELLO": "Hello",
  "GENERAL.WELCOME": "Welcome",
  "HOME.TITLE": "Home"
}

例子：lib/translations/values/ar.json

{
  "GENERAL.HELLO": "مرحبا",
  "GENERAL.WELCOME": "أهلا بك",
  "HOME.TITLE": "الرئيسية"
}