Hello，最近在做项目过程中遇到一个需求，就是在不同的详情页显示不同数量的图片，很是懵逼了一会。。。所以写下来，希望能够帮到有需要的朋友。由于刚写了测试用的，所以功能还是很简陋，主要是提供一个思路。
进入正题。
2.gif
首先你需要建立模型，请求数据。有了模型和数据之后，搭建框架，建立tableView，创建cell（tableView）。
主要思路：在cell上加一个backView，再在backView上添加CollectionView
相关文件名：
相关文件名.png
代码实例：
我使用xib布局
xib布局.png
拖线（此处只写重要点）
tableViewCell的.h
//背景View
@property (strong, nonatomic) IBOutlet UIView *backView;
//CollectionView
@property (strong, nonatomic) IBOutlet ImageCollectionView *imageCollection;
tableViewCell的.m
//此处引入ControllerViewCell，由于我的CollectionView只放图片，所以叫ImageControllerView
#import "ImageCollectionViewCell.h"
//遵循协议
@interface DetailTableViewCell ()<UICollectionViewDataSource,UICollectionViewDelegate>
@end
//标识符
static NSString * const reuseIdentifier = @"ImageCollectionViewCell";
- (void)awakeFromNib {
//此处是我给头像削圆角
self.ownerHeaderImage.layer.cornerRadius = self.ownerHeaderImage.bounds.size.width/2;
self.ownerHeaderImage.layer.masksToBounds = YES;
//布局
UICollectionViewFlowLayout * flowLayout = [[UICollectionViewFlowLayout alloc] init];
//根据自己的需求设置宽高
[flowLayout setItemSize:CGSizeMake(self.backView.frame.size.width, 150)];
//竖直滑动
[flowLayout setScrollDirection:UICollectionViewScrollDirectionVertical];
//内边距，列、行间距
flowLayout.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0);
flowLayout.minimumInteritemSpacing = 0;
flowLayout.minimumLineSpacing = 0;
[self.imageCollection setCollectionViewLayout:flowLayout];
//注册（xib）
[self.imageCollection registerNib:[UINib nibWithNibName:@"ImageCollectionViewCell" bundle:nil] forCellWithReuseIdentifier:reuseIdentifier];
//代理、数据源（也可以拖线）
self.imageCollection.delegate = self;
self.imageCollection.dataSource = self;
//添加到背景View上（此处可以不写，也可以实现，写代码写习惯了，总想写）
// [self.backView addSubview:self.imageCollection];
}
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return 2;
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return 2;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
ImageCollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
return cell;
}
好了，基本功能就实现了。具体功能得看你的需求了。
为什么使用collectionView呢？是因为使用collectionView可以根据你所给的数据判断显示数量。添加多个View也可以，但是得判断，让显示的图片初始化，不存在的图片隐藏。
以上是我的个人见解，哪里有误，请指出，谢谢。
修改一下问题
问题：
collectionView中的cell与边界之间有距离(我需要紧贴边界);
原因：
由于是xib布局，所以加载tableViewCell走awakeFromNib方法只走一次，tableView的cell可以适应屏幕宽度，但是会把自身的宽度返回给backView（添加的那个背景View，但是我试过，似乎不添加也没问题），以及collectionView，导致与边框有很大间隙。
解决方案：
遵循 UICollectionViewDelegateFlowLayout
使用如下方法：
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
return CGSizeMake(self.backView.frame.size.width, 150);
}
