【问题标题】:Flutter - How to change child widgets languageFlutter - 如何更改子小部件语言
【发布时间】:2020-02-24 01:38:00
【问题描述】:

我想在不重新加载应用的情况下更改所有应用语言。我用flutter_i18n

我在正文中的appBarAppHomeScreen 上有一个切换语言按钮,这是MyHomePage 类中的build 函数:

  addClickFn(model) {
    FocusScope.of(context).requestFocus(FocusNode());
    Navigator.push<dynamic>(
      context,
      MaterialPageRoute<dynamic>(
          builder: (BuildContext context) => MyPopupScreen(callback: (c, id) => { }),
          fullscreenDialog: true),
    );
  }

  @override
  Widget build(BuildContext context) {
    return ScopedModelDescendant<ResponseDataModel>(
        builder: (context, _, model) => Scaffold(
              backgroundColor: AppTheme.white,
              body: FutureBuilder<bool>(
                future: getData(),
                builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
                  if (!snapshot.hasData) {
                    return const SizedBox();
                  } else {
                    return Padding(
                      padding: EdgeInsets.only(
                          top: MediaQuery.of(context).padding.top),
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          appBar(),
                          Expanded(
                            child: FutureBuilder<bool>(
                              future: getData(),
                              builder: (BuildContext context,
                                  AsyncSnapshot<bool> snapshot) {
                                if (!snapshot.hasData) {
                                  return const SizedBox();
                                } else {
                                  return AppHomeScreen(
                                      addClickFn: () => addClickFn(model));
                                }
                              },
                            ),
                          ),
                        ],
                      ),
                    );
                  }
                },
              ),
            ));
  }

appBar带onTap开关按钮功能:

  Widget appBar() {
    return SizedBox(
      height: AppBar().preferredSize.height,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.only(top: 8, left: 8),
            child: Container(
              width: AppBar().preferredSize.height - 8,
              height: AppBar().preferredSize.height - 8,
            ),
          ),
          Expanded(
            child: Center(
              child: Padding(
                padding: const EdgeInsets.only(top: 4),
                child: Text(
                  FlutterI18n.translate(context, "title"),
                  style: TextStyle(
                    fontSize: 22,
                    color: AppTheme.darkText,
                    fontWeight: FontWeight.w700,
                  ),
                ),
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(top: 8, right: 8),
            child: Container(
              width: AppBar().preferredSize.height - 8,
              height: AppBar().preferredSize.height - 8,
              color: Colors.white,
              child: Material(
                color: Colors.transparent,
                child: InkWell(
                  borderRadius:
                      BorderRadius.circular(AppBar().preferredSize.height),
                  child: Image.asset(
                      'icons/flags/png/' + currentLang.languageCode + '.png',
                      package: 'country_icons'),
                  onTap: () async {
                    setState(() {
                      currentLang = currentLang.languageCode == 'vn'
                          ? new Locale('gb')
                          : new Locale('vn');
                    });
                    await FlutterI18n.refresh(context, currentLang);
                  },
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

AppHomePage 中,我将BottomBarViewDashboardScreen 包含在标签正文中

  @override
  Widget build(BuildContext context) {
    return Container(
      color: AppTheme.background,
      child: Scaffold(
        backgroundColor: Colors.transparent,
        body: FutureBuilder<bool>(
          future: getData(),
          builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
            if (!snapshot.hasData) {
              return const SizedBox();
            } else {
              return Stack(
                children: <Widget>[
                  tabBody,
                  bottomBar(),
                ],
              );
            }
          },
        ),
      ),
    );
  }

  Future<bool> getData() async {
    await Future<dynamic>.delayed(const Duration(milliseconds: 200));
    return true;
  }

  Widget bottomBar() {
    return Column(
      children: <Widget>[
        const Expanded(
          child: SizedBox(),
        ),
        BottomBarView(
          tabIconsList: tabIconsList,
          addClick: () {
            if (widget.addClickFn != null) widget.addClickFn();
          },
          changeIndex: (int index) {
            if (index == 0) {
              animationController.reverse().then<dynamic>((data) {
                if (!mounted) {
                  return;
                }
                setState(() {
                  tabBody =
                      DashboardScreen(animationController: animationController);
                });
              });
            }
          },
        ),
      ],
    );
  }

DashboardScreen我显示一个标签:

  @override
  Widget build(BuildContext context) {
    return Container(
      color: AppTheme.background,
      child: Scaffold(
        backgroundColor: Colors.transparent,
        body: Stack(
          children: <Widget>[
            getMainListViewUI(),
            // getAppBarUI(),
            SizedBox(
              height: MediaQuery.of(context).padding.bottom,
            )
          ],
        ),
      ),
    );
  }

  Widget getMainListViewUI() {
    return ListView(
      scrollDirection: Axis.vertical,
      semanticChildCount: 10,
      children: <Widget>[
        Container(
            padding:
                EdgeInsets.only(top: 0.0, left: 24, right: 24, bottom: 24.0),
            child: Text(FlutterI18n.translate(context, "label.welcome"),
                textAlign: TextAlign.left,
                style: TextStyle(
                  fontFamily: AppTheme.fontName,
                  fontWeight: FontWeight.w700,
                  fontSize: 30 + 6 - 6 * topBarOpacity,
                  letterSpacing: 1.2,
                  color: AppTheme.darkerText,
                ))),
      ],
    );
  }

当我单击切换语言按钮时,当前上下文(标题)中的所有文本都翻译得很好,但DashboardScreen(label.welcome)中的所有文本都没有。

当我点击bottomBar上的添加按钮重定向到MyPopupScreen然后关闭此弹出窗口时,DashboardScreen中的文本已被翻译。

当点击MyHomePage 上的切换语言按钮时,如何更改DashboardScreen 中的所有文本?

对不起,我的英语不好!!!

【问题讨论】:

标签: flutter dart locale


【解决方案1】:

您使用旧的currentLang 值调用FlutterI18n.refresh

试试这个:

                    setState(() {
                      currentLang = currentLang.languageCode == 'vn'
                          ? new Locale('gb')
                          : new Locale('vn');

                      FlutterI18n.refresh(context, currentLang);
                    });

【讨论】:

    猜你喜欢
    • 2019-07-02
    • 2022-01-17
    • 1970-01-01
    • 2019-09-06
    • 1970-01-01
    • 2019-09-26
    • 2018-11-01
    • 2022-06-30
    • 2021-03-26
    相关资源
    最近更新 更多