iOS UICollectionViewFlowLayout流式布局

新年第一发、先来个iOS温习温习

042ec9e15de70b28500fa5b9e06883be.jpg

//
//  KCLLayout.m
//  ReactiveCocoaDemo
//
//  Created by kcl on 2018/2/25.
//  Copyright © 2018年 KCL. All rights reserved.
//

#import "KCLLayout.h"

@implementation KCLLayout

- (void)prepareLayout
{
    [super prepareLayout];
    self.scrollDirection = UICollectionViewScrollDirectionHorizontal;

    CGFloat insert = (self.collectionView.frame.size.width - self.itemSize.width)*0.5;
    self.itemSize = CGSizeMake(150, 150);
    self.sectionInset = UIEdgeInsetsMake(0, insert, 0, insert);
}

/**
 UICollectionViewLayoutAttributes *attrs;
 1.一个cell对应一个UICollectionViewLayoutAttributes对象
 2.UICollectionViewLayoutAttributes对象决定了cell的frame
 */
/**
 * 这个方法的返回值是一个数组（数组里面存放着rect范围内所有元素的布局属性）
 * 这个方法的返回值决定了rect范围内所有元素的排布（frame）
 */

- (NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect
{
    // 获得super已经计算好的布局属性,返回的素组包括所有cell的布局属性
    NSArray *array = [super layoutAttributesForElementsInRect:rect];
    // 计算collectionView最中心点的x值
    CGFloat centerX = self.collectionView.contentOffset.x+self.collectionView.frame.size.width*0.5;

    // 遍历所有cell的属性,在原有布局属性的基础上，进行微调
    for (UICollectionViewLayoutAttributes *attrs in array){
        // cell的中心点x 和 collectionView最中心点的x值 的间距
        CGFloat delta = ABS(attrs.center.x - centerX);
        // 根据间距值 计算 cell的缩放比例
        CGFloat scale = 1 - delta/self.collectionView.frame.size.width;
        // 设置缩放比例
        attrs.transform = CGAffineTransformMakeScale(scale, scale);
    }
    return array;
}

/**
 * 这个方法的返回值，就决定了collectionView停止滚动时的偏移量
 */
- (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity
{
    // 计算出最终显示的矩形框
    CGRect rect;
    rect.origin.y = 0;
    rect.origin.x = proposedContentOffset.x;
    rect.size = self.collectionView.frame.size;

    // 计算collectionView最中心点的x值
    CGFloat centerX = proposedContentOffset.x + self.collectionView.frame.size.width * 0.5;
    // 获得super已经计算好的布局属性
    NSArray *array = [super layoutAttributesForElementsInRect:rect];

    // 存放最小的间距值
    CGFloat minDelta = MAXFLOAT;

    for (UICollectionViewLayoutAttributes *attrs in array){
        if (ABS(minDelta) > ABS(attrs.center.x-centerX)) {
            minDelta = attrs.center.x - centerX;
        }
    }
    // 修改原有的偏移量
//    proposedContentOffset.x += minDelta;
    return CGPointMake(proposedContentOffset.x + minDelta, proposedContentOffset.y);
}

/**
 * 当collectionView的显示范围发生改变的时候，是否需要重新刷新布局
 * 一旦重新刷新布局，就会重新调用下面的方法：
 1.prepareLayout
 2.layoutAttributesForElementsInRect:方法
 */
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds
{
    return YES;
}
@end

实现瀑布流
这个瀑布流是16年写的了、那个时候没怎么玩简书。现在把代码粘贴过来

//
//WaterflowLayout.m
//瀑布流
//
//Created by mac on 16/5/17.
//Copyright © 2016年孔晨亮. All rights reserved.
//
#import"WaterflowLayout.h"
#import"ViewController.h"
@interfaceWaterflowLayout()
/**
*cell高度数组
*/
@property(nonatomic,strong)NSMutableArray *Heightarray;
/**
*cell属性数组
*/
@property(nonatomic,strong)NSMutableArray *Attrsarray;

@end

@implementationWaterflowLayout

-(NSMutableArray *)Heightarray
{
    if(!_Heightarray) {

        _Heightarray = [[NSMutableArray alloc]init];
    }
    return_Heightarray;
}

- (NSMutableArray *)Attrsarray
{
    if(!_Attrsarray) {
        _Attrsarray = [[NSMutableArray alloc]init];
    }
    return_Attrsarray;
}
/**
*取出最小值下表
*
*@return <#return value description#>
*/
- (NSInteger)minIndex
{
    __blockNSInteger minIndex =0;
    __blockCGFloat minValue = MAXFLOAT;
    [self.Heightarray enumerateObjectsUsingBlock:^(id_Nonnullobj, NSUInteger idx,BOOL*_Nonnullstop) {
    if([obj floatValue] < minValue) {
            minValue = [obj floatValue];
            minIndex = idx;
        }
    }];
    returnminIndex;
}
/**
*取出最大值下标
*
*@return <#return value description#>
*/
- (NSInteger)maxIndex
{
    __blockNSInteger maxIndex =0;
    __blockCGFloat maxValue =0;
    [self.Heightarray enumerateObjectsUsingBlock:^(id_Nonnullobj, NSUInteger idx,BOOL*_Nonnullstop) {

        if([obj floatValue] > maxValue) {
            maxValue = [obj floatValue];
            maxIndex = idx;
            }
    }];
    returnmaxIndex;
}

- (void)prepareLayout
{
    self.delegate = (id)self.collectionView.delegate;

    for(inti =0; i<self.Heightarray.count;i++)
        self.Heightarray[i] =@(0);
    }

    CGFloat kWIDTH = (self.collectionView.frame.size.width -self.insert.left -self.insert.right - (self.count -1) *self.HorizonSpace)/self.count;
    for(inti =0; i < [self.collectionView numberOfItemsInSection:0]; i++)
    {
        NSInteger minIndex = [selfminIndex];
        CGSizesize = [self.delegate collectionView:self.collectionView layout:selfsizeForItemAtIndexPath:[NSIndexPath indexPathForRow:i inSection:0]];
        CGFloat kHEIGHT = size.height /size.width *kWIDTH;
        CGFloat xoffset =self.insert.left + (kWIDTH +self.HorizonSpace)*minIndex;
        CGFloat yoffset = [self.Heightarray[minIndex] floatValue] +self.HorizonSpace;
        CGRect Itemframe = CGRectMake(xoffset, yoffset, kWIDTH, kHEIGHT);
        UICollectionViewLayoutAttributes *attrs = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:[NSIndexPath indexPathForRow:i inSection:0]];
        attrs.frame = Itemframe;
        [self.Attrsarray addObject:attrs];
        self.Heightarray[minIndex] =@(CGRectGetMaxY(Itemframe));
    }
}

- (CGSize)collectionViewContentSize
{
    NSInteger maxIndex = [selfmaxIndex];
    return CGSizeMake(self.collectionView.frame.size.width, [self.Heightarray[maxIndex] floatValue]);
}

- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath
{
    return self.Attrsarray[indexPath.item];
}

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect
{
    return self.Attrsarray;
}

- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds
{
    return YES;
}

@end