Flutter 语言国际化状态管理

Flutter语言国际化,手动切换App语言

在这里插入图片描述

1、配置字体文件:custom_localization.dart

import 'dart:async';

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

class Translations {
  Locale _locale;
  // 多语言文本资源,为了演示上的方便,将文本资源放到这个map里。
  // 实际工程中可以将资源放到本地的文件中,通过rootBundle去加载。
  // 也可以将资源放到服务器上,通过网络请求加载。
  Map<String, Map<String, String>> _resourceMap = {
    'zh': {
      'preferred_language':'语言',
      'theme':'简体中文',
    },
    'en': {
      'preferred_language':'Language',
      'theme':'English',
    },
  };

  Translations(this._locale);

  String text(textKey) {
    return _resourceMap[_locale.languageCode][textKey];
  }

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

  // 加载资源的方式。
  // 可以看到这个方法返回的类型是一个Future
  // 因为我们可以将多语言文本资源放到服务端或者本地文件里,
  // 因此加载多文本资源可能是耗时的,所以这里返回的类型是Future
  // 这里为了演示上的方便,将文本资源直接硬编码到代码里了。
  static Future<Translations> load(Locale locale) async {
    return SynchronousFuture<Translations>(Translations(locale));
  }

  static const _TranslationDelegate delegate = _TranslationDelegate();
}

class _TranslationDelegate extends LocalizationsDelegate<Translations> {
  const _TranslationDelegate();

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

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

  @override
  bool shouldReload(LocalizationsDelegate<Translations> old) => false;
}

2、配置你的main.dart文件

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

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

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return AppState();
  }
}

class AppState extends State<MyApp> {
    // 供外部使用的_AppSetting实例,用于修改app的状态
  static _AppSetting setting = _AppSetting();

    @override
  void initState() {
    super.initState();
    // 更改语言
    setting.changeLocale = (Locale locale) {
      if (setting._supportedLocales
          .map((locale) {
            return locale.languageCode;
          })
          .toSet()
          .contains(locale?.languageCode)) {
        setState(() {
          setting._locale = locale;
        });
      }
    };
  }

  @override
  Widget build(BuildContext context) {
	return	MaterialApp(
            title: 'locallizationTest',
            initialRoute: '/',
            onGenerateRoute:onGenerateRoute,
            debugShowCheckedModeBanner: false,
            theme: ThemeData(
              platform: TargetPlatform.iOS,
              primaryColor: Color(0xffEC761F),
            ),
            locale: setting._locale,
            localeResolutionCallback: (deviceLocale, supportedLocales) {
              print('当前语言:${deviceLocale.toString()}');
              return;
            },
            localizationsDelegates: [
              // 不要忘了将Translates.delegate添加到localizationsDelegates的列表中
              Translations.delegate,
              GlobalMaterialLocalizations.delegate,
              GlobalWidgetsLocalizations.delegate,
              GlobalCupertinoLocalizations.delegate,
            ],
            supportedLocales: setting._supportedLocales,
          ),
  }

}

class _AppSetting {
  _AppSetting();
  
  Null Function(Locale locale) changeLocale;
  Locale _locale;
  List<Locale> _supportedLocales = [Locale('zh', 'CH'), Locale('en', 'US')];
}

3、在文件中使用

import 'package:locallizationTest/main.dart';
import 'package:locallizationTest/utils/localization/custom_localization.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';


class HomePage extends StatefulWidget {
  @override
  _HomePage State createState() => _HomePage State();
}

class _HomePage State extends State<HomePage> {
  
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body:ConstrainedBox(
        constraints: BoxConstraints.expand(),
        child: Container(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Container(
                child:Text('当前语言:${Translations.of(context).text('theme')}')
              ),
              RaisedButton(
                child:Text('切换语言'),
                onPressed: (){
                  showCupertinoModalPopup(
                    context: context,
                    builder: (BuildContext context) {
                      return CupertinoActionSheet(
                        title: Text('提示'),
                        actions: <Widget>[
                          CupertinoActionSheetAction(
                            child: Text('English'),
                            onPressed: () {
                              AppState.setting.changeLocale(Locale('en'));
                              Navigator.pop(context);
                            },
                            isDefaultAction: true,
                          ),
                          CupertinoActionSheetAction(
                            child: Text('简体中文'),
                            onPressed: () {
                              AppState.setting.changeLocale(Locale('zh'));
                              Navigator.pop(context);
                            },
                            isDestructiveAction: true,
                          ),
                        ],
                      );
                    }
                );
                },
              )
            ],
          ),
        ),
      )
    );
  }

}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值