问题描述
我目前定义了以下组合布局:
func compose() -> NSCollectionLayoutSection {
let heroItemSize = NSCollectionLayoutSize(
widthDimension: .fractionalWidth(2/3),heightDimension: .estimated(550)
)
let heroItem = NSCollectionLayoutItem(layoutSize: heroItemSize)
let sideKickItemSize = NSCollectionLayoutSize(
widthDimension: .fractionalWidth(1.0),heightDimension: .fractionalHeight(0.5)
)
let sideKickItem = NSCollectionLayoutItem(layoutSize: sideKickItemSize)
let sideKickGroupSize = NSCollectionLayoutSize(
widthDimension: .fractionalWidth(1/3),heightDimension: .fractionalHeight(1.0)
)
let sideKickGroup = NSCollectionLayoutGroup.vertical(
layoutSize: sideKickGroupSize,subitems: [sideKickItem,sideKickItem]
)
let topGroupSize = NSCollectionLayoutSize(
widthDimension: .fractionalWidth(1.0),heightDimension: .estimated(550)
)
let topGroup = NSCollectionLayoutGroup.horizontal(
layoutSize: topGroupSize,subitems: [heroItem,sideKickGroup]
)
return NSCollectionLayoutSection(group: topGroup)
}
这给了我以下布局:
理想情况是绿色单元格(heroItem
)的估计高度应该是领先的。紫色单元格(sideKickItem
)应该和绿色单元格一样高。
我不确定为什么布局最终使用高度 550
作为最终高度,这使得紫色单元格对于其内容来说太大了。
所以最后我希望布局像下图一样:
解决方法
解决办法: 要进行的更改很细微:
1.Function 必须返回 UICollectionViewLayout 而不是 NSCollectionLayoutSection
- NSCollectionLayoutSection = "组合了一组 分成不同的视觉分组。”
- UICollectionViewCompositionalLayout = "一个布局对象,让你 以高度适应性和灵活的视觉排列组合项目。”
2.将 NSCollectionLayoutSection 传递给 UICollectionViewCompositionalLayout
最终代码:
//change 1
func compose() -> UICollectionViewLayout {
//change 2
let section = NSCollectionLayoutSection(group: topGroup)
let layout = UICollectionViewCompositionalLayout(section: section)
return layout
如果可行,请接受此答案。