Compositional LayoutsをTableView的に扱う

公開:2020/12/22
更新:2020/12/26
1 min読了の目安(約1100字TECH技術記事

WWDC2019で発表されたCompositional Layoutsを使っていてハマったので残します..!

Compositional Layoutsを使うと?

Collection View Layouts make it easy to build rich interactive collections. Learn how to make dynamic and responsive layouts that range in complexity from basic lists to an advanced, multi-dimensional browsing experience.

なるほど🤔
iOS13~なのでそろそろ本格的に使っていけそうですね。
UICollectionViewCompositionalLayoutセッション動画に詳細があります。

補足
UICollectionLayoutListConfigurationはiOS14からの利用になるのでiOS13などサポートしている場合はどうすれば良いのか工夫が必要そうです💦

何にハマったのか

1カラムなリストを作ったとときCellの高さをSelf-Sizingできず🙄となりました。

原因

1カラムなだけでレイアウトはコレクションビューとして扱っていました...。

Compositional Layoutsを使いつつSelf-Sizingさせるには

セクションを作るときのconfigurationをリスト用にしてあげれば良い。

...
var configuration = UICollectionLayoutListConfiguration(appearance: .plain)
configuration.showsSeparators = false
let section = NSCollectionLayoutSection.list(using: configuration, layoutEnvironment: layoutEnvironment)
...

セクション毎にコレクションだったり、1カラムなリストだったりと作っていくときにも便利だったのでどんどん活用していきたいと思います。
地味に長い間ハマっていたので同じことが起きませんように🙏