跳到主要内容

第13章：国际化与本地化

简要说明​

在开发Flutter应用时，为了满足全球用户的需求，通常需要为应用添加多语言支持。国际化（Internationalization，简称i18n）和本地化（Localization，简称l10n）是实现这一目标的关键技术。本章将介绍如何使用Flutter的国际化工具和库，为应用添加多语言支持，并实现动态语言切换。

关键知识点​

1. 使用intl库实现国际化​

intl是Dart的一个国际化库，提供了格式化日期、数字、货币等功能，同时也支持多语言文本的翻译。在Flutter中，intl库是国际化的核心工具之一。

安装intl库​

首先，在pubspec.yaml文件中添加intl库的依赖：

dependencies:
  flutter:
    sdk: flutter
  intl: ^0.17.0

然后运行flutter pub get来安装依赖。

使用intl库​

intl库的核心是Intl类，它提供了多种格式化方法。例如，格式化日期：

import 'package:intl/intl.dart';

void main() {
  var now = DateTime.now();
  var formatter = DateFormat('yyyy-MM-dd');
  String formattedDate = formatter.format(now);
  print(formattedDate); // 输出：2023-10-05
}

2. 配置多语言资源文件​

为了实现多语言支持，我们需要为每种语言创建一个资源文件，通常是一个JSON文件或ARB文件。Flutter提供了flutter_localizations包来简化这一过程。

添加flutter_localizations依赖​

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

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter

创建多语言资源文件​

在lib/l10n目录下创建多语言资源文件。例如，创建app_en.arb和app_zh.arb文件：

app_en.arb

{
  "helloWorld": "Hello World!",
  "@helloWorld": {
    "description": "The conventional newborn programmer greeting"
  }
}

app_zh.arb

{
  "helloWorld": "你好，世界！",
  "@helloWorld": {
    "description": "程序员的新生问候"
  }
}

生成本地化类​

使用flutter gen-l10n命令生成本地化类：

flutter gen-l10n

这将生成一个AppLocalizations类，用于访问多语言资源。

3. 动态切换语言​

为了实现动态语言切换，我们需要使用MaterialApp的locale和localizationsDelegates属性。

配置MaterialApp​

在MaterialApp中配置locale和localizationsDelegates：

import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      localizationsDelegates: AppLocalizations.localizationsDelegates,
      supportedLocales: AppLocalizations.supportedLocales,
      home: MyHomePage(),
    );
  }
}

动态切换语言​

为了实现动态语言切换，可以使用Locale类和MaterialApp的locale属性。例如，通过按钮切换语言：

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  Locale _locale = Locale('en');

  void _changeLanguage(Locale locale) {
    setState(() {
      _locale = locale;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(AppLocalizations.of(context)!.helloWorld),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(AppLocalizations.of(context)!.helloWorld),
            ElevatedButton(
              onPressed: () => _changeLanguage(Locale('en')),
              child: Text('English'),
            ),
            ElevatedButton(
              onPressed: () => _changeLanguage(Locale('zh')),
              child: Text('中文'),
            ),
          ],
        ),
      ),
    );
  }
}

总结​

本章介绍了如何为Flutter应用添加多语言支持，包括使用intl库、配置多语言资源文件以及实现动态语言切换。通过这些技术，你可以轻松地为应用添加国际化支持，满足全球用户的需求。

在下一章中，我们将探讨Flutter中的状态管理，学习如何有效地管理应用的状态，以构建更复杂的应用。