封装内嵌UICollectionView和UIPageControl的ScrollView

在需求中涉及到一个比较通用的控件,ScrollView里面嵌入CollectionView,封装一下,后面再有相同交互不用重复造轮子。

一。交互样式

控件交互:

[ ]

如下类似样式都可以复用同一控件:

[ ]

[ ]

二。接口
  • 接口

init的时候传入view布局相关的TBCollectionViewParamsModel参数;拿到数据后调用setDataList传入数据,展示CollectionScrollView。

@interface TBHorizontalItemListView : UIView

- (instancetype)initWithFrame:(CGRect)frame collectionViewParamsModel:(TBCollectionViewParamsModel *)viewParams;

- (void)setDataList:(NSArray*)listData;

@end
  • 参数 @interface TBCollectionViewParamsModel : NSObject @property (nonatomic, assign) CGSize itemSize; //collectionView的cell大小 @property (nonatomic, assign) CGFloat minimumInteritemSpacing; //collectionView的cell间水平间距 @property (nonatomic, assign) CGFloat minimumLineSpacing; //collectionView的cell间的竖直间距 @end @interface TBCollectionDataListModel : NSObject @property (nonatomic, retain) NSArray *itemList; //单个collectionView中的数据list @property (nonatomic, strong) Class cellClass; //单个collectionView中使用的cell类型, 需要实现TBCollectionViewCellProtocol @property (nonatomic, assign) int type; //扩展,暂时无用 @end
三。实现

[ ]

UICollectionViewUICollectionViewUICollectionViewUICollectionView

  • 灰色的是容器View
  • 紫色的是UIScrollView
  • 蓝色的是UICollectionView
  • 红色的是UICollectionViewCell
  • 下方小点点是TBScrollPageControl

关键代码:

根据setDataList传入的数据创建CollectionView并为其布局

- (void)initCollectionViews
{
    _bgScrollView.contentSize = CGSizeMake(TBHorizontalItemListViewWidth * _listData.count, 0);

    CGFloat x_offset = 0;
    for (NSInteger i = 0; i < _listData.count; i++)
    {
        UICollectionViewFlowLayout *flowLayout = [self getCollectionViewFlowLayout:_viewParams];

        CGRect frame = CGRectMake(x_offset + 23 / 2, 20, TBHorizontalItemListViewWidth - 23, 199);
        UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:frame collectionViewLayout:flowLayout];
        collectionView.tag = 100+i;
        collectionView.dataSource = self;
        collectionView.delegate = self;
        collectionView.alwaysBounceHorizontal = NO;
        collectionView.alwaysBounceVertical = YES;
        collectionView.backgroundColor = [UIColor colorWithWhite:0 alpha:0];
        collectionView.showsHorizontalScrollIndicator = NO;
        collectionView.showsVerticalScrollIndicator = NO;
        collectionView.scrollEnabled = NO;
        collectionView.backgroundColor = [UIColor blueColor];
        [_bgScrollView addSubview:collectionView];

        Class cellClass = [_listData objectAtIndex:i].cellClass;
        NSString *identifier = [NSString stringWithFormat:@"ItemLandscapeCollectionCellIdentifier_%ld",(long)collectionView.tag];
        [collectionView registerClass:cellClass forCellWithReuseIdentifier:identifier];

        x_offset += TBHorizontalItemListViewWidth;
        [collectionView reloadData];
    }
    [self layoutIfNeeded];
}

CollectionView的代理:

#pragma mark - UICollectionDataSource

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
    return _viewParams.itemSize;
}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    NSInteger groupIndex = collectionView.tag - 100;
    return _listData[groupIndex].itemList.count;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    /**取数据*/
    NSInteger groupIndex = collectionView.tag - 100;
    TBCollectionDataListModel *listModel = _listData[groupIndex];
    id itemModel = listModel.itemList[indexPath.row];

    /**创建cell&&赋值*/
    NSString *identifier = [NSString stringWithFormat:@"ItemLandscapeCollectionCellIdentifier_%ld",collectionView.tag];
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:identifier forIndexPath:indexPath];
    if ([cell respondsToSelector:@selector(setModel:)])
    {
        [cell setModel:itemModel];
    }

    return cell;
}

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏技术博文

php 二维码生成类

<?php /** * BarcodeQR - Code QR Barcode Image Generator (PNG) * @package Barco...

4065
来自专栏Core Net

Visual Studio 2017 15.7 下的.NET Core

3658
来自专栏运维前线

CentOS 6.X 安装中文字体

由于业务需要,需要对CentOS6.9添加中文字体支持 安装工具包 yum install -y fontconfig mkfontscale 安装完成后...

2106
来自专栏前端那些事

微信小程序实现各种特效实例

写在前面 最近在负责一个微信小程序的前端以及前后端接口的对接的项目,整体上所有页面的布局我都已经搭建完成,里面有一些常用的特效,总结一下,希望对大家和我都能有所...

5067
来自专栏技术博文

远程请求

function simpleRequest( $url , $post_data = array() ,$option=array()) {/*{{{*/ ...

2627
来自专栏蓝天

多线程中使用curl致coredump问题

coredump时的调用栈: #0  0x081eff2c in addbyter () #1  0x081f05b8 in dprintf_format...

633
来自专栏优启梦

获取lofter官方首页背景壁纸

22110
来自专栏梧雨北辰的开发录

使用xib自定义UIcollectionViewCell控件为nil的问题

该怎么说呢,这是一个很坑的事情,今天在完成一个界面的时候,用了xib来自定义UICollectionViewCell。其实这是一个很简单的过程,关键代码也就包括...

2995
来自专栏一“技”之长

iOS流布局UICollectionView系列三——使用FlowLayout进行更灵活布局

        前面的博客介绍了UICollectionView的相关方法和其协议中的方法,但对布局的管理类UICollectionViewFlowLayout...

663
来自专栏Youngxj

远程采集接口图片案例

2115

扫码关注云+社区