如何在颤动中循环图标？

Question

我有数据列表，我想声明每个列表都有一个图标...每当用户单击该图标时..该图标将变为另一个图标..这是代码

ListView.builder(
              itemCount: data.length,
              itemBuilder: (context, index) {
                return Column(
                  children: <Widget>[
                    ListTile(
                      leading: InkWell(
                        onTap: () {
                          setState((){
                             match=true;
                           });
                        },
                        child: 
                         match
                             ? Icons.check
                             : Icons.error
                      ),
                      title: Text(data[index],),
                      subtitle: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            children: [
                              Text("subs here.."),
                            ],
                          ),
                        ],
                      ),
                    ),
                  ],
                );
              }),

从该代码..在用户单击第一个图标后...列表视图生成器中的所有图标都已更改..有没有办法只更改我单击的图标（不是所有图标）的图标？

Answer 1

您可以维护您为匹配变量所做的选定列表小部件的索引

                     setState((){
                             match=true;
                             _index = index;
                             });

然后添加条件如

           match && _index == index
                     ? Icons.check
                     : Icons.error
              ),

Answer 2

在其自己的有状态小部件中将列表项分开，以便每个列表项都可以保持自己的状态。

class ListItem extends StatefulWidget {
  @override
  _ListItemState createState() => _ListItemState();
}

class _ListItemState extends State<ListItem> {
  bool match = false;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      leading: InkWell(
          onTap: () {
            setState(() {
              match = true;
            });
          },
          child: Icon(match ? Icons.check : Icons.error)),
      title: Text(
        "asd",
      ),
      subtitle: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Text("subs here.."),
            ],
          ),
        ],
      ),
    );
  }
}

将小部件添加到 ListView

itemBuilder: (context, index) {
              return ListItem();
            }

如何在颤动中循环图标？

How to loop icons in flutter?

icons

loops

widget

flutter