Flutter本地化管理插件modular_localization的使用

当然，关于Flutter本地化管理插件modular_localization的使用，下面是一个详细的代码案例来展示如何集成和使用该插件。

1. 添加依赖

首先，在你的pubspec.yaml文件中添加modular_localization和flutter_localizations的依赖：

dependencies:
  flutter:
    sdk: flutter
  modular_localization: ^x.y.z  # 请替换为最新版本号
  flutter_localizations:
    sdk: flutter

2. 创建语言文件

在assets目录下创建一个locales文件夹，并在其中创建对应的语言文件，比如en.json和zh.json：

// assets/locales/en.json
{
  "welcome": "Welcome",
  "goodbye": "Goodbye"
}

// assets/locales/zh.json
{
  "welcome": "欢迎",
  "goodbye": "再见"
}

3. 配置pubspec.yaml

在pubspec.yaml中配置资源文件：

flutter:
  assets:
    - assets/locales/en.json
    - assets/locales/zh.json

4. 设置MaterialApp的本地化

在你的main.dart文件中，使用ModularApp并配置本地化：

import 'package:flutter/material.dart';
import 'package:flutter_modular/flutter_modular.dart';
import 'package:modular_localization/modular_localization.dart';

void main() {
  runApp(ModularApp(
    module: AppModule(),
    child: MaterialApp(
      title: 'Modular Localization Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      localizationsDelegates: [
        // 添加ModularLocalizationsDelegate
        ModularLocalizationsDelegate(),
        // 添加GlobalMaterialLocalizations和其他必要的本地化委托
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      supportedLocales: [
        Locale('en', ''),
        Locale('zh', ''),
      ],
      localeResolutionCallback: (locale, supportedLocales) {
        // 根据需要自定义本地化解析逻辑
        for (var supportedLocale in supportedLocales) {
          if (supportedLocale.languageCode == locale?.languageCode ||
              supportedLocale.countryCode == locale?.countryCode) {
            return supportedLocale;
          }
        }
        return supportedLocales.first;
      },
      home: HomePage(),
    ),
  ));
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    final ModularLocalizations localizations = ModularLocalizations.of(context)!;
    return Scaffold(
      appBar: AppBar(
        title: Text(localizations.translate('welcome')),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(localizations.translate('welcome')),
            ElevatedButton(
              onPressed: () {
                Modular.to.pushNamed('/change_language');
              },
              child: Text(localizations.translate('change_language')), // 假设你有一个改变语言的路由
            ),
          ],
        ),
      ),
    );
  }
}

5. 配置路由和模块

创建一个模块文件app_module.dart，并配置路由：

import 'package:flutter_modular/flutter_modular.dart';
import 'home_page.dart';
import 'change_language_page.dart';

class AppModule extends Module {
  @override
  final List<Bind> binds = [];

  @override
  final List<ModularRoute> routes = [
    ModularRoute('/', child: (context, args) => HomePage()),
    ModularRoute('/change_language', child: (context, args) => ChangeLanguagePage()),
  ];
}

6. 创建改变语言的页面

创建一个change_language_page.dart文件，用于切换语言：

import 'package:flutter/material.dart';
import 'package:flutter_modular/flutter_modular.dart';
import 'package:modular_localization/modular_localization.dart';

class ChangeLanguagePage extends StatefulWidget {
  @override
  _ChangeLanguagePageState createState() => _ChangeLanguagePageState();
}

class _ChangeLanguagePageState extends State<ChangeLanguagePage> {
  Locale? _selectedLocale;

  @override
  Widget build(BuildContext context) {
    final ModularLocalizations localizations = ModularLocalizations.of(context)!;
    return Scaffold(
      appBar: AppBar(
        title: Text(localizations.translate('change_language')),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            DropdownButton<Locale>(
              value: _selectedLocale,
              hint: Text(localizations.translate('select_language')),
              onChanged: (Locale? newValue) {
                setState(() {
                  _selectedLocale = newValue;
                  Modular.get<ModularLocalizations>().changeLocale(_selectedLocale!);
                  Modular.to.pop();
                });
              },
              items: [
                DropdownMenuItem<Locale>(
                  value: Locale('en', ''),
                  child: Text('English'),
                ),
                DropdownMenuItem<Locale>(
                  value: Locale('zh', ''),
                  child: Text('中文'),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

7. 运行应用

现在，你可以运行你的Flutter应用，并看到本地化已经生效。你可以通过点击按钮跳转到ChangeLanguagePage页面来选择语言，选择后应用的语言将会切换。

这个示例展示了如何使用modular_localization插件来管理Flutter应用的本地化。注意，实际项目中可能需要更多的配置和优化，比如持久化用户选择的语言等。