iOS 玩转collection布局.

图上的效果如何实现呢？可以利用自定义flowlayout实现，下面上代码:

vc:

#import "ViewController.h"
#import "MyCell.h"
#import "MyFlowLayout.h"

@interface ViewController ()<UICollectionViewDelegate,UICollectionViewDataSource>
@property(strong,nonatomic)NSMutableArray *viewArr;
@property(assign,nonatomic)CGPoint last;
@property(strong,nonatomic)UICollectionView *myCollectionView;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    
    
//    [self playView];
    [self configCollectionView];
}
#pragma mark - 自定义folwlayout
-(void)configCollectionView{
    MyFlowLayout *flowLayout = [[MyFlowLayout alloc] init];
    flowLayout.itemSize = CGSizeMake(50, 50);
    flowLayout.minimumLineSpacing = 0;
    self.myCollectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 100, self.view.frame.size.width, 70) collectionViewLayout:flowLayout];
    self.myCollectionView.delegate = self;
    self.myCollectionView.dataSource = self;
    [self.myCollectionView registerClass:[MyCell class] forCellWithReuseIdentifier:@"MyCell"];
    [self.view addSubview:self.myCollectionView];
    self.myCollectionView.backgroundColor = [UIColor greenColor];
    flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;
}
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 1;
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return 100;
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    MyCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"MyCell" forIndexPath:indexPath];
    
    return cell;
}

flowlayout:

@implementation MyFlowLayout
-(void)prepareLayout{
    [super prepareLayout];
    [self.attrsArr removeAllObjects];
    [self creatAttrsArr];
}
-(void)creatAttrsArr{
    NSInteger count = [self.collectionView numberOfItemsInSection:0];
    for (int i = 0; i<count; i++) {
        NSIndexPath *indexpath = [NSIndexPath indexPathForItem:i inSection:0];
        UICollectionViewLayoutAttributes *attrs = [self layoutAttributesForItemAtIndexPath:indexpath];
        [self.attrsArr addObject:attrs];
    }
}
-(CGSize)collectionViewContentSize{
    return CGSizeMake(600, 70);
}
-(NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect{
    return self.attrsArr;
}
-(UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath{
    NSInteger count = [self.collectionView numberOfItemsInSection:0];
    UICollectionViewLayoutAttributes *attrs = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath];
    //一群cell距离view前部30，cell的头部间距40,且cell的大小为(50,50),则
    attrs.center = CGPointMake(30+(30)*indexPath.row, 35);
    attrs.size = CGSizeMake(50, 50);
    attrs.zIndex = -indexPath.row;
    return attrs;
}
-(NSMutableArray *)attrsArr{
    if (!_attrsArr) {
        _attrsArr = [[NSMutableArray alloc] initWithCapacity:0];
    }
    return _attrsArr;
}

mycell:

#import "MyCell.h"

@implementation MyCell
- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        self.layer.cornerRadius = frame.size.width/2.0;
        self.layer.masksToBounds = YES;
        
        self.backgroundColor = [UIColor colorWithRed:arc4random()%255/255.0 green:arc4random()%255/255.0 blue:arc4random()%255/255.0 alpha:1];
    }
    return self;
}
@end

效果：

除此之外还可以实现各种牛逼的效果，如圆环相册布局，cell遍布球体布局。。等等等等，就不一一解释了，自己是先看看吧.

更多问题，欢迎加群讨论：565191947