老规矩，直接上码。关于
CustomCollectionViewLayout没有深入，照着例子来了一遍，也点进去看了一下。如果需要做比较复杂的布局，可以深入去研究一下。做到此时，感觉UICollectionViewController的应用场景太多了，因为CustomCollectionViewLayout的可定制性非常高。
项目github下载地址
CustomCollectionViewLayout
新建CustomCollectionViewLayout继承自UICollectionViewFlowLayout。在此处继承父类的方法进行重写。
//
// CustomCollectionViewLayout.m
// UICollectionVIewDemo
//
// Created by DaLei on 2017/6/8.
// Copyright © 2017年 DaLei. All rights reserved.
//
#import "CustomCollectionViewLayout.h"
@implementation CustomCollectionViewLayout
- (instancetype)init{
if (self = [super init]) {
}
return self;
}
//判定为布局需要被无效化并重新计算的时候,布局对象会被询问以提供新的布局。
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds {
return YES;
}
- (void)prepareLayout {
[super prepareLayout];
self.scrollDirection = UICollectionViewScrollDirectionHorizontal;
// 设置内边距
CGFloat inset = (self.collectionView.frame.size.width - self.itemSize.width) * 0.5;
self.sectionInset = UIEdgeInsetsMake(0, inset, 0, inset);
}
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect {
// 获得super已经计算好的布局属性
NSArray *attributes = [super layoutAttributesForElementsInRect:rect];
// 计算collectionView最中心点的x值
CGFloat centerX = self.collectionView.contentOffset.x + self.collectionView.frame.size.width * 0.5;
// 在原有布局属性的基础上，进行微调
for (UICollectionViewLayoutAttributes *attrs in attributes) {
// cell的中心点x 和 collectionView最中心点的x值 的间距
CGFloat delta = ABS(attrs.center.x - centerX);
// 根据间距值 计算 cell的缩放比例
CGFloat scale = 1.2 - delta / self.collectionView.frame.size.width;
NSLog(@"%f,%f",delta,scale);
// 设置缩放比例
attrs.transform = CGAffineTransformMakeScale(scale, scale);
}
return attributes;
}
//这个方法的返回值，就决定了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;
// 获得super已经计算好的布局属性
NSArray *array = [super layoutAttributesForElementsInRect:rect];
// 计算collectionView最中心点的x值
CGFloat centerX = proposedContentOffset.x + self.collectionView.frame.size.width * 0.5;
// 存放最小的间距值
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 proposedContentOffset;
}
@end
CustomCollectionViewController
新建CustomCollectionViewController继承自UICollectionViewController，像以往正常的CollectionViewController一样。
//
// CustomCollectionViewController.m
// UICollectionVIewDemo
//
// Created by DaLei on 2017/6/8.
// Copyright © 2017年 DaLei. All rights reserved.
//
#import "CustomCollectionViewController.h"
#import "CustomCollectionViewCell.h"
#import "CustomCollectionViewLayout.h"
@interface CustomCollectionViewController ()
@property(nonatomic,strong)NSArray *imageArray;
@end
@implementation CustomCollectionViewController
static NSString * const reuseIdentifier = @"CustomCollectionViewCell";
-(instancetype)init{
CustomCollectionViewLayout *layout = [CustomCollectionViewLayout new];
layout.itemSize = CGSizeMake(230, 350);
return [super initWithCollectionViewLayout:layout];
}
- (void)viewDidLoad {
[super viewDidLoad];
self.title = @"面皮大师-自定义";
self.collectionView.backgroundColor = [UIColor yellowColor];
// Register cell classes
[self.collectionView registerNib:[UINib nibWithNibName:NSStringFromClass([CustomCollectionViewCell class]) bundle:nil] forCellWithReuseIdentifier:reuseIdentifier];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
}
-(NSArray *)imageArray{
if (!_imageArray) {
_imageArray = @[@"photo1.jpg",@"photo2.jpg",@"photo3.jpg",@"photo4.jpg",@"photo5.jpg",@"photo6.jpg",@"photo7.jpg",@"photo8.jpg",@"photo8.jpg"];
}
return _imageArray;
}
#pragma mark <UICollectionViewDataSource>
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
return [self.imageArray count];
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
CustomCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
[cell.image setImage:[UIImage imageNamed:[self.imageArray objectAtIndex:indexPath.item]]];
return cell;
}
@end
CustomCollectionViewCell
新建CustomCollectionViewCell定义image变量。
//
// CustomCollectionViewCell.h
// UICollectionVIewDemo
//
// Created by DaLei on 2017/6/8.
// Copyright © 2017年 DaLei. All rights reserved.
//
#import <UIKit/UIKit.h>
@interface CustomCollectionViewCell : UICollectionViewCell
@property(nonatomic,weak)IBOutlet UIImageView *image;
@end
同样，采用XIB。并拖一张图片上去
XIB
运行结果如下：
运行结果
学习参考：Developer_CYX
UICollectionViewController基础（1）
UICollectionViewController基础（2）引导页
UICollectionViewController基础（3）瀑布流
UICollectionViewController基础（4）自定义
