Gridview的图片轮播-Flutter

Question

我有产品的GridView-

当我点击图像时，它应该打开带有图像索引的滑块，但它从第一张图像开始滑块。

这是我的 Gridview 生成器代码：

GridView.builder(
                          itemCount: snapshot.data!.data.length,
                          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 2,
                            crossAxisSpacing: 3.w,
                            childAspectRatio: 1.09,
                          ),
                          itemBuilder: (BuildContext context, int index) {
                            return GestureDetector(
                              onTap: (){
                                showDialog(
                                    context: context,
                                    builder: (
                                        BuildContext context) {
                                      return Center(
                                        child: Material(
                                          type: MaterialType.transparency,
                                          child: Container(
                                              decoration: BoxDecoration(
                                                borderRadius: BorderRadius.circular(10),
                                                color: Colors.white,
                                              ),
                                              height: 300.h,
                                              width: MediaQuery.of(context).size.width * 0.9.w,
                                              child: ListView.builder(
                                                  scrollDirection: Axis.horizontal,
                                                  itemBuilder: (BuildContext context, int index) {
                                                    return ClipRRect(
                                                      borderRadius: BorderRadius.circular(5.r),
                                                      child: Image.network(snapshot.data!.data[index].thumb.toString(), fit: BoxFit.cover,),
                                                    );
                                                  },
                                                ),
                                          ),
                                        ),
                                      );
                                    });
                              },
                              child: Column(
                                  crossAxisAlignment: CrossAxisAlignment
                                      .stretch,
                                  children: <Widget>[
                                    Container(
                                      height: 135.h,
                                      decoration: BoxDecoration(
                                        borderRadius: BorderRadius.circular(10.r),
                                        image: DecorationImage(
                                            image: NetworkImage(
                                                snapshot.data!.data[index].thumb.toString()
                                            ),
                                            fit: BoxFit.cover
                                        ),
                                      ),
                                    ),
                                    Text(
                                      snapshot.data!.data[index].prodName,
                                      style: TextStyle(color: kblue,
                                          fontSize: 15.sp,
                                          fontWeight: FontWeight.w400),),
                                  ]),
                            );
                          },
                        );

我做错了什么吗？我尝试使用轮播，但它显示相同的图像。

Answer 1

ListViews 总是从第一个索引开始，但是，您可以使用 this 包从特定索引开始。另一种方法是使用 PageView 而不是 ListView 作为图像轮播，然后您可以使用 PageController 移动到特定索引。

注意：您有来自两个 ListView 的索引变量，重命名任何人以避免混淆。