iOS中cell中多个图片显示方案实现

iOS中cell中多个图片显示方案实现

在项目中常常会像微信朋友圈那样的列表显示,这个时候我们就需要根据返回的数据模型去进行布局。
我们需要和后台敲定数据模型的内容,其中就应该包括cell需要显示图片的个数、以及每个图片的宽高尺寸方便我们来规定布局。
如图显示了9张图片,我们其实是需要考虑三种布局1*1,2*2,3*3;

这里写图片描述

  • 1*1情况
    在1*1只需要显示一张图片的时候,我们要根据图片的宽高来计算需要那种布局,
    rect.size.height/image.height = rect.size.width/image.width;

  • 2*2情况下
    这个时候是考虑了2张和4张图片的情况,使用九宫格布局,
    九宫格布局主要是考虑列数,不看行数,重要的主要是对横竖坐标的计算,
    横坐标:=横向间距 +(i%列数)*(横向间距 +控件的宽)
    纵坐标:=纵向的起始坐标 +(i/列数)*(纵向间距+控件的高)

x = xSpace +(i%2)*(xSpace + itemWidth);//
y = origin.y +(i/2)*(yspace +itemHeight);

这里写图片描述

  • 3*3情况
    3*3主要是处理3、5、6、7、8、9这几种图片个数的,其实和2*2情况是一样的情况,也是需要九宫格来布局,

    x = xSpace +(i%3)*(xSpace + itemWidth);
    y = origin.y +(i/3)*(yspace +itemHeight);

    该文章主要是提供了设计思路,具体代码以后更新,谢谢!
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值