Flutter本地化注解插件utopia_localization_annotation的使用

Flutter本地化注解插件 utopia_localization_annotation 的使用

utopia_localization_annotation 是一个用于生成国际化资源文件的注解库，它与 utopia_localization_generator 配合使用，可以轻松实现 Flutter 应用的多语言支持。

安装依赖

在 pubspec.yaml 文件中添加以下依赖：

dependencies:
  utopia_localization_annotation: ^版本号

dev_dependencies:
  build_runner: ^版本号
  utopia_localization_generator: ^版本号

运行 flutter pub get 安装依赖。

使用步骤

1. 创建注解类

   创建一个类并使用 [@Localization](/user/Localization) 注解来定义需要本地化的字符串。

   import 'package:utopia_localization_annotation/utopia_localization_annotation.dart';
   
   [@Localization](/user/Localization)(
     domain: 'app', // 国际化域，用于区分不同模块
     locales: ['en', 'zh'], // 支持的语言
   )
   abstract class AppLocalizations {
     static const locale = Locale('en'); // 默认语言
   
     [@StringKey](/user/StringKey)('hello_world') // 定义键值对
     String helloWorld();
   
     [@StringKey](/user/StringKey)('goodbye') // 定义键值对
     String goodbye();
   }
   

2. 生成资源文件

   运行以下命令生成资源文件：

   flutter pub run build_runner build
   

   生成的文件将包含 AppLocalizations 类的具体实现，并生成对应的 .arb 文件（JSON 格式的国际化文件）。

3. 编写本地化内容

   在生成的 .arb 文件中填写具体的翻译内容。例如：

   {
     "@ar": {},
     "hello_world": "Hello World",
     "goodbye": "Goodbye"
   }
   

   对于其他语言，如中文：

   {
     "@ar": {},
     "hello_world": "你好，世界",
     "goodbye": "再见"
   }
   

4. 加载本地化资源

   在应用中使用 AppLocalizations 加载本地化资源：

   import 'package:flutter/material.dart';
   import 'generated/app_localizations.g.dart'; // 导入生成的类
   
   void main() {
     runApp(MyApp());
   }
   
   class MyApp extends StatelessWidget {
     [@override](/user/override)
     Widget build(BuildContext context) {
       return MaterialApp(
         localizationsDelegates: [
           AppLocalizations.delegate, // 添加本地化代理
         ],
         supportedLocales: AppLocalizations.supportedLocales, // 支持的语言
         home: MyHomePage(),
       );
     }
   }
   
   class MyHomePage extends StatelessWidget {
     [@override](/user/override)
     Widget build(BuildContext context) {
       final localizations = AppLocalizations.of(context)!; // 获取本地化实例
   
       return Scaffold(
         appBar: AppBar(
           title: Text(localizations.helloWorld()), // 使用本地化字符串
         ),
         body: Center(
           child: Text(localizations.goodbye()), // 使用本地化字符串
         ),
       );
     }
   }
   

完整示例

以下是完整的代码示例，展示如何使用 utopia_localization_annotation 实现多语言支持：

import 'package:flutter/material.dart';
import 'package:utopia_localization_annotation/utopia_localization_annotation.dart';
import 'generated/app_localizations.g.dart'; // 导入生成的类

// 定义本地化注解类
[@Localization](/user/Localization)(
  domain: 'app',
  locales: ['en', 'zh'],
)
abstract class AppLocalizations {
  static const locale = Locale('en');

  [@StringKey](/user/StringKey)('hello_world')
  String helloWorld();

  [@StringKey](/user/StringKey)('goodbye')
  String goodbye();
}

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: [
        AppLocalizations.delegate,
      ],
      supportedLocales: AppLocalizations.supportedLocales,
      home: MyHomePage(),
    );
  }
}

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

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