在这里插入图片描述

前言

青花瓷作为中国传统文化的代表,具有国际影响力。为了让更多人了解青花瓷文化,我们需要为App添加多语言支持。本篇文章将介绍如何实现Flutter与OpenHarmony双端的国际化功能,支持中文和英文两种语言。

国际化不仅是语言翻译,还包括日期格式、数字格式等本地化内容。良好的国际化设计能够让应用在不同地区都能提供优质的用户体验。

语言资源文件

首先创建语言资源文件,存储各语言的文本内容。

// lib/l10n/app_zh.dart
const Map<String, String> zhCN = {
  'app_name': '青花瓷',
  'home': '首页',
  'collection': '藏品',
  'knowledge': '知识',
  'profile': '我的',
  'search_hint': '搜索藏品、知识...',
  'featured': '精选藏品',
  'dynasty_all': '全部',
  'dynasty_yuan': '元代',
  'dynasty_ming': '明代',
  'dynasty_qing': '清代',
};


语言资源文件使用Map结构存储键值对,键是语言标识符,值是对应的翻译文本。这种结构便于管理和查找。文件按语言分开存储,便于翻译人员独立工作。

## 英文语言资源

创建英文语言资源文件,与中文资源保持相同的键名。

```dart
// lib/l10n/app_en.dart
const Map<String, String> enUS = {
  'app_name': 'Blue & White Porcelain',
  'home': 'Home',
  'collection': 'Collection',
  'knowledge': 'Knowledge',
  'profile': 'Profile',
  'search_hint': 'Search porcelain, knowledge...',
  'featured': 'Featured Collection',
  'dynasty_all': 'All',
  'dynasty_yuan': 'Yuan Dynasty',
  'dynasty_ming': 'Ming Dynasty',
  'dynasty_qing': 'Qing Dynasty',
};

英文资源文件的键名与中文完全一致,这样在代码中使用相同的键就能获取对应语言的文本。翻译时需要注意文化差异,比如朝代名称需要使用国际通用的英文表达。

本地化服务

创建本地化服务,管理当前语言和文本获取。

// lib/services/localization_service.dart
import 'package:flutter/material.dart';
import '../l10n/app_zh.dart';
import '../l10n/app_en.dart';

class LocalizationService extends ChangeNotifier {
  Locale _locale = const Locale('zh', 'CN');
  
  Locale get locale => _locale;

  Map<String, String> get _strings {
    switch (_locale.languageCode) {
      case 'en':
        return enUS;
      default:
        return zhCN;
    }
  }

  String tr(String key) {
    return _strings[key] ?? key;
  }

  void setLocale(Locale locale) {
    _locale = locale;
    notifyListeners();
  }
}

LocalizationService继承ChangeNotifier,当语言切换时通知所有监听者更新UI。tr方法根据键名获取当前语言的文本,如果找不到则返回键名本身。这种设计使得语言切换变得简单。

OpenHarmony国际化配置

在OpenHarmony端配置多语言资源文件。

// ohos/entry/src/main/resources/zh_CN/element/string.json
{
  "string": [
    { "name": "app_name", "value": "青花瓷" },
    { "name": "home", "value": "首页" },
    { "name": "collection", "value": "藏品" },
    { "name": "knowledge", "value": "知识" },
    { "name": "profile", "value": "我的" }
  ]
}

OpenHarmony使用JSON格式的资源文件,按语言放在不同的目录下。zh_CN目录存放中文资源,en_US目录存放英文资源。系统会根据设备语言设置自动选择对应的资源文件。

在Widget中使用

展示如何在Widget中使用本地化文本。

// lib/screens/home/home_screen.dart
class HomeScreen extends StatelessWidget {
  const HomeScreen({super.key});

  
  Widget build(BuildContext context) {
    final l10n = context.watch<LocalizationService>();
    
    return Scaffold(
      appBar: AppBar(
        title: Text(l10n.tr('app_name')),
      ),
      body: Column(
        children: [
          Text(l10n.tr('featured')),
        ],
      ),
    );
  }
}

通过context.watch获取LocalizationService实例,调用tr方法获取本地化文本。当语言切换时,所有使用了watch的Widget都会自动重建,显示新语言的文本。

语言切换功能

在设置页面提供语言切换功能。

// lib/screens/settings/widgets/language_setting.dart
class LanguageSettingTile extends StatelessWidget {
  const LanguageSettingTile({super.key});

  
  Widget build(BuildContext context) {
    final l10n = context.watch<LocalizationService>();
    
    return ListTile(
      leading: const Icon(Icons.language),
      title: const Text('语言'),
      subtitle: Text(l10n.locale.languageCode == 'zh' ? '中文' : 'English'),
      onTap: () {
        showDialog(
          context: context,
          builder: (context) => SimpleDialog(
            title: const Text('选择语言'),
            children: [
              SimpleDialogOption(
                child: const Text('中文'),
                onPressed: () {
                  l10n.setLocale(const Locale('zh', 'CN'));
                  Navigator.pop(context);
                },
              ),
              SimpleDialogOption(
                child: const Text('English'),
                onPressed: () {
                  l10n.setLocale(const Locale('en', 'US'));
                  Navigator.pop(context);
                },
              ),
            ],
          ),
        );
      },
    );
  }
}

语言设置项显示当前语言,点击后弹出语言选择对话框。选择新语言后调用setLocale方法切换语言,整个应用的文本会立即更新。这种实现方式简单直观。

总结

本篇文章详细介绍了青花瓷App多语言国际化的实现,包括语言资源管理、本地化服务和语言切换功能。通过国际化支持,青花瓷文化可以传播到更广泛的受众。下一篇文章将介绍深色模式的适配。
欢迎加入开源鸿蒙跨平台社区:https://openharmonycrossplatform.csdn.net

Logo

社区规范:仅讨论OpenHarmony相关问题。

更多推荐