flutter_intl翻译如何实现

在Flutter项目中使用flutter_intl插件实现多语言翻译时，具体步骤是什么？是否需要手动创建arb文件？如何根据系统语言自动切换翻译内容？在代码中调用翻译文本的正确方式是什么？如果新增语言支持，需要修改哪些配置？

2 回复

使用flutter_intl插件，在pubspec.yaml中配置intl依赖，创建l10n.yaml文件定义本地化设置。然后通过arb文件管理多语言资源，使用S.of(context)调用翻译。

更多关于flutter_intl翻译如何实现的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


Flutter Intl 插件通过以下步骤实现国际化翻译：

1. 安装依赖

dependencies:
  flutter_localizations:
    sdk: flutter
  intl: any

dev_dependencies:
  flutter_intl: any

2. 配置 pubspec.yaml

flutter_intl:
  enabled: true
  main_locale: en # 默认语言

3. 初始化设置 在终端运行：

flutter pub get
flutter pub run flutter_intl:generate

4. 创建本地化文件

  • 在 lib/l10n 目录下生成：
    • intl_en.arb (英文)
    • intl_zh.arb (中文)
    • 其他语言文件

5. 编辑 ARB 文件示例

// intl_en.arb
{
  "hello": "Hello",
  "welcome": "Welcome {name}",
  "@welcome": {
    "description": "欢迎消息",
    "placeholders": {
      "name": {}
    }
  }
}

// intl_zh.arb  
{
  "hello": "你好",
  "welcome": "欢迎 {name}"
}

6. 生成本地化类 运行命令重新生成代码：

flutter pub run flutter_intl:generate

7. 在 MaterialApp 中配置

return MaterialApp(
  localizationsDelegates: const [
    S.delegate,
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
  ],
  supportedLocales: S.delegate.supportedLocales,
  home: MyHomePage(),
);

8. 使用翻译

Text(S.of(context).hello),
Text(S.of(context).welcome('Flutter'))

关键特性：

  • 自动生成类型安全的本地化类
  • 支持参数化翻译
  • 热重载时自动更新
  • 提供翻译描述和上下文

通过这个流程，可以快速实现多语言支持，且能保证类型安全。

回到顶部