前言
在实际项目中我们有时候会遇到这样的需求,列表中包含多个模型数据一行显示不下,需要左右滑动cell或者换行上下显示出来,这里我们可以想到使用tableView嵌套collectionView来实现功能
我这里介绍一下横向滚动collectionView
一 、创建tableView,设置代理不多说
UITableView *tableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height ) style:UITableViewStylePlain];
tableView.delegate = self;
tableView.dataSource = self;
self.tableView = tableView;
[self.view addSubview: self.tableView];
实现代理方法
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return 100;
}
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
HZTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"HZTableViewCell"];
if (cell == nil) {
cell = [[HZTableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"HZTableViewCell"];
cell.delegate = self;
cell.selectionStyle = UITableViewCellSelectionStyleNone;
}
cell.textLabel.text = [NSString stringWithFormat:@"%zd",indexPath.row+1];
return cell;
}
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
return 200;
}
二、自定义tableViewCell
cell上添加一个collectionView,并成为其代理
-(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifie{
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifie]) {
[self setView]; }
return self;
}
-(void)setView{
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
layout.minimumLineSpacing = 40;
//横向滑动
layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
UICollectionView *collectionView = [[UICollectionView alloc]initWithFrame:CGRectMake(50, 0, [UIScreen mainScreen].bounds.size.width-50, 200) collectionViewLayout:layout];
collectionView.delegate = self;
collectionView.dataSource = self;
collectionView.backgroundColor = [UIColor purpleColor];
[self.contentView addSubview:collectionView];
[collectionView registerClass:[HZCollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
}
实现代理方法
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return self.dataSource.count;
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
HZCollectionViewCell *cell =[collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
cell.imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"%ld.jpg",indexPath.row+1]];
cell.label.text =[NSString stringWithFormat:@"%zd. %@",indexPath.row+1,self.dataSource[indexPath.row]];
return cell;
}
要实现点击某个item将item所在的位置传给控制器以方便做事情(我采用的是代理的方法)
定义一个协议
#import <Foundation/Foundation.h>
@class HZTableViewCell;
@protocol HZCollectionViewDelegate <NSObject>
- (void)hzcollectionView:(HZTableViewCell *)hzTableViewCell didSelectItemAtIndexPath:(NSIndexPath *)collectionView;
@end
在collectionView的点击事件中执行代理方法,所以在上边创建 HZTableViewCell的时候我有写到 cell.delegate = self;
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
if (_delegate) {
[_delegate hzcollectionView:self didSelectItemAtIndexPath:indexPath];
}
}
然后需要在控制器中实现代理方法
-(void)hzcollectionView:(HZTableViewCell *)hzTableViewCell didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
NSIndexPath *tableViewIndexPath = [self.tableView indexPathForCell:hzTableViewCell];
UIAlertController *alertVC = [UIAlertController alertControllerWithTitle:@"" message:[NSString stringWithFormat:@"点击了第%ld行的第%ld个",tableViewIndexPath.row+1,indexPath.row+1] preferredStyle:UIAlertControllerStyleAlert];
[self.navigationController presentViewController:alertVC animated:YES completion:^{
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
[alertVC dismissViewControllerAnimated:YES completion:^{
}];
});
}];
}