Flutter多功能集成插件getx_csv_translation_generator的使用

Flutter多功能集成插件getx_csv_translation_generator的使用

安装

pubspec.yaml文件中添加以下依赖:

dependencies:
  getx_csv_translation: <latest>

dev_dependencies:
  build_runner: <latest>
  getx_csv_translation_generator: <latest>

运行以下命令以安装依赖:

flutter pub get

使用

1. 创建 translations.csv

创建一个名为 translations.csv 的文件,并添加翻译数据。例如:

key,en_US,th_TH
test,test,ทดสอบ
param,test @name,ทดสอบ @name

2. 创建 lib/translations.dart

创建一个 lib/translations.dart 文件,并定义翻译类:

import 'package:getx_csv_translation/getx_csv_translation.dart';
import 'package:get/get.dart';

part 'translations.g.dart'; // 自动生成的文件

// 注解用于生成翻译代码
@GetXCSVTranslation()
class GetXCSVTranslations extends Translations {
  @override
  Map<String, Map<String, String>> get keys => $keys;
}

3. 生成翻译文件

3.1 使用 build_runner

运行以下命令生成翻译文件:

flutter packages pub run build_runner build
3.2 使用 CLI

运行以下命令生成翻译文件:

flutter pub run getx_csv_translation_generator build --csvPath <path to translation(optional)> --targetPath <path to translations.dart(optional)>

运行以下命令监听并自动更新翻译文件:

flutter pub run getx_csv_translation_generator watch --csvPath <path to translation(optional)> --targetPath <path to translations.dart(optional)>

4. 配置 GetX 应用

main.dart 中配置 GetX 应用:

import 'package:get/get.dart';
import 'lib/translations.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      translations: GetXCSVTranslations(), // 使用生成的翻译类
      locale: Get.deviceLocale, // 自动检测设备语言
      fallbackLocale: Locale('en'), // 默认语言
      home: MyHomePage(),
    );
  }
}

如何使用 AppLocalization

AppLocalization 类提供了静态方法来获取翻译字符串。例如:

const $keys = {
  'en': {
    'test': 'Test',
    'param': 'Test @name',
  },
  'th': {
    'test': 'ทดสอบ',
    'param': 'ทดสอบ @name',
  }
};

class AppLocalization {
  static String get test => 'test'.tr;
  static String get param => 'param'.tr;
}

示例使用 AppLocalization

  1. 导入 AppLocalization 类:
import 'lib/translations.dart';
  1. 使用静态方法获取翻译字符串:
String testTranslation = AppLocalization.test;
String paramTranslation = AppLocalization.param;
  1. 如果有动态翻译参数,可以传递参数:
String dialogDescription = AppLocalization.param.trParams({
  'name': 'John Doe',
});

构建配置

可以通过 build.yaml 文件配置生成器选项:

targets:
  $default:
    builders:
      getx_csv_translation_generator|getx_csv_translation:
        options:
          csv_path: ./translation.csv
          single_quote: true
          localization_name: AppLocalization

更多关于Flutter多功能集成插件getx_csv_translation_generator的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter多功能集成插件getx_csv_translation_generator的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


getx_csv_translation_generator 是一个用于 Flutter 的多功能集成插件,旨在简化应用程序的国际化(i18n)和本地化(l10n)过程。它结合了 GetX 状态管理库和 CSV 文件来管理翻译字符串,并自动生成相应的 Dart 代码。

主要功能

  1. CSV 文件管理翻译字符串:使用 CSV 文件来存储和管理不同语言的翻译字符串,便于编辑和维护。
  2. 自动生成 Dart 代码:根据 CSV 文件自动生成 Dart 代码,减少手动编写翻译代码的工作量。
  3. 与 GetX 集成:与 GetX 状态管理库无缝集成,简化了在应用程序中使用翻译字符串的过程。
  4. 支持多语言:支持多种语言的翻译,便于开发多语言应用程序。

使用步骤

1. 添加依赖

首先,在 pubspec.yaml 文件中添加 getx_csv_translation_generatorget 的依赖:

dependencies:
  flutter:
    sdk: flutter
  get: ^4.6.5

dev_dependencies:
  getx_csv_translation_generator: ^1.0.0

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

2. 创建 CSV 文件

在项目根目录下创建一个 CSV 文件(例如 translations.csv),用于存储翻译字符串。CSV 文件的第一列是键(key),后续列是不同语言的翻译值。例如:

key,en,es,fr
hello,Hello,Hola,Bonjour
goodbye,Goodbye,Adiós,Au revoir

3. 生成翻译代码

在终端中运行以下命令,根据 CSV 文件生成 Dart 代码:

flutter pub run getx_csv_translation_generator

这将在 lib 目录下生成一个 translations 文件夹,其中包含生成的 Dart 文件。

4. 配置 GetX 翻译

main.dart 中配置 GetX 的翻译功能:

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'translations/translations.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return GetMaterialApp(
      translations: AppTranslations(),
      locale: Locale('en', 'US'), // 设置默认语言
      fallbackLocale: Locale('en', 'US'), // 设置回退语言
      home: HomePage(),
    );
  }
}

5. 使用翻译字符串

在应用程序中使用生成的翻译字符串:

import 'package:flutter/material.dart';
import 'package:get/get.dart';

class HomePage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('hello'.tr), // 使用翻译字符串
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('hello'.tr),
            ElevatedButton(
              onPressed: () {
                Get.updateLocale(Locale('es', 'ES')); // 切换语言
              },
              child: Text('Switch to Spanish'),
            ),
          ],
        ),
      ),
    );
  }
}
回到顶部