当我滚动时列表的图标状态恢复

Question

我正在屏幕上呈现从 api 中获取的列表。我为列表中的每个项目都有一个保存按钮，该按钮会在单击时发生变化。它工作正常但是当我滚动列表时它会恢复。我认为这是因为列表构建器一次又一次地构建列表，但我想不出解决方案来修复用户单击时的图标状态。这是代码的一部分：

....
class NewsListBuilderItemsState extends State<NewsListBuilderItems> {
  final _repository = Repository();
  bool selected = false;
...

这是按钮：

                  GestureDetector(
                    child: Icon(selected
                        ? Icons.bookmark
                        : Icons.bookmark_border_outlined),
                    onTap: () {
                      setState(() {
                        selected = !selected;
                        _repository.addToDb(
                            widget.snapshot.data[widget.index]);

                        bloc.addToSavedNews(
                            widget.snapshot, widget.index);
                      });
                    },
                  )

Answer 1

问题是，您只在项目级别处理“已选择”状态。因此，如果该项目离开可见区域，它会自行销毁，如果您向后滚动，它会以初始状态重新创建自己。您需要从项目上方传递选定的信息。最有可能在您映射所有新闻的地方。您应该从那里的 db (bloc) 中获取选定的值，并将其作为参数传递给新闻项目。

Answer 2

你有多个列表项，很明显你不能只用一个变量来管理状态。您需要制作一个布尔值列表，列表的长度应等于列表的长度。然后在 setState 中，您应该更改该项目索引处的布尔值。

....
   class NewsListBuilderItemsState extends State<NewsListBuilderItems> {
   final _repository = Repository();
   List<bool> selected = [];
...

注：-

GestureDetector(
                child: Icon(selected[index]

                    ? Icons.bookmark
                    : Icons.bookmark_border_outlined),
                onTap: () {
                  setState(() {
                    selected[index] = !selected[index];
                    _repository.addToDb(
                        widget.snapshot.data[widget.index]);

                    bloc.addToSavedNews(
                        widget.snapshot, widget.index);
                  });
                },
              )

当我滚动时列表的图标状态恢复

List's icon state reverts when I scroll

android

listview

setstate

dart

flutter