UIColletionViewCompositionalLayoutによるカスタムレイアウトの実装例 by Kishikawa Katsumi

iOSDC Japan 2020
採択
原稿(8ページ)

UIColletionViewCompositionalLayoutによるカスタムレイアウトの実装例

k_katsumi Kishikawa Katsumi k_katsumi
15

UICollectionViewCompositionalLayoutはiOS 13から新しく導入されたAPIです。このAPIを使うと、AppStoreアプリや写真アプリのような、異なる大きさのセルが混在したり縦スクロールの途中に横スクロールが出現するような、iOS 12以前では1つのセルに複雑なサブビューを配置したり、セルの上に別のコレクションビューを組み合わせたりということが必要だった非常に難しいUIが簡単に作れるようになります。

実際に昨年のWWDCでAppleは、AppStoreアプリのUIをこのAPIを利用して書き直すことでかなりの量のコードを削減し、シンプルでメンテナンスしやすい実装にできたと話しています。

私はこのAPIが出てきたことにより、ほとんどのUIはコレクションビューで作ればよいと考えるほどに、すばらしく柔軟で拡張性のあるレイアウトシステムだと考えています。

しかし非常にシンプルで強力というAPIなので、1つのレイアウトを複数の方法で記述できますが、まだまだ情報が少ないためより良い書き方はどれかということがわからないこともあります。
さまざまなUIをシンプルに記述することができますが、不可能なことやこのAPIを使わない別のやり方の方が望ましいケースももちろんあります。

今どきのアプリで実際に使われている複雑なレイアウトを例にこのAPIを使って実装し、ベストプラクティスや逆にあまり向いていないケースはどういうことがあるか、などについて解説します。
UIColletionViewCompositionalLayoutを使用すべきときとそうでないとき、使用する場合のレイアウトごとのより良い実装をサンプルコードを通じて学びましょう。