Flutter本地化翻译插件localization_translator的使用

Flutter本地化翻译插件localization_translator的使用

在Flutter应用开发中，实现多语言支持是一项常见的需求。localization_translator 插件可以帮助开发者更方便地处理多语言翻译。本文将详细介绍如何使用 localization_translator 插件来为您的Flutter应用添加多语言支持。

安装插件

首先，在您的 pubspec.yaml 文件中添加 localization_translator 依赖：

dependencies:
  flutter:
    sdk: flutter
  localization_translator: ^版本号

然后运行 flutter pub get 来安装该插件。

准备翻译文件

为了使用 localization_translator 插件，您需要准备一个包含原始语言（例如英语）翻译文本的JSON文件。以下是一个简单的例子：

test.json

{
  "hello": "Hello",
  "goodbye": "Goodbye"
}

生成目标语言文件

接下来，使用 localization_translator 提供的命令行工具生成目标语言文件。例如，如果您想将英语翻译成乌兹别克语，可以运行以下命令：

dart run localization_translator:generate --input 'test.json' --output 'test_out2.json' --from 'en' --to 'uz'

这将会生成一个名为 test_out2.json 的文件，其中包含了从英语到乌兹别克语的翻译结果。

在Flutter项目中使用翻译文件

现在我们已经拥有了翻译文件，接下来需要在Flutter项目中使用这些翻译文件。首先，创建一个类来加载翻译文件：

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

class AppLocalizations {
  final Locale locale;

  AppLocalizations(this.locale);

  static AppLocalizations of(BuildContext context) {
    return Localizations.of<AppLocalizations>(context, AppLocalizations);
  }

  static const LocalizationsDelegate<AppLocalizations> delegate = _AppLocalizationsDelegate();

  Map<String, String> _localizedStrings;

  Future<void> load() async {
    String jsonString = await rootBundle.loadString('assets/${locale.languageCode}.json');
    Map<String, dynamic> jsonMap = json.decode(jsonString);

    _localizedStrings = jsonMap.map((key, value) {
      return MapEntry(key, value.toString());
    });
  }

  String translate(String key) {
    return _localizedStrings[key];
  }
}

class _AppLocalizationsDelegate extends LocalizationsDelegate<AppLocalizations> {
  [@override](/user/override)
  bool isSupported(Locale locale) {
    return ['en', 'uz'].contains(locale.languageCode);
  }

  [@override](/user/override)
  Future<AppLocalizations> load(Locale locale) async {
    AppLocalizations localizations = new AppLocalizations(locale);
    await localizations.load();
    return localizations;
  }

  [@override](/user/override)
  bool shouldReload(_AppLocalizationsDelegate old) => false;
}

接下来，确保在 MaterialApp 中使用 localizationsDelegates 和 supportedLocales 参数：

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Localization Example',
      supportedLocales: [
        Locale('en'),
        Locale('uz'),
      ],
      localizationsDelegates: [
        AppLocalizations.delegate,
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
      ],
      home: HomePage(),
    );
  }
}

最后，在应用中使用翻译功能：

class HomePage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    var localizations = AppLocalizations.of(context);

    return Scaffold(
      appBar: AppBar(
        title: Text(localizations.translate('hello')),
      ),
      body: Center(
        child: Text(localizations.translate('goodbye')),
      ),
    );
  }
}