Flutter-轮播滑块只显示一张图片

问题描述 投票:0回答:0

gridview.builder 有 FutureBuilder 并从 API 获取所有必要的项目并发送到另一个页面。

我想在点击图像时显示弹出窗口,它显示特定图像并运行幻灯片。

Slider 可以工作,但它多次显示单个图像。这里有什么问题?

刷新指示器( onRefresh: fetchNewAddListModel, 孩子:FutureBuilder( 未来:futureNewAddListModel, 构建器:(上下文,快照){

                if (snapshot.hasData) {
                  snapshot.data!.data.forEach((e) {
                    imagesList.add(e.thumb);
                    print(imagesList.length);
                  });
                  return
                    GridView.builder(
                      //itemCount: image.length,
                      itemCount: snapshot.data!.data.length,
                      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                        crossAxisCount: 2,
                        crossAxisSpacing: 3.w,
                        childAspectRatio: 1.02,
                      ),
                      itemBuilder: (BuildContext context, int index) {
                        return GestureDetector(
                          onTap: () {
                            showModalBottomSheet(
                              backgroundColor: Colors.white,
                              isScrollControlled: true,
                              context: context,
                              builder: (BuildContext context) {
                                return SizedBox(
                                  height: 200.h,
                                  child: Column(
                                    crossAxisAlignment: CrossAxisAlignment
                                        .start,
                                    mainAxisSize: MainAxisSize.min,
                                    children: <Widget>[
                                      SizedBox(height: 5.h,),
                                      TextButton(
                                        onPressed: (){
                                          showDialog(
                                              context: context,
                                              builder: (
                                                  BuildContext context) {
                                                return Center(
                                                  child: Material(
                                                      type: MaterialType.transparency,
                                                      child: CarouselSlider.builder(
                                                      options: CarouselOptions(
                                                        autoPlay: false,
                                                        enlargeCenterPage: true,
                                                        viewportFraction: 0.9,
                                                        aspectRatio: 2.0,
                                                        initialPage: 2,
                                                        onPageChanged: (index, reason) {
                                                          _currentIndex = index;
                                                          setState((){});
                                                        },
                                                      ),
                                                      itemCount: snapshot.data!.data.length,

                                                      itemBuilder: (BuildContext context, int itemIndex, int pageViewIndex) =>
                                                          ClipRRect(
                                                            borderRadius: BorderRadius.circular(5.r),
                                                            child: Image.network(snapshot.data!.data[index].thumb.toString(), fit: BoxFit.cover,
                                                              height: 300.h,
                                                              width: MediaQuery.of(context).size.width * 0.9.w,),
                                                          )
                                                    ),
                                                  ),
                                                );
                                              });
                                        },
                                        child: Row(
                                          children: [
                                            Icon(
                                              Icons.open_in_new, size: 30.r,
                                              color: kblack,),
                                            SizedBox(width: 10.w,),
                                            Text('Open', style: TextStyle(
                                                fontSize: 20.sp,
                                                color: kblack),),
                                          ],
                                        ),
                                      ),
                                      Divider(height: 5.h,
                                        color: Colors.black45,),
                                      TextButton(
                                        onPressed: () {
                                          showDialog(
                                              context: context,
                                              builder: (
                                                  BuildContext context) {
                                                return Center(
                                                  child: Material(
                                                    type: MaterialType
                                                        .transparency,
                                                    child: Container(
                                                        decoration: BoxDecoration(
                                                          borderRadius: BorderRadius
                                                              .circular(10),
                                                          color: Colors
                                                              .white,
                                                        ),
                                                        //padding: EdgeInsets.all(15),
                                                        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: ClipRRect(
                                                          borderRadius: BorderRadius
                                                              .circular(
                                                              5.r),
                                                          child: Image
                                                              .network(
                                                            snapshot.data!
                                                                .data[index]
                                                                .thumb
                                                                .toString(),
                                                            fit: BoxFit
                                                                .cover,),
                                                        )
                                                    ),
                                                  ),
                                                );
                                              });
                                        },
                                        child: Row(
                                          children: [
                                            Icon(Icons.share, size: 30.r,
                                              color: kblack,),
                                            SizedBox(width: 10.w,),
                                            Text('Share', style: TextStyle(
                                                fontSize: 20.sp,
                                                color: kblack),),
                                          ],
                                        ),
                                      ),
                                      Divider(height: 5.h,
                                        color: Colors.black45,),
                                      TextButton(
                                        onPressed: () {
                                          showDialog(
                                              context: context,
                                              builder: (
                                                  BuildContext context) {
                                                return Center(
                                                  child: Material(
                                                    type: MaterialType
                                                        .transparency,
                                                    child: Container(
                                                        decoration: BoxDecoration(
                                                          borderRadius: BorderRadius
                                                              .circular(10),
                                                          color: Colors
                                                              .white,
                                                        ),
                                                        //padding: EdgeInsets.all(15),
                                                        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: ClipRRect(
                                                          borderRadius: BorderRadius
                                                              .circular(
                                                              5.r),
                                                          child: Image
                                                              .network(
                                                            snapshot.data!
                                                                .data[index]
                                                                .thumb
                                                                .toString(),
                                                            fit: BoxFit
                                                                .cover,),
                                                        )
                                                    ),
                                                  ),
                                                );
                                              });
                                        },
                                        child: Row(
                                          children: [
                                            Icon(Icons.favorite_border,
                                              size: 30.r, color: kblack,),
                                            SizedBox(width: 10.w,),
                                            Text('Add To Menu',
                                              style: TextStyle(
                                                  fontSize: 20.sp,
                                                  color: kblack),),
                                          ],
                                        ),
                                      ),
                                    ],
                                  ),
                                );
                              },
                            );
                          },
                          child: Column(
                              crossAxisAlignment: CrossAxisAlignment
                                  .stretch,
                              children: <Widget>[
                          Container(
                          child: Card(
                              clipBehavior: Clip.antiAlias,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(
                                    10.r),
                              ),
                              child: ClipRRect(
                                borderRadius: BorderRadius.circular(
                                    10.r),
                                /child: Image.asset(image[index], fit: BoxFit.cover,),/
                              child: Image.network(
                              snapshot.data!.data[index].thumb
                              .toString(),
                          fit: BoxFit.cover,),
                        ),
                        )),
                        Container(
                        padding: EdgeInsets.all(5.r),
                        /child: Center(child: Text(snapshot.data!.data[index].employeeName, style: TextStyle(color: kblue, fontSize: 18.sp, fontWeight: FontWeight.w400),)),/
                        child: Center(
                        child: Text(
                        snapshot.data!.data[index].prodName,
                        style: TextStyle(color: kblue,
                        fontSize: 18.sp,
                        fontWeight: FontWeight.w400),),
                        )
                        )
                        ]),
                        );
                      },
                    );
                } else if (snapshot.hasError) {
                  return Text('${snapshot.error}');
                }

                // By default, show a loading spinner.
                return const Center(
                  child: SizedBox(
                    height: 50.0,
                    width: 50.0,
                    child: CircularProgressIndicator(),
                  ),
                );
              },
            ),
          ),
flutter api dart carousel snapshot
© www.soinside.com 2019 - 2024. All rights reserved.