Flutter本地化翻译加载插件translations_loader的使用

Flutter本地化翻译加载插件translations_loader的使用

简介

translations_loader 是一个简单的库，用于从资源文件夹加载翻译。该库应与 GetX 或类似的框架一起使用，因为它仅将文件加载为 <code>Map&lt;String, String&gt;</code>。

支持的文件格式

• json
• properties

特性

• 简化的国际化
• 支持 json 和 properties 文件
• 所有键从 JSON 文件转换为 object1.object2.value，以便它们与 properties 文件相同

配置步骤

首先，你需要在 pubspec.yaml 文件中配置资源文件夹：

flutter:
  uses-material-design: true

  assets:
    - assets/i18n/

在该文件夹中放置所有翻译文件。该库不使用 Locale 的 countryCode，仅使用 languageCode。

例如：

• en.json

{
  "app": {
    "name": "Test application",
    "version": "1",
    "bar": {
      "title": "My title"
    }
  }
}

• hr.properties

app.name=Testna aplikacija
app.version=1
app.bar.title=Moj naslov

使用方法

要获取翻译，只需使用 TranslationsLoader 类中的静态方法 loadTranslations。例如：TranslationsLoader.loadTranslations("assets/i18n")。

要将此库与 GetX 库一起使用，需要实现 Translations 类：

class ApplicationTranslations extends Translations {
  final Map<String, Map<String, String>> _translationKeys;

  ApplicationTranslations(this._translationKeys);

  [@override](/user/override)
  Map<String, Map<String, String>> get keys => _translationKeys;
}

然后可以在设置 GetMaterialApp 时使用它：

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  runApp(GetMaterialApp(
    translations: ApplicationTranslations(
      await TranslationsLoader.loadTranslations("assets/i18n"),
    ),
    locale: Get.deviceLocale,
    fallbackLocale: defaultLocale,
    supportedLocales: supportedLocales,
    localizationsDelegates: const [
      GlobalMaterialLocalizations.delegate,
      GlobalWidgetsLocalizations.delegate,
      GlobalCupertinoLocalizations.delegate,
    ],
    home: const MyHomePage(),
  ));
}

示例代码

以下是一个完整的示例代码：

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

const defaultLocale = Locale("en", "US");
const supportedLocales = [
  defaultLocale,
  Locale.fromSubtags(languageCode: "hr")
];

/// Class which extends Get Translations
class ApplicationTranslations extends Translations {
  final Map<String, Map<String, String>> _translationKeys;

  ApplicationTranslations(this._translationKeys);

  [@override](/user/override)
  Map<String, Map<String, String>> get keys => _translationKeys;
}

/// Main method
Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  runApp(GetMaterialApp(
      translations: ApplicationTranslations(
          await TranslationsLoader.loadTranslations(
              "assets/i18n")), // can add supported locales param
      locale: Get.deviceLocale,
      fallbackLocale: defaultLocale,
      supportedLocales: supportedLocales,
      localizationsDelegates: const [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      home: const MyHomePage()));
}

/// Some default page
class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('app.bar.title'.tr),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'page.home.current_lang'.tr +
                  ': ' +
                  'lang.${Get.locale?.languageCode}'.tr,
            ),
            Card(
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  MaterialButton(
                    child: Text('lang.en'.tr),
                    onPressed: () => {Get.updateLocale(supportedLocales[0])},
                  ),
                  MaterialButton(
                    child: Text('lang.hr'.tr),
                    onPressed: () => {Get.updateLocale(supportedLocales[1])},
                  )
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}