IOS CollectionView 线性布局

线性布局，可以实现左右滑动，并在滑动的时候改变显示的大小。
具体包含以下几个类：
1、UIView 的扩展类目：

UIView+ChangeFrameValue.hUIView+ChangeFrameValue.m

2、UICollectionViewFlowLayout 子类

LineFlowLayout.hLineFlowLayout.m

3、UICollectionViewCell 子类

MyCollectionViewCell.hMyCollectionViewCell.m

4、展示视图

DetailsViewController.hDetailsViewController.m

源代码如下：

////  UIView+ChangeFrameValue.h//  WaterFallLayout2////  Created by zhengbing on 6/30/16.//  Copyright © 2016 zhengbing. All rights reserved.//#import <UIKit/UIKit.h>@interface UIView (ChangeFrameValue)@property (nonatomic, assign) CGSize size;@property (nonatomic, assign) CGPoint origin;@property (nonatomic, assign) CGFloat x;@property (nonatomic, assign) CGFloat y;@property (nonatomic, assign) CGFloat width;@property (nonatomic, assign) CGFloat height;@end

////  UIView+ChangeFrameValue.m//  WaterFallLayout2////  Created by zhengbing on 6/30/16.//  Copyright © 2016 zhengbing. All rights reserved.//#import "UIView+ChangeFrameValue.h"@implementation UIView (ChangeFrameValue)- (void)setOrigin:(CGPoint)origin{    CGRect rect = self.frame;    rect.origin = origin;    self.frame = rect;}- (CGPoint)origin{    return self.frame.origin;}- (void)setX:(CGFloat)x{    CGRect rect = self.frame;    rect.origin.x  = x;    self.frame = rect;}- (CGFloat)x{    return self.origin.x;}- (void)setY:(CGFloat)y{    CGRect rect = self.frame;    rect.origin.y  = y;    self.frame = rect;}- (CGFloat)y{    return self.origin.y;}- (void)setSize:(CGSize)size{    CGRect rect = self.frame;    rect.size = size;    self.frame = rect;}- (CGSize)size{    return self.frame.size;}- (void)setWidth:(CGFloat)width{    CGRect rect = self.frame;    rect.size.width  = width;    self.frame = rect;}- (CGFloat)width{    return self.size.width;}- (void)setHeight:(CGFloat)height{    CGRect rect = self.frame;    rect.size.height = height;    self.frame = rect;}- (CGFloat)height{    return self.size.height;}@end

////  LineFlowLayout.h//  WaterFallLayout2////  Created by zhengbing on 6/30/16.//  Copyright © 2016 zhengbing. All rights reserved.//#import <UIKit/UIKit.h>@interface LineFlowLayout : UICollectionViewFlowLayout@end

