前言

UICollectionView是蘋果推出的可以根據(jù)自身需求高度定制化的滑動(dòng)視圖，功能比UITableView更強(qiáng)大，為什么說是高度定制化呢？因?yàn)槟憧梢宰远xUICollectionViewLayout來實(shí)現(xiàn)自己想要的布局方式，而我們常用的UICollectionViewFlowLayout其實(shí)是蘋果官方自定義的繼承UICollectionViewLayout的，只是給開發(fā)者提供他們封裝好的、常用的布局方式。如果滿足不了自己的實(shí)際需要，就要考慮自定義layout了。

最近在做版本迭代，有這樣一個(gè)需求，其本質(zhì)就是UICollectionView橫向滑動(dòng)，并且可以設(shè)置指定下標(biāo)cell懸浮。當(dāng)時(shí)準(zhǔn)備了兩種方案，
其一：UICollectionView橫向滑動(dòng)，創(chuàng)建一個(gè)和cell長得一樣的View，根據(jù)偏移量來控制View的位置來達(dá)到虛假的懸浮效果。但是感覺這樣有點(diǎn)low。
其二：就是利用UICollectionView的高度定制化布局，重寫layout，這里直接重寫繼承UICollectionViewFlowLayout的layout即可。

自定義layout

直接上代碼吧
重寫的DDHorizontalSuspendingCellLayout.h

#import <UIKit/UIKit.h>

NS_ASSUME_NONNULL_BEGIN

@interface DDHorizontalSuspendingCellLayout : UICollectionViewFlowLayout

//懸浮cell的下標(biāo)，這里默認(rèn)只顯示一個(gè)分區(qū)，所以用了NSInteger的下標(biāo)而沒有用NSIndexPath類型的下標(biāo)（可以自行改動(dòng)）
@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;
}


 // 指定新的區(qū)域的時(shí)候調(diào)用，返回指定區(qū)域的cell布局對(duì)象
- (NSArray<__kindof UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect {
    //獲取到父類所返回的數(shù)組（里面放的是當(dāng)前屏幕所能展示的item的結(jié)構(gòu)信息）
    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;表示一旦滑動(dòng)就實(shí)時(shí)調(diào)用上面這個(gè)layoutAttributesForElementsInRect:方法來獲取當(dāng)前屏幕上顯示的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個(gè)",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

運(yùn)行效果

1.jpeg

2.jpeg