自定义UICollectionView的FlowLayout

先看最终实现效果:

自定义FlowLayout.gif
我们知道,UICollectionView在使用时,布局要通过UICollectionViewFlowLayout来实现.那么UICollectionViewLayout是通过哪些方法实现布局的呢?
参考文章:
iOS自定义UICollectionViewlayout仿英雄联盟选择皮肤立体轮播效果展示
文中介绍比较明白,但是实现过程中,出现了两边图片闪现的问题,如下 自定义FlowLayout闪现问题.gif

反复测试后,发现原因是,在布局中,由于图片太过缩小所致.修改重载中的第一个方法如下,能顺利解决.

const CGFloat ZDScale = 1.3f;
- (NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect{

    CGRect visibleRect = CGRectMake(self.collectionView.contentOffset.x, 0, self.collectionView.width, self.collectionView.height);
    NSArray *visibleAttriM = [super layoutAttributesForElementsInRect:visibleRect];
    NSLog(@"%@", visibleAttriM);
    [visibleAttriM enumerateObjectsUsingBlock:^(UICollectionViewLayoutAttributes *obj, NSUInteger idx, BOOL * _Nonnull stop) {
        NSLog(@"%@", obj);
        CGFloat leftM = obj.center.x - self.collectionView.contentOffset.x;
        CGFloat halfCenterX = self.collectionView.width * 0.5;
        CGFloat absOffset = fabs(leftM - halfCenterX) * 0.8;
        NSLog(@"%.2f", absOffset);
        CGFloat scale = 1 - absOffset / halfCenterX;
        obj.transform3D = CATransform3DMakeScale(ZDScale * scale, ZDScale * scale, 1);
        if (self.needAlpha) {
            if (scale < 0.6) {
                obj.alpha = 0.6;
            }else if (scale > 0.99){
                obj.alpha = 1.0;
            }else{
                obj.alpha = scale;
            }
        }
    }];
    
    NSArray *attriM = [[NSArray alloc] initWithArray:visibleAttriM copyItems:true];
    return attriM;
}

详情参考
Demo