setState方法不会刷新我的flutter应用程序中的所有页面

时间:2019-10-23 18:53:05

标签: android ios flutter dart

在我的flutter应用程序中,我有一个带有4个标签的“ TabBar” ...当我切换标签时,它会打开另一个页面,如您在我的代码中所见:

    Widget _selectedContent(){
    switch(_selectedItems){
      case 0:
        setState(() {});
        return _buildCategory();
        break;
      case 1:
        setState(() {});
        return _buildLanguage();
        break;
      case 2:
        setState(() {});
        return _buildContact();
        break;
      case 3:
        setState(() {});
        return _buildThemeColor();
        break;
    }
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: Text(allTranslations.text('SettingsPageTitle')),
        centerTitle: true,
        backgroundColor: GeneralVariables.appBarColor,
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.help_outline),
            onPressed: () => Navigator.push(context, new MaterialPageRoute(builder: (BuildContext context) => new RulesExplanation())),
            iconSize: 30.0,
          ),
        ],
      ),
      body: Container(
        child: _selectedContent(),
      ),
      bottomNavigationBar: Container(
        padding: EdgeInsets.only(bottom: 5),
        color: GeneralVariables.appBarColor,
        child: TabBar(
          indicatorColor: Colors.red,
          controller: tabBarController,
          onTap: (int index) => setState(() {_selectedItems = index;}),
          tabs: <Widget>[
            Tab(
              icon: Icon(Icons.check_circle_outline),
              text: allTranslations.text('SettingsPageTab1Title'),
            ),
            Tab(
              icon: Icon(Icons.language),
              text: allTranslations.text('SettingsPageTab2Title'),
            ),
            Tab(
              icon: Icon(Icons.mail_outline),
              text: allTranslations.text('SettingsPageTab3Title'),
            ),
            Tab(
              icon: Icon(Icons.color_lens),
              text: "Thèmes",
            )
          ],
        ),
      ),
      backgroundColor: GeneralVariables.mainColor,
    );
  }

  Widget _buildCategory(){
    return CategoryPage();
  }

  Widget _buildContact(){
    return ContactPage();
  }

  Widget _buildLanguage(){
    return LanguagePage();
  }

  Widget _buildThemeColor(){
    return ThemeColorPage();
  }

如您所见,当我打开“语言”标签时,它会打开此页面:

class _LanguagePageState extends State<LanguagePage>{
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 20),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Container(padding: EdgeInsets.only(top: 5),),
          Text(allTranslations.text('LanguagePageLanguageTitle'), style: TextStyle(color: Colors.white, fontSize: 25.0,),),
          Container(padding: EdgeInsets.all(10.0),),
          _langButton("LanguagePageFrench", "France.png", "fr", false),
          Container(padding: EdgeInsets.all(20.0),),
          _langButton("LanguagePageEnglish", "United-Kingdom.png", "en", true),
          Expanded(child: Container(),),
          Row(
            children: <Widget>[
              Text(allTranslations.text('LanguagePageNotifInfo'), style: TextStyle(color: Colors.white, fontSize: 13.0),),
              Expanded(child: Container(),),
              new OutlineButton(
                child: new Text(allTranslations.text('LanguagePageDialog3'), style: TextStyle(color: Colors.white, fontSize: 13,),),
                shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(20.0)),
                onPressed: () {
                  _showDialog(allTranslations.text('LanguagePageDialog1'),
                      allTranslations.text('LanguagePageDialog2'),
                      allTranslations.text('LanguagePageDialog3'),
                      allTranslations.text('LanguagePageDialog4'));
                },
              ),
            ],
          ),
        ],
      ),
    );
  }

  InkWell _langButton(String titre, String imageName, String langCode, bool experimental){

    return InkWell(
      onTap: () async {
        await allTranslations.setNewLanguage(langCode);
        allTranslations.setPreferredLanguage(langCode);
        setState((){
          if(langCode == 'fr'){
            LandingPageState.firebaseMessaging.subscribeToTopic(GeneralVariables.topicFr);
            LandingPageState.firebaseMessaging.unsubscribeFromTopic(GeneralVariables.topicEn);
            print("Subscribed to french subject");

            LandingPageState.firebaseMessaging.subscribeToTopic(GeneralVariables.topicFr_1_3_1);
            LandingPageState.firebaseMessaging.unsubscribeFromTopic(GeneralVariables.topicEn_1_3_1);
          }
          else if (langCode == 'en'){
            LandingPageState.firebaseMessaging.subscribeToTopic(GeneralVariables.topicEn);
            LandingPageState.firebaseMessaging.unsubscribeFromTopic(GeneralVariables.topicFr);
            print("Subscribed to english subject");

            LandingPageState.firebaseMessaging.subscribeToTopic(GeneralVariables.topicEn_1_3_1);
            LandingPageState.firebaseMessaging.unsubscribeFromTopic(GeneralVariables.topicFr_1_3_1);
          }
        });
      },
      child: Row(
        children: <Widget>[
          Image(
            image: AssetImage('images/flags/$imageName'),
          ),
          Container(
            padding: EdgeInsets.symmetric(horizontal: 10.0),
          ),
          Text(allTranslations.text(titre),
            style: TextStyle(fontSize: 25.0, color: Colors.white, fontWeight: FontWeight.bold),),
          Expanded(
            child: Container(),
          ),
          _experimentalInfo(experimental)
        ],
      ),
    );
  }
}

没有完整的课程……

但是当我更改语言时,它会在所选页面(语言页面)上发生变化,但是在有TabBar的页面上却没有变化...我想知道是否存在一个setState方法来调用“外部”类的setState方法(选项卡栏之一)。超级会...

Gif

1 个答案:

答案 0 :(得分:0)

您可以使用回调函数在两个小部件之间进行通信。

在子级中声明一个类似下面的final,在这种情况下,我假设它是LanguagePage。

final void Function(String langCode) langChanged;

在InkWell的onTap事件中,调用此函数。

widget.langChanged(langCode);

在父级,创建子级时,传递函数。

LanguagePage(langChanged:(langCode){
  setState(){}
});