UICollectionView——iOS学习连载27

本文详细介绍如何使用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
{
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值