Zenn
Open1

Xcode UIKit チュートリアルを一通りやってみる 2. CollectionViewとナビゲーション

ぽちぽち

Collection View を導入する

UIKitでは、関連アイテムをスクロール可能なViewでセルとして効率的に表示するUICollectionクラスを提供する。

最新のCollectionViewは、データの状態変更を自動的にアニメーション化する。
UIKitは、CollectionViewを作成・更新するために、下記の3つを提供

  • Diffable Data Source (Data)
  • Compositional Layout (Layout)
  • ListCellViewConfiguration (Presentation)

Diffable Data Source の作成

CollectionViewは、多くのLayoutとPresentationの責任を処理してくれるため、開発者側はData管理に集中できる。
Collection ViewとCell ProviderをData Sourceのinit (collectionView: cellProvider:) 初期化子に渡すことで、インスタンスを作成できる。

Cell Providerは、再利用可能なセルのプールからセルを取得し、configurationを使用してコンテンツとスタイリングを追加する関数。

cell configuration の定義

Collection Viewは、必要に応じてCell Providerからセルを要求する。
Collection Viewは、画面外にスクロールするセルを自動的にリサイクルするので、
アプリが作成する必要があるセルはほんの少数だけで済む。
こうすることで、スムーズなスクロールとアプリのメモリ削減を実現している。
 
UICollection には、3つの設定プロパティがある

  • contentConfiguration - セルのラベル、画像、ボタンなどを記述
  • backgroundConfiguration - セルの背景色、グラデーション、画像、その他の視覚的属性を記述
  • configurationState - ユーザーが選択・ドラッグなどの操作を行った時のセルのスタイルを記述
     
    いずれの場合も、一時的にデフォルトのcell configurationを作成し、そこからプロパティを変更・設定してから、configurationプロパティをセルへ割り当て直す。
     
    デフォルトのcell configurationには、基本テキスト・二次テキスト、画像プロパティが含まれている。
     

Data Sourceのスナップショットの生成

Collection Viewに関連づけられたdiffable data sourceは、'NSDiffableDataSourceSnapshot'インスタンスを使用することで、特定の時点でのデータ状態を表す。
Collection Viewが最初に読み込まれる時とアプリのデータが変更されるたびに、新しいスナップショットを作成。

続きはあとで