Parlez de Composition Layout dans iOS et de son…

La disposition compositionnelle est un mécanisme flexible pour créer des dispositions de collections (UICollectionView), introduit dans iOS 13. Elle permet de décrire la structure des sections et des éléments de manière déclarative, simplifiant la création d'interfaces utilisateur complexes et adaptatives.

Principaux avantages :

Construction à partir de blocs : La disposition est assemblée à partir de parties plus petites (items, groupes, sections).
Flexibilité : Supporte différents types de dispositions (listes, grilles, groupes avec défilement vertical/horizontal) dans une même collection.
Adaptabilité : S'ajuste facilement aux changements de taille d'écran et d'orientation de l'appareil.
Déclarativité : La description de la disposition est plus compréhensible et expressive comparée à UICollectionViewFlowLayout traditionnel.
Performance : Optimisée pour gérer un grand nombre d'éléments.

Composants clés :

NSCollectionLayoutItem : Décrit un élément dans la collection. Définit sa taille par rapport à son groupe conteneur.
NSCollectionLayoutGroup : Décrit un groupe d'éléments. Peut être vertical, horizontal ou personnalisé. Définit la taille du groupe par rapport à sa section conteneur.
NSCollectionLayoutSection : Décrit une section dans la collection. Contient des groupes et gère leur disposition. Définit le comportement de la section (par exemple, défilement).
NSCollectionLayoutBoundarySupplementaryItem : Utilisé pour ajouter des éléments supplémentaires à la section (en-têtes, pieds de page).
UICollectionViewCompositionalLayout : Classe de disposition qui assemble les sections en la disposition finale.

Exemple de création d'une section simple avec défilement horizontal :

import UIKit

func createLayout() -> UICollectionViewLayout {
    // Élément
    let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),
                                         heightDimension: .fractionalHeight(1.0))
    let item = NSCollectionLayoutItem(layoutSize: itemSize)

    // Groupe
    let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(0.9),
                                          heightDimension: .absolute(200))
    let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize,
                                                    subitems: [item])
    group.interItemSpacing = .fixed(10) // Espacement entre éléments dans le groupe

    // Section
    let section = NSCollectionLayoutSection(group: group)
    section.orthogonalScrollingBehavior = .continuous // Défilement horizontal de la section
    section.contentInsets = NSDirectionalEdgeInsets(top: 10, leading: 10, bottom: 10, trailing: 10) // Marges de la section
    section.interGroupSpacing = 10 // Espacement entre les groupes dans la section

    // Disposition
    let layout = UICollectionViewCompositionalLayout(section: section)
    return layout
}

Pour créer des interfaces plus complexes, il est possible de combiner différents types de groupes et de sections, d'ajouter des éléments décoratifs et d'utiliser des éléments supplémentaires.

Le layout compositionnel est étroitement lié aux sources de données diffables (UICollectionViewDiffableDataSource), ce qui facilite la gestion des données de la collection et l'animation des changements. La combinaison de ces deux technologies permet de créer des interfaces modernes, efficaces et faciles à maintenir.

Parlez de Composition Layout dans iOS et de son utilisation pour créer des interfaces utilisateur complexes.