UICollectionView——iOS学习连载27_uicollectionview decelerationrate-优快云博客

本文详细介绍如何使用UICollectionViewFlowLayout来创建水平滑动的 UICollectionView，并设置了单元格的尺寸、间距、填充量等属性，同时实现了分页效果及图片居中显示等功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 创建布局对象

UICollectionViewFlowLayout *flowLayOut = [[UICollectionViewFlowLayout alloc] init];

2. 设置滑动方向

flowLayOut.scrollDirection = UICollectionViewScrollDirectionHorizontal;

3. 设置最小间距

flowLayOut.minimumInteritemSpacing = 0;

flowLayOut.minimumLineSpacing = 0;

4.设置单元格的大小

flowLayOut.itemSize = CGSizeMake(80, 80);

5. 初始化CollectionView

UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, width, height) collectionViewLayout:flowLayout];

6. 设置分页

collectionView.pagingEnabled = YES;

7. 设置滑动条隐藏

collectionView.showsHorizontalScrollIndicator = NO;

collectionView.showsVerticalScrollIndicator = NO;

8. 注册单元格

[collectionView registerClass:[ PhotoCell class] forCellWithReuseIdentifier:@"myCell"];

9. 设置填充量

collectionView.contentInset = UIEdgeInsetsMake(0, (kScreenWidth - 220) / 2, 0, (kScreenWidth - 220) / 2);

10. 设置scrollView的减速速率（范围0—1）

self.decelerationRate = UIScrollViewDecelerationRateFast

11. #pragma mark -UICollectionViewDataSource

//返回单元格的个数

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return self.data.count;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{

PhotoCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"myCell" forIndexPath:indexPath];

    cell.backgroundColor = [UIColor colorWithRed:arc4random() % 10 * 0.1 green:arc4random() % 10 * 0.1 blue:arc4random() % 10 * 0.1 alpha:1];

    cell.model = self.data[indexPath.row];
    return cell;

}

12. 动态设置单元格的尺寸

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(80, arc4random() % 80);

}

13. 当单元格已经不在屏幕上显示时调用的方法（使图片还原）

- (void)collectionView:(UICollectionView *)collectionView didEndDisplayingCell:(PhotoCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath
{
cell.scrollView.zoomScale = 1;

}

14. 设置点击到的图片水平居中

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
[collectionView scrollToItemAtIndexPath:indexPath atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:YES];

}

15. 设置每个section初始化的偏移量

- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
return UIEdgeInsetsMake(0, (kScreenWidth - self.pageWidth) / 2, 0, (kScreenWidth - self.pageWidth) / 2);

}

16. 手指将要离开屏幕时调用的方法(scrollView: 滑动对象;velocity: 手指离开屏幕的时候，scrollView的滑动速度;targetContentOffset: scrollview停止后的偏移量)

- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset

{

}

17. 结束显示单元格时调用的方法

- (void)collectionView:(UICollectionView *)collectionView didEndDisplayingCell:(PosterCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath

{

}