Big gap in horizontal uicollectionview using orthogonalScrollingBehavior

Viewed 224

As the title suggests I face weird bug (at least I did not expect that) where my items in my collection view have big gap like in this picture enter image description here

I am using orthogonalScrollingBehavior from new compositional layout API this is my code

let itemSize = NSCollectionLayoutSize(widthDimension: .absolute(100), heightDimension: .fractionalHeight(1))
let item = NSCollectionLayoutItem(layoutSize: itemSize)
item.contentInsets = NSDirectionalEdgeInsets(top: 8, leading: 8, bottom: 8, trailing: 8)
        
let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1), heightDimension: .absolute(200))
let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize, subitems: [item])
        
let section = NSCollectionLayoutSection(group: group)
section.orthogonalScrollingBehavior = .continuous
return section

I was expecting that the only gap between them is made by contentInsets. Please help if you know the answer or the reason why this happens

2 Answers

same happening to me, maybe it's a bug since if visible cell widths are fitting the content width, then it does not get this annoying spacing. trying to find a workaround.

I had the same problem. Try to use widthDimension: .estimated(1) for the group NSCollectionLayoutSize. Example:

func makeTestLayoutSection() -> NSCollectionLayoutSection {
    let item = NSCollectionLayoutItem(layoutSize: NSCollectionLayoutSize(widthDimension: .absolute(400), heightDimension: .absolute(500)))
    let group = NSCollectionLayoutGroup.horizontal(layoutSize: NSCollectionLayoutSize(widthDimension: .estimated(1), heightDimension: .absolute(500)), subitems: [item])
    let section = NSCollectionLayoutSection(group: group)
    section.orthogonalScrollingBehavior = .continuous
    return section
}

Tested on tvOS 15.0

Related