Flutter 支持多语言的方式有很多种,常见的有使用 Flutter 自带的 intl 包、使用第三方库如 easy_localization、flutter_i18n 等。

以 intl 包为例,首先需要在 pubspec.yaml 文件中添加依赖:

dependencies:
  flutter:
    sdk: flutter
  intl: ^0.17.0

接着,在 main.dart 文件中引入 intl 包、定义默认语言和支持语言,示例代码如下:

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
        // 注册 intl 包的本地化代理
        AppLocalizations.delegate,
      ],
      supportedLocales: [
        const Locale('en', ''), // 英文
        const 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: MyHomePage(),
    );
  }
}

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;
      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 MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        // 使用 AppLocalizations 获取文本
        title: Text(AppLocalizations.of(context).title),
      ),
      body: Center(
        child: Text(
          AppLocalizations.of(context).title,
          style: TextStyle(fontSize: 24.0),
        ),
      ),
    );
  }
}

在 AppLocalizations 类中定义文本键值,使用 Intl.message 方法获取对应语言的文本。在 MyHomePage 中使用 AppLocalizations.of(context) 获取 AppLocalizations 实例,通过实例获取对应的文本。这样,就可以实现多语言支持了。

对于自己写死的 text 文本,只需要将文本改为 AppLocalizations.of(context).xxx 即可,xxx 为文本键值。例如:

Text(
  AppLocalizations.of(context).title,
  style: TextStyle(fontSize: 24.0),
)
Flutter 多语言设置:使用 intl 包实现文本本地化

原文地址: https://www.cveoy.top/t/topic/mXGs 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录