iOS'dagi Composition Layout va uning murakkab…

Kümelenebilir Layout, iOS 13-da təqdim olunan kolleksiya düzənlərinin (UICollectionView) yaradılması üçün çevik mexanizmdir. Bu, bölmələr və elementlərin strukturunu deklarativ şəkildə təsvir etməyə imkan verir və mürəkkəb və uyğunlaşa bilən istifadəçi interfeyslərinin yaradılmasını sadələşdirir.

Əsas üstünlüklər:

Bloklardan quruluş: Layout, kiçik hissələrdən (elementlər, qruplar, bölmələr) ibarətdir.
Çeviklik: Müxtəlif növ layoutları (siyahılar, şəbəkələr, şaquli/yatay sürüşmə ilə qruplar) dəstəkləyir.
Uyğunlaşma: Ekran ölçüsü və cihazın istiqamət dəyişikliklərinə asanlıqla uyğunlaşır.
Deklarativlik: Layout-un təsviri ənənəvi UICollectionViewFlowLayout ilə müqayisədə daha anlaşılan və ifadəli olur.
Performans: Çox sayda elementlə işləmək üçün optimallaşdırılıb.

Əsas komponentlər:

NSCollectionLayoutItem: Kolleksiyadakı elementi təsvir edir. Onun ölçüsünü konteyner qrupuna görə müəyyən edir.
NSCollectionLayoutGroup: Elementlər qrupunu təsvir edir. Vertikal, horizontal və ya xüsusi ola bilər. Qrupun ölçüsünü onun daxil olduğu bölməyə görə müəyyən edir.
NSCollectionLayoutSection: Kolleksiyadakı bölməni təsvir edir. Qrupları ehtiva edir və onların yerləşdirilməsini idarə edir. Bölmənin davranışını müəyyən edir (məsələn, sürüşmə).
NSCollectionLayoutBoundarySupplementaryItem: Bölməyə əlavə elementlər əlavə etmək üçün istifadə olunur (başlıqlar, altbilgilər).
UICollectionViewCompositionalLayout: Bölmələri yekun layout-ə toplayan layout sinfi.

Yatay sürüşmə ilə sadə bölmə yaratma nümunəsi:

import UIKit

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

    // Qrup
    let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(0.9),
                                          heightDimension: .absolute(200))
    let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize,
                                                    subitems: [item])
    group.interItemSpacing = .fixed(10) // Elementlər arasındakı məsafə

    // Bölmə
    let section = NSCollectionLayoutSection(group: group)
    section.orthogonalScrollingBehavior = .continuous // Yatay sürüşmə
    section.contentInsets = NSDirectionalEdgeInsets(top: 10, leading: 10, bottom: 10, trailing: 10) // Kənar boşluqları
    section.interGroupSpacing = 10 // Qruplar arasındakı məsafə

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

Daha mürəkkəb interfeyslər yaratmaq üçün müxtəlif qrup və bölmə növlərini birləşdirə, dekorativ elementlər əlavə edə və əlavə elementlərdən istifadə edə bilərsiniz.

Kümelenebilir Layout, Diffable Data Sources (UICollectionViewDiffableDataSource) ilə sıx əlaqəlidir və bu, kolleksiya məlumatlarının idarə olunmasını və dəyişikliklərin animasiyasını asanlaşdırır. Bu iki texnologiyanın birləşməsi müasir, səmərəli və asan saxlanılan istifadəçi interfeyslərinin yaradılmasına imkan verir.

iOS'dagi Composition Layout va uning murakkab foydalanuvchi interfeyslarini yaratish uchun foydalanilishi haqida gapiring.