前言
UICollectionView是苹果推出的可以根据自身需求高度定制化的滑动视图,功能比UITableView更强大,为什么说是高度定制化呢?因为你可以自定义UICollectionViewLayout来实现自己想要的布局方式,而我们常用的UICollectionViewFlowLayout其实是苹果官方自定义的继承UICollectionViewLayout的,只是给开发者提供他们封装好的、常用的布局方式。如果满足不了自己的实际需要,就要考虑自定义layout了。
最近在做版本迭代,有这样一个需求,其本质就是UICollectionView横向滑动,并且可以设置指定下标cell悬浮。当时准备了两种方案,
其一:UICollectionView横向滑动,创建一个和cell长得一样的View,根据偏移量来控制View的位置来达到虚假的悬浮效果。但是感觉这样有点low。
其二:就是利用UICollectionView的高度定制化布局,重写layout,这里直接重写继承UICollectionViewFlowLayout的layout即可。
自定义layout
直接上代码吧
重写的DDHorizontalSuspendingCellLayout.h
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
@interface DDHorizontalSuspendingCellLayout : UICollectionViewFlowLayout
//悬浮cell的下标,这里默认只显示一个分区,所以用了NSInteger的下标而没有用NSIndexPath类型的下标(可以自行改动)
@property (nonatomic, assign) NSInteger index;
@end
NS_ASSUME_NONNULL_END
DDHorizontalSuspendingCellLayout.m
#import "DDHorizontalSuspendingCellLayout.h"
@interface DDHorizontalSuspendingCellLayout ()
@end
@implementation DDHorizontalSuspendingCellLayout
- (instancetype)init {
if (self = [super init]) {
_index = 0;
}
return self;
}
// 指定新的区域的时候调用,返回指定区域的cell布局对象
- (NSArray<__kindof UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect {
//获取到父类所返回的数组(里面放的是当前屏幕所能展示的item的结构信息)
NSArray *superAttrs = [super layoutAttributesForElementsInRect:rect];
UICollectionViewLayoutAttributes *attri = [self layoutAttributesForItemAtIndexPath:[NSIndexPath indexPathForItem:self.index inSection:0]];
CGPoint offset = self.collectionView.contentOffset;
CGRect aRect = attri.frame;
attri.zIndex = 1;
if (offset.x >= attri.frame.origin.x) {
aRect.origin.x = offset.x;
}else if (offset.x + self.collectionView.frame.size.width - aRect.size.width <= aRect.origin.x) {
aRect.origin.x = offset.x + self.collectionView.frame.size.width - attri.frame.size.width;
}
attri.frame = aRect;
NSMutableArray * mArr = [superAttrs mutableCopy];
if (attri && ![mArr containsObject:attri]) {
[mArr addObject:attri];
}
return mArr;
}
//return YES;表示一旦滑动就实时调用上面这个layoutAttributesForElementsInRect:方法来获取当前屏幕上显示的item的布局信息
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds {
return YES;
}
@end
使用
DDViewController.h
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
@interface DDViewController : UIViewController
@end
NS_ASSUME_NONNULL_END
DDViewController.m
#import "DDViewController.h"
#import "DDHorizontalSuspendingCellLayout.h"
@interface DDViewController ()<UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout>
@property (nonatomic, strong) DDHorizontalSuspendingCellLayout *layout;
@property (nonatomic, strong) UICollectionView *collectionView;
@end
@implementation DDViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
self.view.backgroundColor = [UIColor redColor];
DDHorizontalSuspendingCellLayout *layout = [[DDHorizontalSuspendingCellLayout alloc] init];
layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
layout.itemSize = CGSizeMake(100, 100);
layout.minimumLineSpacing = 20;
layout.minimumInteritemSpacing = 0;
// layout.index = 1;
self.layout = layout;
UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 200, self.view.frame.size.width, 200) collectionViewLayout:layout];
collectionView.backgroundColor = [UIColor whiteColor];
collectionView.dataSource = self;
collectionView.delegate = self;
collectionView.contentInset = UIEdgeInsetsMake(50, 0, 50, 0);
[collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:NSStringFromClass([UICollectionViewCell class])];
[self.view addSubview:collectionView];
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
return 10;
}
- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:NSStringFromClass([UICollectionViewCell class]) forIndexPath:indexPath];
cell.backgroundColor = [UIColor purpleColor];
if (indexPath.row == self.layout.index) {
cell.backgroundColor = [UIColor blueColor];
}
UILabel *lab = [cell viewWithTag:9999];
if (!lab) {
lab = [[UILabel alloc] init];
lab.tag = 9999;
lab.textColor = [UIColor whiteColor];
}
lab.text = [NSString stringWithFormat:@"第%ld个",indexPath.row];
[lab sizeToFit];
lab.center = cell.contentView.center;
[cell addSubview:lab];
return cell;
}
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
self.layout.index = indexPath.row;
[collectionView reloadData];
[collectionView scrollToItemAtIndexPath:indexPath atScrollPosition:UICollectionViewScrollPositionNone animated:YES];
}
@end