flutter 在showDialog方法中使用setState时，它不会立即更新状态

ovfsdjhp 于 2023-05-19 发布在 Flutter

关注(0)|答案(2)|浏览(267)

我有以下方法，其中包含一个Flutter对话框。此对话框用作过滤器菜单。
代码如下：

Future<void> _showFilterDialog() async {
    await showDialog<void>(
        context: context,
        builder: (BuildContext context) {
          return SimpleDialog( // <-- SEE HERE
              title: const Text('Sort  and filter the History'),
              children: [
                Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children:  [
                        const Text("Sort By : ",style: TextStyle(fontSize: 20,fontFamily: 'EastMan',fontWeight: FontWeight.bold),),
                        InkWell(
                          onTap: (){
                              if(sortOptionOneColor==Colors.white54){
                                sortOptionOneSelected = true;
                                setState(() {
                                  sortOptionOneColor = Colors.greenAccent;
                                });

                              }
                              else{
                                sortOptionOneSelected = false;
                                setState(() {
                                  sortOptionOneColor = Colors.white54;
                                });
                              }
                          },
                          child: FilterOptionMaterial(color: sortOptionOneColor, txt: 'By Date',),
                        ),
                        const SizedBox(
                          width: 10,
                        ),
                        InkWell(
                          onTap: (){
                              if(sortOptionTwoColor==Colors.white54){
                                sortOptionTwoSelected = true;
                                setState(() {
                                  sortOptionTwoColor = Colors.greenAccent;
                                });

                              }
                              else{
                                sortOptionTwoSelected = false;
                                setState(() {
                                  sortOptionTwoColor = Colors.white54;
                                });
                              }
                          },
                          child: FilterOptionMaterial(color: sortOptionTwoColor, txt: 'By Alphabet',),
                        ),
                      ],
                    ),
                    const SizedBox(
                      width: 50,
                      height: 20,
                      child: Divider(
                        thickness: 3,
                        color: Colors.black54,
                      ),
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.end,
                      children: [
                        SimpleDialogOption(
                          child: const Text('Apply'),
                          onPressed: () async {
                          },
                        ),
                        SimpleDialogOption(
                          child: const Text('No'),
                          onPressed: (){
                            Navigator.pop(context);
                          },
                        ),
                      ],
                    ),
                  ],
                )
              ]
          );
        });
  }

现在的问题是，颜色不会立即改变屏幕上。相反，我需要关闭对话框并重新打开它，以便查看结果。有人能帮助解决这个问题或提供替代解决方案吗？

flutter

来源：https://stackoverflow.com/questions/76239039/setstate-does-not-update-state-immediately-when-using-it-in-a-showdialog-method

2条答案

按热度按时间

wgmfuz8q1#

SimpleDialog是StatelessWidget，StatelessWidget无法更改其状态。
创建StatefulWidget并从构建器返回。在此之后，状态的变化将起作用。

赞(0）回复(0）举报 2023-05-19

vcirk6k62#

根据您的情况，对话框已经构建，因此setState将永远无法重新构建它，
所以，这里是使用StatefulBuilder的替代方案，此小部件允许您强制重建对话框。请检查下面的代码：

Future<void> _showFilterDialog() async {
  await showDialog<void>(
    context: context,
    builder: (BuildContext context) {
      bool sortOptionOneSelected = false;
      bool sortOptionTwoSelected = false;
      Color sortOptionOneColor = Colors.white54;
      Color sortOptionTwoColor = Colors.white54;
      return StatefulBuilder( ///**StatefulBuilder**
        builder: (context, setState) {
          return SimpleDialog(
            title: const Text('Sort and filter the History'),
            children: [
              Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      const Text(
                        "Sort By : ",
                        style: TextStyle(
                          fontSize: 20,
                          fontFamily: 'EastMan',
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      InkWell(
                        onTap: () {
                          if (sortOptionOneColor == Colors.white54) {
                            sortOptionOneSelected = true;
                            setState(() {
                              sortOptionOneColor = Colors.greenAccent;
                            });
                          } else {
                            sortOptionOneSelected = false;
                            setState(() {
                              sortOptionOneColor = Colors.white54;
                            });
                          }
                        },
                        child: FilterOptionMaterial(
                          color: sortOptionOneColor,
                          txt: 'By Date',
                        ),
                      ),
                      const SizedBox(
                        width: 10,
                      ),
                      InkWell(
                        onTap: () {
                          if (sortOptionTwoColor == Colors.white54) {
                            sortOptionTwoSelected = true;
                            setState(() {
                              sortOptionTwoColor = Colors.greenAccent;
                            });
                          } else {
                            sortOptionTwoSelected = false;
                            setState(() {
                              sortOptionTwoColor = Colors.white54;
                            });
                          }
                        },
                        child: FilterOptionMaterial(
                          color: sortOptionTwoColor,
                          txt: 'By Alphabet',
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(
                    width: 50,
                    height: 20,
                    child: Divider(
                      thickness: 3,
                      color: Colors.black54,
                    ),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: [
                      SimpleDialogOption(
                        child: const Text('Apply'),
                        onPressed: () async {},
                      ),
                      SimpleDialogOption(
                        child: const Text('No'),
                        onPressed: () {
                          Navigator.pop(context);
                        },
                      ),
                    ],
                  ),
                ],
              )
            ],
          );
        },
      );
    },
  );
}

赞(0）回复(0）举报 2023-05-19

我来回答

flutter 在showDialog方法中使用setState时，它不会立即更新状态

2条答案

相关问题

热门标签

最新问答