Post

Replies

Boosts

Views

Activity

UICollectionViewCompositionalLayout pinned headers break with section that have orthogonalScrollingBehavior
When using UICollectionViewCompositionalLayout and creating a layout that supports pinned supplementary items and additionally having a section that has orthogonalScrollingBehavior the pinned header will disappear as soon as you scroll over the section with the orthogonalScrollingBehavior. A simple layout that demonstrates how it breaks looks like this     func createLayout() -> UICollectionViewLayout {         let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                              heightDimension: .fractionalHeight(1.0))         let item = NSCollectionLayoutItem(layoutSize: itemSize)         let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                               heightDimension: .absolute(44))         let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize, subitems: [item])         let section = NSCollectionLayoutSection(group: group)         section.interGroupSpacing = 5         section.orthogonalScrollingBehavior = .continuous         section.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10)         let sectionHeader = NSCollectionLayoutBoundarySupplementaryItem(             layoutSize: NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                               heightDimension: .estimated(44)),             elementKind: PinnedSectionHeaderFooterViewController.sectionHeaderElementKind,             alignment: .top)         let sectionFooter = NSCollectionLayoutBoundarySupplementaryItem(             layoutSize: NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                               heightDimension: .estimated(44)),             elementKind: PinnedSectionHeaderFooterViewController.sectionFooterElementKind,             alignment: .bottom)         sectionHeader.pinToVisibleBounds = true         sectionHeader.zIndex = 2         section.boundarySupplementaryItems = [sectionHeader, sectionFooter]         let layout = UICollectionViewCompositionalLayout(section: section)         let layoutHeaderHeader = NSCollectionLayoutBoundarySupplementaryItem(             layoutSize: NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                               heightDimension: .estimated(44)),             elementKind: PinnedSectionHeaderFooterViewController.layoutHeaderElementKind,             alignment: .top)         let configuration = UICollectionViewCompositionalLayoutConfiguration()         layoutHeaderHeader.pinToVisibleBounds = true         configuration.boundarySupplementaryItems = [layoutHeaderHeader]         layout.configuration = configuration         return layout     } This is an adapted part of the code provided by this example: https://developer.apple.com/documentation/uikit/views_and_controls/collection_views/implementing_modern_collection_views
Topic: UI Frameworks SubTopic: UIKit Tags:
2
0
1.4k
Sep ’21
UICollectionViewCompositionalLayout pinned headers break with section that have orthogonalScrollingBehavior
When using UICollectionViewCompositionalLayout and creating a layout that supports pinned supplementary items and additionally having a section that has orthogonalScrollingBehavior the pinned header will disappear as soon as you scroll over the section with the orthogonalScrollingBehavior. A simple layout that demonstrates how it breaks looks like this     func createLayout() -> UICollectionViewLayout {         let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                              heightDimension: .fractionalHeight(1.0))         let item = NSCollectionLayoutItem(layoutSize: itemSize)         let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                               heightDimension: .absolute(44))         let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize, subitems: [item])         let section = NSCollectionLayoutSection(group: group)         section.interGroupSpacing = 5         section.orthogonalScrollingBehavior = .continuous         section.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10)         let sectionHeader = NSCollectionLayoutBoundarySupplementaryItem(             layoutSize: NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                               heightDimension: .estimated(44)),             elementKind: PinnedSectionHeaderFooterViewController.sectionHeaderElementKind,             alignment: .top)         let sectionFooter = NSCollectionLayoutBoundarySupplementaryItem(             layoutSize: NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                               heightDimension: .estimated(44)),             elementKind: PinnedSectionHeaderFooterViewController.sectionFooterElementKind,             alignment: .bottom)         sectionHeader.pinToVisibleBounds = true         sectionHeader.zIndex = 2         section.boundarySupplementaryItems = [sectionHeader, sectionFooter]         let layout = UICollectionViewCompositionalLayout(section: section)         let layoutHeaderHeader = NSCollectionLayoutBoundarySupplementaryItem(             layoutSize: NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                               heightDimension: .estimated(44)),             elementKind: PinnedSectionHeaderFooterViewController.layoutHeaderElementKind,             alignment: .top)         let configuration = UICollectionViewCompositionalLayoutConfiguration()         layoutHeaderHeader.pinToVisibleBounds = true         configuration.boundarySupplementaryItems = [layoutHeaderHeader]         layout.configuration = configuration         return layout     } This is an adapted part of the code provided by this example: https://developer.apple.com/documentation/uikit/views_and_controls/collection_views/implementing_modern_collection_views
Topic: UI Frameworks SubTopic: UIKit Tags:
Replies
2
Boosts
0
Views
1.4k
Activity
Sep ’21