首先,我要说的是,在过去的几个月里,我花了大概100个小时搜索谷歌和StackOverflow试图回答这个问题。我学了很多教程,都没能解决我的问题。每一个都是令人失望和沮丧的。
期望值
现实
问题
我有一个包含UIView的UITableView。UIView有自动布局约束,可以将它固定在单元格边缘15磅处,然后我给它一个阴影和圆角。在这个UIView中,我有几个标签,然后是UICollectionView和stack视图。
我的UICollectionView一直保持0的高度,我不知道如何使它具有内在大小。我能让它正确显示的唯一方法是通过故事板内的自动布局强制它达到特定的高度(这就是我拍摄这个屏幕截图所做的)。不幸的是,强迫这样的高度是不现实的,原因有二:
-
高度根据设备的宽度而变化。由于图像是正方形,所以高度是设备宽度的一半(但不完全是一半)。
-
如果没有图像,则集合视图的高度应为0。
故事板
约束条件
我在每个标签、集合视图和堆栈视图(垂直空间)之间有大约15pt的空间。集合视图原型单元中有一个图像视图。图像视图的“顶”、“底”、“尾随”和“前导”空间对“集合视图”单元格均设置为0,并且还具有1:1的比率。
集合视图布局
为了实现一个大图像和四个小图像的布局,我使用
SNCollectionViewLayout
.
数据源/委托
在我的控制器里,在
viewDidLoad
,我已经设置了
estimatedRowHeight
将UITableView的值设置为400
rowHeight
到
UITableView.automaticDimension
.
在tableView cellForRowAt中,我将一个可重用的自定义
UITableViewCell
类,在表视图单元格上设置各种出口,并调用
reloadData()
在表视图单元格的集合视图上。在脚本中,我将表视图单元格设置为集合视图的数据源和委托。
在表视图单元格的
awakeFromNib
函数,我已经设置了拐角半径、阴影,并使用下面的代码在集合视图(您可以在其示例中看到)上显示流布局:
let snCollectionViewLayout = SNCollectionViewLayout()
snCollectionViewLayout.fixedDivisionCount = 4
snCollectionViewLayout.delegate = self
snCollectionViewLayout.itemSpacing = 10
collectionView.collectionViewLayout = snCollectionViewLayout
我还实现了可选的
SNCollectionViewLayoutDelegate
编写以下函数的协议:
func scaleForItem(inCollectionView collectionView: UICollectionView, withLayout layout: UICollectionViewLayout, atIndexPath indexPath: IndexPath) -> UInt {
if indexPath.row == 0 || collectionView.numberOfItems(inSection: indexPath.section) <= 2 {
return 2
} else {
return 1
}
}
这个函数就是为什么第一个图像的高度和宽度是其他图像的两倍。
研究
为了解决这个问题,我检查了
collectionView.collectionViewLayout.collectionViewContentSize
在表视图单元格的cellForRowAt和willDisplay方法中。无论哪种情况,都是(0,0)。
我也试过在集合视图单元格的cellForItemAt和willDisplay中检查它。这些日志行甚至不会打印,除非我在collection视图中添加了高度约束以强制它变高,但是我没有一个好方法将高度降低到应有的高度,而且任何时候我尝试过,都会收到冲突的约束警告和非常不稳定的拉伸视图(例如堆栈视图完全被压扁)。
在测试中,我强制设置了一个足够大的高度约束,以便集合视图能够适应,并且在这种情况下,它会正确地呈现并且集合视图的内容大小是正确的,所以我知道它能够跟踪(可以看到
here
).
有人对此有什么见解吗?如果您有任何需要研究的细节,我很乐意提供更多的代码。我试着给出完整的图片,同时尽可能地保持简短(我知道它很长)。
我觉得这个问题与集合视图位于表视图单元格中有关。
提前谢谢。
