Flutter本地化支持插件toml_localizations的使用

Flutter本地化支持插件toml_localizations的使用

toml_localizations 是一个为 Flutter 设计的轻量级 TOML 本地化包。

安装

首先，在你的 pubspec.yaml 文件中添加 toml_localizations 和 flutter_localizations 作为依赖项：

dependencies:
  flutter_localizations:
    sdk: flutter
  toml_localizations: <last-version>

添加资源文件

在项目中为每种语言添加一个 TOML 文件，并在 pubspec.yaml 中定义这些文件的路径。例如，假设你有以下目录结构：

assets/
  toml_translations/
    en-US.toml
    nb.toml

在 pubspec.yaml 文件中添加如下配置：

flutter:
  assets:
    - assets/toml_translations/

确保 TOML 文件名与 supportedLocales 中的语言和地区代码完全匹配。例如，Locale('en', 'US') 对应的文件名为 assets/toml_translations/en-US.toml。

添加本地化委托和受支持的语言地区

在 MaterialApp 中添加 TomlLocalizationsDelegate 并设置 supportedLocales 为受支持的语言和地区代码：

MaterialApp(
  localizationsDelegates: [
    // 来自 flutter_localization 的委托
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
    GlobalCupertinoLocalizations.delegate,
    // toml localizations 委托
    TomlLocalizationsDelegate(path: 'assets/toml_translations')
  ],
  supportedLocales: [
    Locale('en', 'GB'),
    Locale('en', 'US'),
    Locale('en'),
    Locale('nb'),
  ],
  theme: ThemeData(
    primarySwatch: Colors.blue,
    visualDensity: VisualDensity.adaptivePlatformDensity,
  ),
  home: const MyHomePage(),
);

iOS 注意事项

如果你的应用运行在 iOS 上，需要在 ios/Runner/Info.plist 文件中添加受支持的语言和地区代码。例如：

<key>CFBundleLocalizations</key>
<array>
  <string>en</string>
  <string>en-GB</string>
  <string>en-US</string>
  <string>nb</string>
</array>

格式

一个示例 TOML 文件可能如下所示：

str = "The quick brown fox jumps over the lazy dog."

literal_str = 'C:\\Users\\nodejs\\templates'

multiline_str = """\
The quick brown \
fox jumps over \
the lazy dog.\
"""

literal_multiline_str = '''
The first newline is
trimmed in raw strings.
   All other whitespace
   is preserved.
'''

list = [ 'one', 'two', 'three' ]

提示: TOML 支持多种字符串表示方式。有关更多信息，请参阅 TOML 文档。

API

你可以通过以下方式翻译字符串或其他类型：

TomlLocalizations.of(context)!.value(this);

为了简化代码，你可以添加一个扩展方法到 String 类中：

extension LocalizedString on String {
  String tr(BuildContext context) => TomlLocalizations.of(context)!.value(this);
}

这样你就可以像下面这样翻译字符串了：

'Hi'.tr(context)

示例

查看 示例代码

import 'package:flutter/material.dart';
import 'package:toml_localizations/toml_localizations.dart';
import 'package:flutter_localizations/flutter_localizations.dart';

extension LocalizedString on String {
  String tr(BuildContext context) => TomlLocalizations.of(context)!.value(this);
}

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: [
        ...GlobalMaterialLocalizations.delegates,
        TomlLocalizationsDelegate(path: 'assets'),
      ],
      supportedLocales: const [
        Locale('nb'),
        Locale('en', 'GB'),
        Locale('en', 'US'),
        Locale('en'),
      ],
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);

  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    final List<String> list = TomlLocalizations.of(context)!.value('list').cast<String>();
    return Scaffold(
      appBar: AppBar(
        title: const Text('toml_localizations'),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text('str'.tr(context)),
          const SizedBox(height: 12),
          Text('literal_str'.tr(context)),
          const SizedBox(height: 12),
          Text('multiline_str'.tr(context)),
          const SizedBox(height: 12),
          Text('literal_multiline_str'.tr(context)),
          for (final str in list) Text(str)
        ],
      ),
    );
  }
}