UICollectionView 等分有缝隙

最近开发遇到一个问题,如果一个UICollectionView需要等分屏幕时,有些情况会出现缝隙的情况。

iPhone 6 4等分,有两条缝隙

这个原因是屏幕的最小单位是1像素(1px),iPhone 6的屏幕宽度是750px,750/4=187.5会有小数点出现,不是一个完整的像素,会导致缝隙的出现。

如果消除这些缝隙呢?这里可以很老套感觉又比较实用的方法。
在返回每个cell的Size的回调时,针对每个cell的位置返回不一样的Size。

计算的逻辑是这样的,先计算出屏幕的实际宽度,在根据列数取模,得到的模再分配给左边的cell,直到分配完为止,每个cell的高度都取最长的高度,防止每一行间也有缝隙。

最后增加了一个space的参数,可以把每一列的间隔也考虑了。每一列的间隔也可以通过UICollectionView的回调函数中设置。
直接上代码吧:传送门

<pre>
/**

  • @brief 取模之后再分配多余的像素,去除平分cell的缝隙.
  • @param displayWidth 显示的宽度范围(一般是屏幕宽度)
  • @param col 显示的列数
  • @param space 列间隔宽度(可以在这里设置,也可以在collection的回调函数中设置)
  • @param indexPath cell的indexPath
  • @return 本cell的size
  • iPhone 6的屏幕是 750.
  • col = 4,space = 0;
  • 750 % 4 = 2;
  • (750 - 2) = 187;
  • 每一行的结果
  • [188,188,187,187];

*/

  • (CGSize)fixSizeBydisplayWidth:(float)displayWidth col:(int)col space:(int)space sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    float pxWidth = displayWidth * [UIScreen mainScreen].scale;
    pxWidth = pxWidth - space * (col - 1);
    int mo = (int)pxWidth % col;
    if (mo != 0) {
    // 屏幕宽度不可以平均分配
    float fixPxWidth = pxWidth - mo;
    float itemWidth = fixPxWidth / col;
    // 高度取最高的,所以要加1
    float itemHeight = itemWidth + 1.0;
    if (indexPath.row % col < mo) {
    // 模再分配给左边的cell,直到分配完为止
    itemWidth = itemWidth + 1.0;
    }
    NSNumber *numW = @(itemWidth / [UIScreen mainScreen].scale);
    NSNumber *numH = @(itemHeight / [UIScreen mainScreen].scale);
    return CGSizeMake(numW.floatValue, numH.floatValue);
    }else {
    // 屏幕可以平均分配
    float itemWidth = pxWidth / col;
    return CGSizeMake(itemWidth / [UIScreen mainScreen].scale, itemWidth / [UIScreen mainScreen].scale);
    }
    }
    </pre>
iPhone 6 4等分,没有缝隙
iPhone 6 11等分,没有缝隙
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容