iOS'taki Composition Layout ve karmaşık kullanıcı…

Kümelenebilir Düzen, iOS 13 ile tanıtılan koleksiyon düzenleri (UICollectionView) oluşturmak için esnek bir mekanizmadır. Bölüm ve öğelerin yapısını deklaratif olarak tanımlamaya olanak tanır ve karmaşık ve uyarlanabilir kullanıcı arayüzlerinin oluşturulmasını basitleştirir.

Ana avantajlar:

Bileşenlerden Oluşma: Düzen, daha küçük parçalardan (öğeler, gruplar, bölümler) oluşur.
Esneklik: Aynı koleksiyonda liste, ızgara, dikey/yatay kaydırmalı gruplar gibi farklı düzen türlerini destekler.
Uyarlanabilirlik: Ekran boyutu ve cihaz yönlendirmesine kolayca uyum sağlar.
Deklaratiflik: Düzen tanımı, geleneksel UICollectionViewFlowLayout ile karşılaştırıldığında daha anlaşılır ve ifade gücü yüksektir.
Performans: Çok sayıda öğeyle çalışmak üzere optimize edilmiştir.

Ana bileşenler:

NSCollectionLayoutItem: Koleksiyondaki öğeyi tanımlar. Konteyner grubuna göre boyutunu belirler.
NSCollectionLayoutGroup: Öğeleri içeren grubu tanımlar. Dikey, yatay veya özel olabilir. Grubun boyutunu, içeren bölümle ilişkili olarak belirler.
NSCollectionLayoutSection: Koleksiyondaki bölümü tanımlar. Grupları içerir ve düzenlerini yönetir. Bölüm davranışını belirler (örneğin, kaydırma).
NSCollectionLayoutBoundarySupplementaryItem: Bölüme ek öğeler eklemek için kullanılır (başlıklar, altbilgiler).
UICollectionViewCompositionalLayout: Bölümleri son düzen halinde toplayan düzen sınıfı.

Yatay kaydırmalı basit bir bölüm oluşturma örneği:

import UIKit

func createLayout() -> UICollectionViewLayout {
    // Öğe
    let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),
                                         heightDimension: .fractionalHeight(1.0))
    let item = NSCollectionLayoutItem(layoutSize: itemSize)

    // Grup
    let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(0.9),
                                          heightDimension: .absolute(200))
    let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize,
                                                    subitems: [item])
    group.interItemSpacing = .fixed(10) // Öğeler arasındaki boşluk

    // Bölüm
    let section = NSCollectionLayoutSection(group: group)
    section.orthogonalScrollingBehavior = .continuous // Bölümde yatay kaydırma
    section.contentInsets = NSDirectionalEdgeInsets(top: 10, leading: 10, bottom: 10, trailing: 10) // Bölüm kenar boşlukları
    section.interGroupSpacing = 10 // Bölümdeki gruplar arasındaki boşluk

    // Düzen
    let layout = UICollectionViewCompositionalLayout(section: section)
    return layout
}

Daha karmaşık arayüzler oluşturmak için farklı grup ve bölüm türlerini birleştirebilir, dekoratif öğeler ekleyebilir ve ek öğeler kullanabilirsiniz.

Kümelenebilir Düzen, Diffable Data Sources (UICollectionViewDiffableDataSource) ile yakından ilişkilidir ve bu, koleksiyon verilerinin yönetimini ve değişikliklerin animasyonunu kolaylaştırır. Bu iki teknolojinin birleşimi, modern, verimli ve kolay bakım yapılabilir kullanıcı arayüzleri oluşturmayı sağlar.

iOS'taki Composition Layout ve karmaşık kullanıcı arayüzleri oluşturmak için kullanımı hakkında konuşun.