8.4 C
London
Thursday, March 28, 2024

ios – UICollectionViewCompositionalLayout pinToVisibleBounds for group, pin a number of part headers


Normally my aim is to have a format the place a number of UICollectionReusableView may be pinned to prime on the identical time. I am undecided what must be the info supply construction. So far as I understood there isn’t any native technique to pin a number of part headers on the identical time, in order that they’re seen even should you scrolled manner down beneath. So I used to be pondering of making an enormous part with the part header, after which connect one other header to my group. However pinToVisibleBounds does not work as I anticipated on NSCollectionLayoutGroup gadgets.

func generateListSection() -> NSCollectionLayoutSection {
    let merchandise = NSCollectionLayoutItem(layoutSize: .init(widthDimension: .fractionalWidth(1.0), heightDimension: .estimated(20)))

    let itemsGroup = NSCollectionLayoutGroup.vertical(layoutSize: .init(widthDimension: .fractionalWidth(0.5), heightDimension: .estimated(100)), repeatingSubitem: merchandise, rely: 5)
    itemsGroup.edgeSpacing = .init(main: nil, prime: .mounted(40), trailing: nil, backside: nil)

    let group = NSCollectionLayoutGroup.horizontal(layoutSize: .init(widthDimension: .fractionalWidth(1.0), heightDimension: .estimated(200)), repeatingSubitem: itemsGroup, rely: 2)
    
    group.interItemSpacing = .mounted(12)
    
    let groupHeader = NSCollectionLayoutBoundarySupplementaryItem(layoutSize: .init(widthDimension: .fractionalWidth(1.0), heightDimension: .absolute(40)), elementKind: "BlueGroupHeaderView", alignment: .prime)
    groupHeader.pinToVisibleBounds = true
    group.supplementaryItems = [groupHeader]

    let part = NSCollectionLayoutSection(group: group)
    part.interGroupSpacing = 12
    part.contentInsets = .init(prime: 16, main: 0, backside: 16, trailing: 0)

    let sectionHeader = NSCollectionLayoutBoundarySupplementaryItem(layoutSize: .init(widthDimension: .fractionalWidth(1.0), heightDimension: .absolute(80)), elementKind: "YellowSectionHeaderView", alignment: .prime)
    sectionHeader.pinToVisibleBounds = true
    sectionHeader.zIndex = 100
    part.boundarySupplementaryItems = [sectionHeader]

    return part
}

enter image description here

I am undecided if I am shifting in the correct route.

The consequence I wish to obtain is that I gave an enormous display screen with quite a lot of sections, cell, of various sorts, layouts and many others. And there’s a requirement to have some a part of the info to be pinned prime prime of with none reference to the part.

So shall we say I’ve acquired 5 sections, part #2 and part #4 have some headers. When scrolling I wish to obtain this: after I scroll by part 1, the part 2 header strikes from backside to prime as ordinary, then it is get pinned after I scroll by part 2. After that after I’m scrolling by part 3, I nonetheless need section2 header to be pinned to prime. Once I get to part 4, I need section2 header to be pinned to the highest + part 4 header to be pinned to the highest as effectively, proper beneath part 2 header, after I scroll to part 5, part 2 header must be pinned to prime, section4 header ought to scroll away.

Plz do not confuse it must be precisely part header part, it is simply to explain that some a part of the gathering view ought to stays pinned to prime on a regular basis, and a few half ought to stay solely after I’m scrolling by it is part shall we say.

I wish to know if this type of format one way or the other achievable with compositional format or that must be completed with fully customized format subclass with handbook calculating format attributes?

Latest news
Related news

LEAVE A REPLY

Please enter your comment!
Please enter your name here