Question

我一直在试图找到一种方法来向轮播（carousel_pro）中的图像添加Dismissible或Gesturedetector，因此用户可以滑动或按一下以删除给定的图像，但是没有成功！希望对实现此目标有任何提示或想法。

AspectRatio(
  aspectRatio: 0.9,
  child: Carousel(
    images: aData.images.map((url) {
      return GestureDetector(
        child: CachedNetworkImageProvider(url),
        onTap: () {});
    }).toList(),
    dotSize: 4.0,
    dotSpacing: 15.0,
    dotBgColor: Colors.transparent,
    dotColor: Colors.red,
    autoplay: false,
  ),
),

这将引发错误：无法将参数类型'CachedNetworkImageProvider'分配给参数类型'Widget'。

Answer 1

这是在Flutter中使用CahedImage的方法

CachedNetworkImage(
        placeholder: CircularProgressIndicator(),
        imageUrl:
            'https://picsum.photos/250?image=9',
      ),

所以，您的代码将是

 return GestureDetector(
    child:CachedNetworkImage(
        placeholder: CircularProgressIndicator(),
        imageUrl:
            'https://picsum.photos/250?image=9',
      ),
    onTap: () {});
})

Answer 2

如果您只想从屏幕上删除项目（而不是从数据库中删除），则需要将gestureDetector包装到if语句中。

class YourClass extends StatefullWidget{
  boolean showCaroussel = true;
.......
return  showCaroussel ? GestureDetector(
child:CachedNetworkImage(
    placeholder: CircularProgressIndicator(),
    imageUrl:
        'https://picsum.photos/250?image=9',
  ),
onTap: () {
 setState((){
showCaroussel  = !showCaroussel ;
});
}) ;
}): Container();

希望它能使..

Flutter：如何在Carousel中实现对图像的删除功能

2 个答案: