Flutter 本地化l10n（多語言i18n）的支持

首先說一下要用到的庫

主要用到3個庫flutter_localizations intl intl_translation

dependencies:
 flutter_localizations:
 sdk: flutter
 intl: 0.15.7
dev_dependencies:
 intl_translation: 0.17.4
複製代碼

設置App

return MaterialApp(
    onGenerateTitle: (BuildContext context) =>
        AppLocalizations.of(context).title,
    debugShowCheckedModeBanner: false,
    theme: ThemeData(
      primarySwatch: Colors.blue,
    ),
    home: routes.buildPage('login', null),
    localizationsDelegates: [
      // ... app-specific localization delegate[s] her
      AppLocalizationsDelegate(),
      GlobalMaterialLocalizations.delegate,
      GlobalWidgetsLocalizations.delegate,
    ],
    supportedLocales: [
      // 支持語言設置
      const Locale('en', 'US'), // English
      const Locale('zh', 'CH'), // Chinese
      // ... other locales the app supports
    ],
    onGenerateRoute: (RouteSettings settings) {
      return MaterialPageRoute<Object>(builder: (BuildContext context) {
        return routes.buildPage(settings.name, settings.arguments);
      });
    },
  );
複製代碼

編寫本地化類

Lib/localizations.dart

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

import 'l10n/messages_all.dart';

class AppLocalizations {
  static Future<AppLocalizations> load(Locale locale) {
    final String name =
        locale.countryCode.isEmpty ? locale.languageCode : locale.toString();
    final String localeName = Intl.canonicalizedLocale(name);
    return initializeMessages(localeName).then((_) {
      Intl.defaultLocale = localeName;
      print(
          'the local code of $localeName ${locale.countryCode.isEmpty} ${locale}');
      return AppLocalizations();
    });
  }

  static AppLocalizations of(BuildContext context) {
    return Localizations.of<AppLocalizations>(context, AppLocalizations);
  }

  String get title {
    return Intl.message(
      'Hello World',
      name: 'title',
      desc: 'Title for the Demo application',
    );
  }
}

class AppLocalizationsDelegate extends LocalizationsDelegate<AppLocalizations> {
  const AppLocalizationsDelegate();

  @override
  bool isSupported(Locale locale) => ['en', 'zh'].contains(locale.languageCode);

  @override
  Future<AppLocalizations> load(Locale locale) => AppLocalizations.load(locale);

  @override
  bool shouldReload(AppLocalizationsDelegate old) => false;
}

複製代碼

導出intl_messages.arb

導出命令

flutter pub pub run intl_translation:extract_to_arb --output-dir=lib/l10n lib/localizations.dart
複製代碼

導出的文件 l10n/intl_messages.arb

{
  "@@last_modified": "2019-04-28T15:58:14.536252",
  "title": "Hello World",
  "@title": {
    "description": "Title for the Demo application",
    "type": "text",
    "placeholders": {}
  }
}
複製代碼

編寫對應的 l10n/intl_[locale].arb

l10n/intl_en.arb

{
  "@@last_modified": "2019-04-28T15:58:14.536252",
  "title": "Hello World",
  "@title": {
    "description": "Title for the application",
    "type": "text",
    "placeholders": {}
  }
}
複製代碼

l10n/intl_zh.arb

{
  "@@last_modified": "2019-04-28T15:58:14.536252",
  "title": "你好世界",
  "@title": {
    "description": "Title for the application",
    "type": "text",
    "placeholders": {}
  }
}
複製代碼

arb 導出 dart 類

命令

flutter pub pub run intl_translation:generate_from_arb --output-dir=lib/l10n \
   --no-use-deferred-loading lib/localizations.dart lib/l10n/intl_*.arb
複製代碼

使用

import 'localizations.dart';

...
AppLocalizations.of(context).title
複製代碼

更新 iOS app bundle

打開ios/Runner.xcworkspace找到Runner的Info.plist

添加一個key爲Localizationsvalue爲你支持的語言

最後

good luck

原文地址：domliang.github.io/blog/2019/0…