Flutter 一键切换语言:使用 Intl 插件实现多语言支持
使用 Intl 插件可以轻松实现 Flutter 应用的多语言支持,可以通过设置 Locale 来更改应用的语言。
以下是一键更改语言的步骤:
- 在
pubspec.yaml文件中添加 Intl 插件依赖:
dependencies:
flutter:
sdk: flutter
intl: ^0.17.0
- 在
main.dart文件中导入 Intl 库:
import 'package:intl/intl.dart';
- 创建一个全局变量来存储当前的 Locale:
Locale _locale;
- 在应用程序的根部 Widget 中添加一个方法来更改 Locale:
void _changeLanguage(Locale locale) {
setState(() {
_locale = locale;
});
}
- 在应用程序的根部 Widget 中添加一个方法来获取应用程序的当前 Locale:
Locale _getCurrentLocale() {
return _locale ?? window.locale;
}
- 在根部 Widget 的
build方法中使用 Intl 库来获取本地化字符串:
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
locale: _getCurrentLocale(),
localizationsDelegates: [
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate,
AppLocalizations.delegate,
],
supportedLocales: [
const Locale('en', 'US'),
const Locale('zh', 'CN'),
],
home: MyHomePage(
title: 'Flutter Demo Home Page',
onLanguageChange: _changeLanguage,
),
);
}
- 在
MyHomePage中添加一个DropdownButton用于选择语言:
DropdownButton<Locale>(
value: _getCurrentLocale(),
onChanged: (locale) {
widget.onLanguageChange(locale);
},
items: [
DropdownMenuItem(
value: const Locale('en', 'US'),
child: Text('English'),
),
DropdownMenuItem(
value: const Locale('zh', 'CN'),
child: Text('中文'),
),
],
),
这样就可以实现一键更改 Flutter 应用的语言了。当用户选择一个新的语言时,应用程序的 Locale 会更改,并且所有的本地化字符串都会自动更新为新的语言。
原文地址: https://www.cveoy.top/t/topic/ngXe 著作权归作者所有。请勿转载和采集!