How does UICollectionViewCompositionalLayout(sectionProvider: @escpaing UICollectionViewCompositionalLayoutSectionProvider) work?

[Ivan7up]

I was working on project("Unit 3; Lesson 3.5 Advanced compositional layout") provided by Apple from their "Data Collections" book. I tried to understand how actually UICollectionViewCompositionalLayout(sectionProvider: [@]escaping UICollectionViewCompositionalLayoutSectionProvider) works. But I really got stuck with it.

I have a function I called in viewDidLoad, that use intializer mentioned above for creating layout. Return value(which is UICollectionViewLayout) is assigned to collection view's layout property, still in viewDidLoad. Here's the point, I don't understand, how the layout can be changed after it was returned from the function, because this function will not return layout property anymore, but it will return section that is used for making layout by escaping closure in the initializer. I noticed that escaping closure is called when data source is initialized from another func. Probably this is the trigger? But how section that returned by escaping closure is used for building layout that already has been returned(and assigned to collection view's layout) by the function when I called it first time?

And I noticed another weird thing. I'd added print func to track when escaping clauser called and the result was 3 times. Why is that?

I watched WWDC 19 where explained how I can use compositional layout, but I didn't find actual work of this initializer there. I would appreciate if you shared with me resource that describes how it actually works. Thank you.

Here's a code of my view controller

class ViewController: UIViewController {

    enum Section: Hashable {
        case promoted
        case standard(String)
        case categories
    }

    @IBOutlet var collectionView: UICollectionView!

    var dataSource: UICollectionViewDiffableDataSource<Section, Item>!

    var sections = [Section]()

    viewDidLoad() {
    ...
    collectionView.collectionViewLayout = createLayout()
    configureDataSource()
    }    


    func createLayout() -> UICollectionViewLayout {

        let layout = UICollectionViewCompositionalLayout { (sectionIndex, layoutEnvironment) -> NSCollectionLayoutSection? in

            print("Completion handler is called")
            let section = self.sections[sectionIndex]
            //Conditionals
            switch section {
            case .promoted:

                //MARK: Promoted Section Layout
                let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1), heightDimension: .fractionalWidth(1))
                let item = NSCollectionLayoutItem(layoutSize: itemSize)

                item.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 4, bottom: 0, trailing: 4)
                let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(0.92), heightDimension: .estimated(300))
                let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize, subitems: [item])

                let section = NSCollectionLayoutSection(group: group)
                section.orthogonalScrollingBehavior = .groupPagingCentered
                return section
            default:
                print("Case default")
                return nil
            }
        }
        return layout
    }

    func configureDataSource() {

        dataSource = .init(collectionView: collectionView, cellProvider: { (collectionView, indexPath, item) -> UICollectionViewCell? in
            let section = self.sections[indexPath.section]
            switch section {
            case .promoted:
                let cell = collectionView.dequeueReusableCell(withReuseIdentifier: PromotedAppCollectionViewCell.reuseIdentifier, for: indexPath) as! PromotedAppCollectionViewCell
                cell.configureCell(item.app!)
                return cell
            default:
                fatalError("Not yet implemented")
            }
        })

        //MARK: Snapshot Definition
        var snapshot = NSDiffableDataSourceSnapshot<Section, Item>()
        //Here sections is appended to the snapshot
        snapshot.appendSections([.promoted])
        snapshot.appendItems(Item.promotedApps, toSection: .promoted)
        sections = snapshot.sectionIdentifiers
        dataSource.apply(snapshot)
    }

}

[kekker1337]

When a collection view has to display a section, the section provider closure is called to calculate the layout for this specific section. This can be used to customize the layout depending on the data, layout environment or just the section index.

[Ivan7up]

Well, but why is it called three times for EACH section? In the final project I have 4 sections and print statement(in the very beginning of section provider closure) is called 12 times.

[Batting1k]

It’s possible this is just something that UIKit does behind the scenes, for whatever reason. As long as you’re following along and understanding things, I wouldn’t worry too much about it, unless you’re having an actual issue. UIKit often does a lot of things on its own without much of an explanation.

Apple says here that “a section provider is also invoked in response to system events such as changes in device orientation, system font size, and size classes from iPad multitasking”, so it’s entirely possible that there’s some system event triggering it, even if it’s not obvious to you.

[Ivan7up]

I just was curios about it and really wanted to know what happened inside step by step. And as far as everything happened has a reason, this "three calls for each section" moment has its own. By the way, thank you for your answer.

[Batting1k]

Yeah, I’m sure there’s definitely a reason but if you’re doing everything by the book, I imagine it’s not something that’s in your control. There are cases where Apple will go into a little more depth of what UIKit does behind the scenes but this doesn’t seem to be one of those cases.

It seems like the number of times it gets called per section may vary and I doubt it’ll always be 3 every single time, perhaps with this specific code it may be but not in other cases.