////  LineFlowLayout.m//  WaterFallLayout2////  Created by zhengbing on 6/30/16.//  Copyright © 2016 zhengbing. All rights reserved.//#import "LineFlowLayout.h"#import "UIView+ChangeFrameValue.h"static CGFloat const itemHW = 100;static CGFloat screenWidth;@interface LineFlowLayout()@property (nonatomic, assign) BOOL firstLoaded;@end@implementation LineFlowLayout- (instancetype)init{    self = [super init];    if (self) {    }    return self;}/** *  当layout准备好后 调用 */- (void)prepareLayout{    [super prepareLayout];    NSLog(@"prepareLayout");    if (!_firstLoaded) {        screenWidth = [UIScreen mainScreen].bounds.size.width;        CGFloat cellInset = (self.collectionView.width - itemHW) * 0.5;        self.itemSize = CGSizeMake(itemHW, itemHW);        self.scrollDirection = UICollectionViewScrollDirectionHorizontal;        self.sectionInset = UIEdgeInsetsMake(0, cellInset, 0, cellInset);        self.minimumLineSpacing = 70;        _firstLoaded = YES;    }}/** *  判断视图滚动后的位置并返回其offset * *  @param proposedContentOffset 预计滚动后的位置 *  @param velocity              滚动速度 * *  @return 返回滚动后所停留的位置 */- (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity{    CGRect lastRect;    lastRect.origin = proposedContentOffset;    lastRect.size = self.collectionView.size;    NSArray *array = [self layoutAttributesForElementsInRect:lastRect];    CGFloat spacing = MAXFLOAT;    for (UICollectionViewLayoutAttributes *attr in array) {        CGFloat newSpacing = attr.center.x - (proposedContentOffset.x + screenWidth * 0.5);        if ( ABS(newSpacing) < ABS(spacing)) {            spacing = newSpacing;        }    }    CGPoint backPoint = CGPointMake(proposedContentOffset.x + spacing, proposedContentOffset.y);    return backPoint;}/** *  设置为YES则每当显示框改变时 都会调用layout适配 */- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds{    return YES;}/** *  返回所有显示区域内item属性的方法 * *  @param rect 显示区域内 */- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect{    NSArray *array = [super layoutAttributesForElementsInRect:rect];    for (UICollectionViewLayoutAttributes *attr in array) {        CGRect collectionRect;        collectionRect.origin = self.collectionView.contentOffset;        collectionRect.size = self.collectionView.size;        if (CGRectIntersectsRect(collectionRect, attr.frame)) {            [self changeShowLayoutAttributes:attr];        }    }    return array;}/** *  改变显示的layoutattributes属性 */- (void)changeShowLayoutAttributes:(UICollectionViewLayoutAttributes *)attr{    CGFloat spacing = attr.center.x - (self.collectionView.contentOffset.x + screenWidth * 0.5);    spacing = ABS(spacing);    CGFloat newAlpha = 0.7;    CGFloat scale = 1;    if (spacing <= screenWidth * 0.5) {        scale += 0.5 - 0.5 * (spacing / (screenWidth * 0.5));        newAlpha += 0.3 - 0.3 * (spacing / (screenWidth * 0.5));    }    attr.transform3D = CATransform3DMakeScale(scale, scale, 1.0f);    attr.alpha = newAlpha;}@end

////  DetailsViewController.h//  WaterFallLayout2////  Created by zhengbing on 6/30/16.//  Copyright © 2016 zhengbing. All rights reserved.//#import <UIKit/UIKit.h>@interface DetailsViewController : UIViewController@end

////  DetailsViewController.m//  WaterFallLayout2////  Created by zhengbing on 6/30/16.//  Copyright © 2016 zhengbing. All rights reserved.//#import "DetailsViewController.h"#import "MyCollectionViewCell.h"#import "WaterLayout.h"#import "LineFlowLayout.h"#define CELLID @"DetailsViewController"@interface DetailsViewController ()<UICollectionViewDelegate,UICollectionViewDataSource>@property(nonatomic, strong)NSMutableArray * dataSource;@property(nonatomic, strong)UICollectionView * collectionView;@end@implementation DetailsViewController- (void)viewDidLoad {    [super viewDidLoad];    // Do any additional setup after loading the view, typically from a nib.    [self initData];    [self initUI];}-(void)initData{    _dataSource = [NSMutableArray array];    for (int i = 0; i < 20; i++) {        NSString *imageName = [NSString stringWithFormat:@"%d",i+1];        [_dataSource addObject:imageName];    }}-(void)initUI{    self.view.backgroundColor = [UIColor yellowColor];    [self.view addSubview:self.collectionView];}- (void)didReceiveMemoryWarning {    [super didReceiveMemoryWarning];    // Dispose of any resources that can be recreated.}#pragma mark getter and setter-(UICollectionView *)collectionView{    if (!_collectionView) {        //线性布局        _collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 200, self.view.bounds.size.width, 250) collectionViewLayout:[[LineFlowLayout alloc] init]];        _collectionView.delegate = self;        _collectionView.dataSource = self;        _collectionView.backgroundColor = [UIColor yellowColor];        [_collectionView registerNib:[UINib nibWithNibName:@"MyCollectionViewCell" bundle:[NSBundle mainBundle]] forCellWithReuseIdentifier:CELLID];    }    return _collectionView;}#pragma mark delegate- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{    return _dataSource.count;}- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{    MyCollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:CELLID forIndexPath:indexPath];    cell.imageName = _dataSource[indexPath.row];    return cell;}@end