如何在Flutter中本地化应用

如果您希望在全球范围内使用您的应用程序，则对应用程序进行本地化是一项重要的要求。 Flutter arb文件对应用进行本地化的简单方法。 本文将说明如何在Flutter本地化您的应用程序。 请注意，本文基于Flutter 2.0.1，因此，如果您使用的是旧版本，则本文中介绍的方法可能无法正常工作。

1.将依赖项添加到pubspec.yaml

将依赖项添加到pubspec.yaml

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter
  intl: ^0.16.1

这些软件包对于本地化是必需的。

2.将generate标志添加到pubspec.yaml

flutter:
  generate: true

此标志使Flutter可以从本地化所需的arb AppLocalizations

3.创建l10n.yaml

arb-dir: lib/l10n
template-arb-file: app_en.arb
output-localization-file: app_localizations.dart

该文件提供了自动生成AppLocalizations类时的配置。 arb-dir arb文件的目录。 template-arb-file指定用作模板arb output-localization-file AppLocalizations类文件的名称。

4.创建arb文件

在l10n.yaml中指定的目录中创建arb arb文件是json格式，您可以为每个键提供翻译。 凯被称为resource id ，值被称为resource value 。 例如，以下示例为resource id helloWorld提供了英语翻译。

{
  "helloWorld": "Hello World!",
  "@helloWorld": {
    "description": "The conventional newborn programmer greeting"
  }
}

您可以通过在resource id添加@前缀来提供对resource id的详细说明。在上面的示例中， @helloWorld resource id helloWorld的详细信息。 然后，您可以根据您的应用支持的语言arb 例如，如果您支持日语，则可以添加如下所示的app_ja.arb

{
  "helloWorld": "こんにちは世界!"
}

arb文件提供了各种有用的表达式，在这里我将介绍其中之一， placeholder 。 Placeholder使您可以将参数传递给resource value 。

"pricePerMonth": "{price} per month",
"@pricePerMonth": {
  "placeholders": {
    "price": {
      "example": "123.45",
      "description": "price"
    }
  }
}

resource value传递任何参数，例如{price} 。 @resource id下的placeholders编写参数的描述。 创建placeholder并自动生成AppLocalizations类后，您可以从您的应用中调用它，如下所示。

AppLocalizations.of(context).pricePerMonth(100.0);

5.自动创建AppLocalizations类文件

如果您调用flutter pub get或构建您的应用程序，则将自动生成AppLocalizations文件名在l10n.yaml中指定。 在这种情况下，文件将是.dart_tool/flutter_gen/gen_l10n/app_localizations.dart 。该目录由系统确定。

顺便说一句，您不需要将此文件提交到git。当您构建应用并反映最新的arb文件内容时，始终会生成此文件。

6.调用Material / Widget / CupertinoApp

设置localizationsDelegates和supportedLocales参数。 不要忘记导入AppLocalizations类。

import 'package:flutter_gen/gen_l10n/app_localizations.dart';

@override
Widget build(BuildContext context) {
  return MaterialApp(
    localizationsDelegates: AppLocalizations.localizationsDelegates, // Add this line
    supportedLocales: AppLocalizations.supportedLocales, // Add this line
    home: // ...
  );
}

7.呼叫翻译后的文字

您可以像下面的示例一样使用本地化的文本。 语法类似于AppLocalizations.of(context).<resource id>。

Text(AppLocalizations.of(context).helloWorld);

日期的本地化

您还可以显示本地化的日期，如下所示。

Locale locale = Localizations.localeOf(context);
DateFormat.yMd(locale.toString()).format(DateTime.now());

参考

• Flutter.dev
• ARB规范