Flutter Image图片网格展示并添加删除事件

定义文件信息对象

class FileInformation {
  String uuid;
  String patrolRecordUuid;
  String path;
  String fileName;
  String name;
  String suffixName;
  String url;

  FileInformation.build({
    this.uuid,
    this.patrolRecordUuid,
    this.path,
    this.fileName,
    this.name,
    this.suffixName,
    this.url,
  });

  FileInformation.fromJson(Map<String, dynamic> json)
      : uuid = json["uuid"],
        path = json["path"],
        name = json["name"],
        fileName = json["fileName"],
        patrolRecordUuid = json["patrolRecordUuid"],
        url = json["url"],
        suffixName = json["suffixName"];

  Map<String, dynamic> toJson() => <String, dynamic>{
        "uuid": uuid,
        "path": path,
        "patrolRecordUuid": patrolRecordUuid,
        "fileName": fileName,
        "name": name,
        "url": url,
        "suffixName": suffixName,
      };

  static List<FileInformation> allFromJson(List jsonList) {
    return jsonList.map((json) => FileInformation.fromJson(json)).toList();
  }
}

  GridView _getImage() {
    return GridView.builder(
    	//实现滑动必须添加的属性
        shrinkWrap: true,
        physics: NeverScrollableScrollPhysics(),
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        	//横轴子元素的数量
            crossAxisCount: 3,
			//主轴方向的间距
            mainAxisSpacing: 10.0,
            //子元素在横轴长度和主轴长度的比例。由于crossAxisCount指定后,子元素横轴长度就确定了,然后通过此参数值就可以确定子元素在主轴的长度。
            childAspectRatio: 0.7,
            //横轴方向子元素的间距。
            crossAxisSpacing: 10.0),
        //子元素总个数
        itemCount: patrolRecord.patrolRecordFiles.length,
        //内部填充
        padding: EdgeInsets.all(10.0),
        //创建子元素
        itemBuilder: (BuildContext context, int index) {
          FileInformation information = fileList[index];
          imageUrl=
              DOWNLOAD_IMAGE +
              "/" +
              information.path +
              "/" +
              information.fileName +
              information.suffixName
		  //使用GestureDetector包装可以添加图片删除事件
          return GestureDetector(
            onLongPress: () async {
              print('长按: $index');
              _showErrorMsg().then((v) {
                if (v) {
                  setState(() {
                    fileList.removeAt(index);
                  });
                }
              });
            },
            child: Image.network(imageUrl),
          );
        });
  }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值