关于Flutter应用国际化语言的设置

目录

[1. Locale配置](#1. Locale配置)

[2. 用户切换/启动自动加载缓存里面的locale](#2. 用户切换/启动自动加载缓存里面的locale)


由于最近在开发app国际化设置的时候遇到一些问题,所以做出一些总结。

1. Locale配置

具体的初始化配置可以参考文档:i18n | Flutter 中文文档 - Flutter 中文开发者网站 - Flutter

值得注意的是这里记得要加上自己的delegate,不然启动会有context相关的问题。(dependOnInheritedWidgetOfExactType<_LocalizationsScope>() or dependOnInheritedElement() was called before _HomeViewState.initState() completed.)

作为一些补充也可以参考:Flutter实现国际化(多语言)_flutter 国际化-CSDN博客

2. 用户切换/启动自动加载缓存里面的locale

Dart 复制代码
void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  // Load the cached locale before the app starts
  Storage().getData(CommonSpKey.locale.value).then((cachedLanguageCode) {
    runApp(ChangeNotifierProvider(
      create: (_) {
        final provider = LocaleProvider();
        provider.init(Locale(cachedLanguageCode ?? 'zh'));
        return provider;
      },
      child: MyApp(cachedLocale: Locale(cachedLanguageCode ?? 'zh')),
    ),);
  });
}
Dart 复制代码
Future<String?> getData(String key) async {
    final preference = await SharedPreferences.getInstance();
    return preference.getString(key);
  }

简单来说,这里是在main.dart里面启动的时候加载缓存的语言,然后通过MyApp这个widget的localeResolutionCallback来设置当前显示的locale。

updatedLocale是用户当前选择的所以优先显示,

如果没有就读取cacheLocale的,

如果还是没有就读取系统环境的locale。

Dart 复制代码
final Locale? updatedLocale = context.watch<LocaleProvider>().currentLocale;

--

localeResolutionCallback: (locale, supportedLocales) {
  if (updatedLocale != null) {
    // print('---------> 1: ${updatedLocale.languageCode}');
    return Locale(updatedLocale.languageCode);
  }
  if(cachedLocale != null) {
    // print('---------> 2: ${cachedLocale!.languageCode}');
    return cachedLocale;
  }
  // print('---------> 3');
  if (locale?.countryCode == 'US') {
    return const Locale('en', 'US');
  } else {
    return const Locale('zh', 'CN');
  }
},
locale: cachedLocale, // Default locale
相关推荐
小风呼呼吹儿2 分钟前
Flutter 框架跨平台鸿蒙开发 - 老年便捷助手:打造适合老年人的智能工具箱
flutter·华为·harmonyos
小雨下雨的雨10 分钟前
禅息:在鸿蒙与 Flutter 之间寻找呼吸的艺术
算法·flutter·华为·重构·交互·harmonyos
2501_9445264214 分钟前
Flutter for OpenHarmony 万能游戏库App实战 - 关于页面实现
android·java·开发语言·javascript·python·flutter·游戏
鸣弦artha19 分钟前
Card组件基础使用
flutter
IT陈图图25 分钟前
基于 Flutter × OpenHarmony 音乐播放器应用——构建录音控制按钮与录音状态按钮
flutter·华为·鸿蒙·openharmony
[H*]29 分钟前
Flutter框架跨平台鸿蒙开发——Image综合应用
flutter·华为·harmonyos
小风呼呼吹儿1 小时前
Flutter 框架跨平台鸿蒙开发 - 倒计时秒表:打造多功能计时工具
网络·flutter·华为·harmonyos
IT陈图图1 小时前
Flutter × OpenHarmony 文件管家:数据结构设计与实现
数据结构·flutter
AI_零食1 小时前
鸿蒙跨端框架 Flutter 学习 Day 4:异步编程基础——Future 与非阻塞执行的物理真相
学习·flutter·harmonyos
kirk_wang1 小时前
Flutter艺术探索-Provider状态管理:从入门到精通
flutter·移动开发·flutter教程·移动开发教程