Flutter 如何仅在listview中使用提供程序？

我有一个列表视图，里面有一些容器，每个容器都有一个图像，另一个容器由两个按钮组成。我想在每次单击按钮时更改其图标。但是，当单击按钮时，每个容器中的每个按钮都会发生更改。如何仅更改所选按钮图标

import 'package:flutter/material.dart';
import 'package:eva_icons_flutter/eva_icons_flutter.dart';
import 'package:group_project/data/data.dart';
import 'package:group_project/models/products.dart';
import 'package:group_project/ui/size_config.dart';
import 'package:group_project/constants.dart';
import 'package:group_project/widgets/custom_button_widget.dart';
import 'package:group_project/widgets/providerexample.dart';
import 'package:provider/provider.dart';

class ProductCard extends StatefulWidget {
  final Products products;
  ProductCard({this.products});
  @override
  _ProductCardState createState() => _ProductCardState();
}

class _ProductCardState extends State<ProductCard> {
  void chatWithSeller() {}
  @override
  Widget build(BuildContext context) {
    final changeIcon = Provider.of<ProviderExample>(context);
    return Container(
//      color: Colors.red,
        height: MediaQuery.of(context).size.height,
        margin: EdgeInsets.only(right: 6.6 * SizeConfig.heightMultiplier),
        child: Column(
          children: [
            // This container contains the product image.
            Container(
              height: 210 * SizeConfig.heightMultiplier,
              width: 200 * SizeConfig.heightMultiplier,
              decoration: BoxDecoration(
                  image: DecorationImage(
                image: AssetImage(
                  widget.products.images[0],
                ),
                fit: BoxFit.cover,
//                  colorFilter: new ColorFilter.mode(Colors.blueGrey.withOpacity(1.0), BlendMode.softLight),
              )),
            ),

            //This container contains the description of the image
            Flexible(
              fit: FlexFit.tight,
              child: Container(
                height: 100 * SizeConfig.heightMultiplier,
                width: 200 * SizeConfig.heightMultiplier,
                decoration: BoxDecoration(
                  color: Colors.white,
                ),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: [
                    Expanded(
                      flex: 1,
                      child: Padding(
                        padding: EdgeInsets.only(
                            top: 5 * SizeConfig.heightMultiplier),

                        // Title and price tag of the product
                        child: Container(
//                              color: Colors.red,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Center(
                                child: Text(
                                  widget.products.isUsed == true
                                      ? '${widget.products.productName} (Used)'
                                      : '${widget.products.productName} (New)',
                                  style: productDescTextStyle,
                                ),
                              ),
                              Text(
                                'Rs. ${widget.products.price}',
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                    Expanded(
                      flex: 1,
                      //Buttons
                      child: Container(
                        padding: EdgeInsets.fromLTRB(6.6, 0, 6.6, 16.6) *
                            SizeConfig.heightMultiplier,
                        height: 53.0 * SizeConfig.widthMultiplier,
                        // color: Colors.yellow,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Expanded(
                              flex: 4,
                              child: Padding(
                                padding: EdgeInsets.symmetric(
                                    horizontal:
                                        5 * SizeConfig.heightMultiplier),
                                child: CustomButton(
                                  icon: EvaIcons.shoppingCartOutline,
                                  btnName: 'Chat with Seller',
                                  height: 26.0 * SizeConfig.heightMultiplier,
                                  width: 60 * SizeConfig.heightMultiplier,
                                  buttonColor: Colors.blue,
                                  splashColor: Colors.white,
                                  iconColor: Colors.white,
                                  textColor: Colors.white,
                                  btnTextSize: 6.0,
                                  iconSize: 14.0,
                                  mainAxisAlignment:
                                      MainAxisAlignment.spaceEvenly,
                                  btnBorderRadius: BorderRadius.circular(5.0),
                                  onTap: chatWithSeller,
                                ),
                              ),
                            ),
                            Expanded(
                              flex: 5,
                              child: Padding(
                                padding: EdgeInsets.symmetric(
                                    horizontal:
                                        5 * SizeConfig.heightMultiplier),
                                child: Consumer<ProviderExample>(
                                  builder: (context, value, child) => CustomButton(
                                    icon: changeIcon.isClicked
                                        ? EvaIcons.heart
                                        : EvaIcons.heartOutline,
                                    btnName: 'Add To Watchlist',
                                    height: 26.0 * SizeConfig.heightMultiplier,
                                    width: 80 * SizeConfig.heightMultiplier,
                                    buttonColor: Colors.white,
                                    splashColor: Colors.blue,
                                    iconColor: Colors.blue,
                                    textColor: Colors.blue,
                                    btnTextSize: 6.0,
                                    iconSize: 14.0,
                                    border: Border.all(color: Colors.blue),
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceEvenly,
                                    btnBorderRadius: BorderRadius.circular(5.0),
                                    onTap: () {
                                      if(changeIcon.isClicked) {
                                        changeIcon.isClicked = false;
                                      } else {
                                        changeIcon.isClicked = true;
                                      }
                                    },
                                  ),
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
        decoration: BoxDecoration(
          boxShadow: [
            BoxShadow(
              color: Colors.grey[400],
              spreadRadius: 0,
              offset: Offset(0, 1),
              blurRadius: 5.0,
            ),
          ],
        ),
    );
  }
}

导入“包装：颤振/材料.省道”；
导入“包装：eva_图标_flatter/eva_图标_flatter.dart”；
导入“package:group_project/data/data.dart”；
导入“包：group_项目/模型/产品.dart”；
导入“package:group_project/ui/size_config.dart”；
导入“package:group_project/constants.dart”；
导入“package:group_project/widgets/custom_button_widget.dart”；
导入“package:group_project/widgets/providerexample.dart”；
导入“包：provider/provider.dart”；
类ProductCard扩展了StatefulWidget{
最终产品；
ProductCard（{this.products}）；
@凌驾
_ProductCardState createState（）=>\u ProductCardState（）；
}
类_ProductCardState扩展了状态{
void chatWithSeller（）{}
@凌驾
小部件构建（构建上下文）{
final changeIcon=Provider.of（上下文）；
返回容器(
//颜色：颜色，红色，
高度：MediaQuery.of（context）.size.height，
边距：仅限边集（右侧：6.6*SizeConfig.高度倍增器），
子：列(
儿童：[
//此容器包含产品图像。
容器(
高度：210*SizeConfig.height乘数，
宽度：200*SizeConfig.Height乘数，
装饰：盒子装饰(
图像：装饰图像(
图片：资产评估(
widget.products.images[0]，
),
适合：BoxFit.cover，
//颜色过滤器：新的颜色过滤器。模式（颜色。蓝灰色。不透明度（1.0），混合模式。柔和光），
)),
),
//此容器包含图像的描述
灵活的(
适合：FlexFit.tight，
子：容器(
高度：100*SizeConfig.height乘数，
宽度：200*SizeConfig.Height乘数，
装饰：盒子装饰(
颜色：颜色，白色，
),
子：列(
mainAxisAlignment:mainAxisAlignment.spaceAround，
儿童：[
扩大(
弹性：1，
孩子：填充(
填充：仅限边缘设置(
顶部：5*SizeFig.高度倍增器），
//产品的名称和价格标签
子：容器(
//颜色：颜色，红色，
子：列(
mainAxisAlignment:mainAxisAlignment.center，
儿童：[
居中(
子：文本(
widget.products.isUsed==true
？“${widget.products.productName}（已使用）”
：“${widget.products.productName}（新）”，
样式：productDescTextStyle，
),
),
正文(
'Rs.${widget.products.price}'，
),
],
),
),
),
),
扩大(
弹性：1，
//钮扣
子：容器(
填充：来自LTRB（6.6,0,6.6,16.6）的边缘设置*
SizeConfig高度倍增器，
高度：53.0*SizeConfig.Width乘数，
//颜色：颜色，黄色，
孩子：排(
mainAxisAlignment:mainAxisAlignment.spaceBetween，
儿童：[
扩大(
弹性：4，
孩子：填充(
填充：EdgeInsets.symmetric(
水平：
5*SizeFig.高度倍增器），
子：自定义按钮(
图标：EvaIcons.shoppingCartOutline，
btnName:'与卖家聊天'，
高度：26.0*SizeConfig.高度倍增器，
宽度：60*SizeConfig.高度倍增器，
按钮颜色：颜色。蓝色，
颜色：颜色。白色，
iconColor:Colors.white，
textColor:Colors.white，
btnTextSize:6.0，
iconSize:14.0，
主轴对准：
MainAxisAlignment.space，
btnBorderRadius：边界半径。圆形（5.0），
onTap:Chattesseller，
),
),
),
扩大(
弹性：5，
孩子：填充(
填充：EdgeInsets.symmetric(
水平：
5*SizeFig.高度倍增器），
儿童：消费者(
建筑商：（conte）
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:group_project/models/models.dart';
import 'package:group_project/screens/product_details.dart';
import 'package:group_project/ui/size_config.dart';
import 'package:group_project/widgets/product_card.dart';

class ProductCarousel extends StatelessWidget {
  final Size size;
  final List<Products> products;
  final String category;
  final String productTypeText;
  ProductCarousel(
      {@required this.products, @required this.size, @required this.category, this.productTypeText});

  @override
  Widget build(BuildContext context) {
    // Main Container
    return Container(
      constraints: BoxConstraints(
        maxHeight: 340 * SizeConfig.heightMultiplier,
      ),
      width: size.width, // Takes total width.
       color: Colors.grey[50],
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
//              color: Colors.blue,
            height: 50,
            width: MediaQuery.of(context).size.width,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Padding(
                padding: const EdgeInsets.symmetric(horizontal: 20.0),
                child: Text(
                  productTypeText,
                  style: TextStyle(
                    fontSize: 15.0,
                    fontWeight: FontWeight.bold,
                    color: Colors.black,
                  ),
                ),
              ),
            ),
          ),
          Flexible(
            fit: FlexFit.tight,
            child: ListView.builder(
              scrollDirection: Axis.horizontal,
              itemCount: products.length,
              itemBuilder: (context, index) {
//          Checks if the products are of same category
                if (products[index].category != category) {
                  if (index < products.length) {
                    index++;
                    return Container();
                  } else {
                    return Container();
                  }
                } else {

                  //This container wraps the containers containing image and desc
                  return GestureDetector(
                    onTap: () {
                      print(Products().views);
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => ProductDetailsPage(
                            product: products[index],
                        ),
                        ),
                      );
                    },
                    child: Padding(
                      padding: const EdgeInsets.only(bottom: 10.0),
                      child: ProductCard(
                      products: products[index],
                      ),
                    ),
                  );
                }
              },
            ),
          ),
        ],
      ),
    );
  }
}