在flutter中使用getX打开页面时自动调整页面语言

Posted 2023-03-07

【中文标题】在flutter中使用getX打开页面时自动调整页面语言

【英文标题】：Automatically adjust the language of the page when you open it using getX in flutter

【发布时间】：2021-10-28 12:13:29

【问题描述】：

当你在flutter中使用getX打开页面时自动调整页面的语言，我想在一个页面上选择语言，当我选择它时，我会移动到另一个页面并使用我选择的语言

Container(
                margin: const EdgeInsets.only(top: 20.0),
                padding: const EdgeInsets.only(left: 20.0, right: 20.0),
                child: new Row(
                  children: <Widget>[
                    new Expanded(
                      child: FlatButton(
                        shape: new RoundedRectangleBorder(
                            borderRadius: new BorderRadius.circular(30.0)),
                        splashColor: this.primaryColor,
                        color: this.primaryColor,
                        child: new Row(
                          children: <Widget>[
                            new Padding(
                              padding: const EdgeInsets.only(left: 20.0),
                              child: Text(
                                "English",
                                style: TextStyle(color: Colors.white),
                              ),
                            ),
                            new Expanded(
                              child: Container(),
                            ),
                            new Transform.translate(
                              offset: Offset(15.0, 0.0),
                              child: new Container(
                                padding: const EdgeInsets.all(5.0),
                                child: FlatButton(
                                  shape: new RoundedRectangleBorder(
                                      borderRadius:
                                          new BorderRadius.circular(28.0)),
                                  splashColor: Colors.white,
                                  color: Colors.white,
                                  child: Icon(
                                    Icons.arrow_forward,
                                    color: this.primaryColor,
                                  ),
                                  onPressed: () 
                                    box.write('lang', 'en_US');
                                    Get.to(() => LoginScreen1());
                                  ,
                                ),
                              ),
                            )
                          ],
                        ),
                        onPressed: () 
                          box.write('lang', 'en_US');
                          Get.to(() => LoginScreen1());
                        ,
                      ),
                    ),
                  ],
                ),
              ),

第二页

Padding(
                  padding: const EdgeInsets.only(left: 40.0),
                  child: Text(
                    'serverAddress'.tr,
                    style: TextStyle(color: Colors.grey, fontSize: 16.0),
                  ),
                ),

还有更多

【参考方案1】：

在onPressed函数中，我们可以相应地使用Get.updateLocale函数：

onPressed: () 
  box.write('lang', 'en_US');
  Locale locale = Locale('en','en_US');
  Get.updateLocale(locale);
  Get.to(() => LoginScreen1());

【参考方案2】：

GetX 提供更改语言环境的功能

Get.updateLocale(locale);

您需要通过区域设置来更改语言。例如：

var locale = Locale('hi','IN');
Get.updateLocale(locale);

【讨论】：

我知道但不知道放在哪里

就在Get.to(() => LoginScreen1());之前

【参考方案3】：

我们有很多解决方案... 您阅读了有关颤振国际化的文档吗？ https://flutter.dev/docs/development/accessibility-and-localization/internationalization

此链接显示了解决您的问题的好方法。 但我用另一种方法使用 getx...

我有一个包含所有字符串本地化的类（en、es、pt ...），在我的 Main.dart 中，我有一个 getx obs 来监听本地化的所有变化。

见：

Main.dart：

class MyApp extends StatelessWidget 
  
  const MyApp(Key key) : super(key: key);

  @override
  Widget build(BuildContext context)
   
    return GetX<AppController>(
      builder: (_) =>(
        _buildWithTheme(context,_)
      )
    );
    
  

  Widget _buildWithTheme(BuildContext context, AppController state) 

    return  MaterialApp(
      title: 'App Title',
      theme:  makeAppTheme(),           
      debugShowCheckedModeBanner: false,
      initialRoute: '/',
      locale: setLocale(state),      
      navigatorKey: GeneralUtils.globalCtx,
      routes: 
          '/': (context) => const Page1(),
          '/page2': (context) => const Page2(),
      ,

    );
  

  Locale setLocale(AppController state)

    switch (state.pdvLocale) 
      
      case 'en':
        return const Locale('en','US');
      case 'es':
        return const Locale('es','');
      case 'pt':       
      default:
        return const Locale('pt','BR');
    

  

Page1.dart：

Text(AppLocalization.hello)

AppLocalization.dart

class AppLocalizations

  static String hellow;

  static setStringsLocation(String localization)

    switch (localization) 
      case 'en':
        hello = 'hello';
        break;
      case 'es':   
        hello = 'hola';
        break;
      case 'pt':
      default:
        hello = 'ola';
    
   

AppController.dart

Future<void> setLocale(String value) async
    pdvLocale = value;
    await StoreData.instance.saveString('pdv_locale',value); 
    await AppLocalizations.setStringsLocation(pdvLocale);

    update();

这个解决方法对我使用 getx 非常有效。