一、效果图

悬浮效果图

二、原理

1、将悬浮视图置于UICollectionView上

2、监听悬浮Cell的frame，悬浮Cell在屏幕中滑动时，悬浮视图位于悬浮Cell位置，跟着滑动；悬浮Cell滑出屏幕时，悬浮视图位于顶部，不再滚动。

三、开发思路

1、创建UICollectionViewFlowLayout的子类，重写- (NSArray*)layoutAttributesForElementsInRect:(CGRect)rect方法，获得悬浮Cell的frame，通过回调方法传回frame.origin.y

2、UICollectionView的父视图中添加悬浮视图，并置于UICollectionView上面。

3、监听UICollectionViewFlowLayout子类的回调方法 与 - (void)scrollViewDidScroll:(UIScrollView *)scrollView，更新悬浮视图frame

四、主要代码

1、XZCollectionViewFlowLayout子类

相关声明

#pragma mark - system

/** 重绘布局属性 */

- (NSArray*)layoutAttributesForElementsInRect:(CGRect)rect {

//1.校验

NSArray *layoutArray = [super layoutAttributesForElementsInRect:rect];

if (!layoutArray.count) return layoutArray;

//2.更新悬浮顶部值

[self updateStickTop:layoutArray];

return layoutArray;

}

回调悬浮Cell的frame.origin.y

2、ViewController

创建UICollectionView

/**

懒加载“悬浮视图”

*/

- (XZStickView *)stickView {

if (_stickView) return _stickView;

XZStickView *stickView = [XZStickView classInit];

stickView.hidden = YES;

_stickView = stickView;

[self.view insertSubview:_stickView aboveSubview:self.bgCollectionView];

return _stickView;

}

更新悬浮视图Y

#pragma mark - UIScrollViewDelegate

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {

//更新悬浮视图Y

[self updateStickViewY];

}

五、源码地址(OC语言)

Cell悬浮顶部