Flutter国际化插件i18next_class_generator的使用

Flutter国际化插件i18next_class_generator的使用

对于Flutter的i18next包（https://pub.dev/packages/i18next）用于国际化。由于它不会生成引用文件，所以我们不得不在Dart文件中使用魔法字符串。为了解决这个问题，我们构建了这个包来为我们生成引用文件。

特性

这个包用于从JSON生成本地化引用文件。

使用方法

我们使用build_runner来生成引用代码。只需在示例目录中运行以下命令即可从JSON生成本地化Dart文件：

flutter pub run build_runner build

完整示例

示例代码：example/lib/main.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:i18next/i18next.dart';
import 'package:intl/intl.dart';

import 'i18n/localizations.i18next.dart';

void main() => runApp(const MyApp());

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);
  
  // 支持的本地化列表
  final List<Locale> locales = const [
    Locale('en', 'US'),  // 英语
    Locale('pt', 'BR'),  // 葡萄牙语
  ];

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

class _MyAppState extends State<MyApp> {
  late Locale locale;

  [@override](/user/override)
  void initState() {
    super.initState();

    // 初始化时选择第一个本地化
    locale = widget.locales.first;
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'I18nu Demo',
      theme: ThemeData(
        dividerTheme: const DividerThemeData(
          color: Colors.black45,
          space: 32.0,
        ),
      ),
      // 添加本地化代理
      localizationsDelegates: [
        ...GlobalMaterialLocalizations.delegates,
        I18NextLocalizationDelegate(
          locales: widget.locales,
          dataSource: AssetBundleLocalizationDataSource(
            bundlePath: 'i18next',
          ),
          options: const I18NextOptions(formatter: formatter),
        ),
      ],
      home: MyHomePage(
        supportedLocales: widget.locales,
        onUpdateLocale: updateLocale,
      ),
      locale: locale,
      supportedLocales: widget.locales,
    );
  }

  // 更新本地化的回调函数
  void updateLocale(Locale newLocale) {
    setState(() {
      locale = newLocale;
    });
  }

  // 自定义格式化函数
  static String formatter(Object value, String? format, Locale? locale) {
    switch (format) {
      case 'test_formatter':
        return value.toString().toUpperCase();
      case 'uppercase':
        return value.toString().toUpperCase();
      case 'lowercase':
        return value.toString().toLowerCase();
      default:
        if (value is DateTime) {
          return DateFormat(format, locale?.toString()).format(value);
        }
    }
    return value.toString();
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({
    Key? key,
    required this.supportedLocales,
    required this.onUpdateLocale,
  }) : super(key: key);

  final List<Locale> supportedLocales;
  final ValueChanged<Locale> onUpdateLocale;

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

class _MyHomePageState extends State<MyHomePage> {
  String _gender = '';

  [@override](/user/override)
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final i18n = I18n.of(context);

    return Scaffold(
      appBar: AppBar(
          title: Text(i18n.example.interpolationNested(
              {"key1": 'chiki chiki', "key2": "boom boom"}))),
      body: SingleChildScrollView(
        padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 24),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: <Widget>[
            CupertinoSegmentedControl<Locale>(
              children: {
                for (var e in widget.supportedLocales) e: Text(e.toString())
              },
              groupValue: Localizations.localeOf(context),
              onValueChanged: widget.onUpdateLocale,
            ),
            const Divider(),
            Text(
              i18n.example.base,
              style: theme.textTheme.headline6,
            ),
            Text(
              i18n.example.interpolation("weirdddd"),
              style: theme.textTheme.subtitle2,
            ),
            CupertinoSegmentedControl<String>(
              padding: const EdgeInsets.symmetric(vertical: 8),
              children: const {
                'male': Text('MALE'),
                'female': Text('FEMALE'),
                '': Text('OTHER'),
              },
              groupValue: _gender,
              onValueChanged: updateGender,
            ),
            Text(i18n.example
                .interpolationNested({"key1": "doge", "key2": "doge2"})),
            const Divider(),
            Text(
              i18n.example.nesting,
              style: theme.textTheme.headline4,
            ),
            Text(i18n.example.base),
            Text(i18n.example.interpolation("test 1")),
            Text(i18n.example.interpolationNested({
              "key1": "should uppercase",
              "key2": "object key 2",
            })),
            Text(i18n.example.nesting),
            Text(i18n.example.item(0)),
            Text(i18n.example.item(1)),
            Text(i18n.example.item(2)),
            Text(i18n.example.plural(0, "plural")),
            Text(i18n.example.plural(1, "plural")),
            Text(i18n.example.plural(2, "plural")),
            Text(i18n.example.nestingNested("surprise_object")),
          ],
        ),
      ),
    );
  }

  // 更新性别状态
  void updateGender(String gender) => setState(() => _gender = gender);
}