Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
What's new in UICollectionView
Search
Masaki Haga
June 13, 2019
Programming
0
760
What's new in UICollectionView
Masaki Haga
June 13, 2019
Tweet
Share
More Decks by Masaki Haga
See All by Masaki Haga
Create “Dynamic” Feeling Transition
hagmas
0
41
UIStackView Animation
hagmas
0
360
Other Decks in Programming
See All in Programming
【CA.ai #3】ワークフローから見直すAIエージェント — 必要な場面と“選ばない”判断
satoaoaka
0
240
LLM Çağında Backend Olmak: 10 Milyon Prompt'u Milisaniyede Sorgulamak
selcukusta
0
120
AWS CDKの推しポイントN選
akihisaikeda
1
240
認証・認可の基本を学ぼう後編
kouyuume
0
190
テストやOSS開発に役立つSetup PHP Action
matsuo_atsushi
0
150
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
manfredsteyer
PRO
0
130
リリース時」テストから「デイリー実行」へ!開発マネージャが取り組んだ、レガシー自動テストのモダン化戦略
goataka
0
130
堅牢なフロントエンドテスト基盤を構築するために行った取り組み
shogo4131
8
2.3k
まだ間に合う!Claude Code元年をふりかえる
nogu66
5
810
S3 VectorsとStrands Agentsを利用したAgentic RAGシステムの構築
tosuri13
6
310
モデル駆動設計をやってみようワークショップ開催報告(Modeling Forum2025) / model driven design workshop report
haru860
0
270
從冷知識到漏洞,你不懂的 Web,駭客懂 - Huli @ WebConf Taiwan 2025
aszx87410
2
2.4k
Featured
See All Featured
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.6k
Context Engineering - Making Every Token Count
addyosmani
9
500
Agile that works and the tools we love
rasmusluckow
331
21k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.6k
Building Flexible Design Systems
yeseniaperezcruz
330
39k
Music & Morning Musume
bryan
46
7k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.3k
BBQ
matthewcrist
89
9.9k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.1k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
10
720
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3k
Transcript
What’s new in UICollectionView Masaki Haga
~ iOS 12のUICollectionView - performBatchUpdate(_:completion:)を呼んでData不整合によりCrash - 親ViewControllerのViewのSizeに合わせたCellのSize指定が案外めんどくさい - 縦CollectionViewの中に横スクロールのCollectionViewを何個か入れたいが Scroll位置の保存などわりとめんどくさい
新しいUICollectionView - Data Source - Layout
Apple公式のコード Using Collection View Compositional Layouts and Diffable Data Sources
Data Source - [Old] UICollectionViewDataSource - reloadData() or performBatchUpdate(:_completion:) -
UICollectionViewDiffableDataSource & NSDiffableDataSourceSnapshot - apply() - collectionViewへの差分反映はFramework側でhandleしてもらえるようになった。
古いData Sourceの宣言 - Data Source ObjectをUICollectionViewDataSourceに準拠 - collectionViewのdatasourceにData Source Objectをset
- collectionView.reloadData()
新しいData Sourceの宣言 - UICollectionViewDiffableDataSourceをUICollectionViewとCellProviderを引数 に初期化する。(Delegate型ではなくClosure型のCallback) - State(NSDiffableDataSourceSnapshot)をapplyしてCollectionViewに反映 public typealias CellProvider
= (UICollectionView, IndexPath, ItemIdentifierType) -> UICollectionViewCell?
注意 - Snapshotに渡すSectionの値と、Itemの値はHashable - SnapshotはHashValueによって値の同一性を認識する。 - つまり、HashableのDefaultの実装だと、propertyの変更だけで違うItemであると 認識されてしまう。
こんなかんじ struct VideoCollection: Hashable { var title: String let videos:
[Video] let identifier = UUID() func hash(into hasher: inout Hasher) { hasher.combine(identifier) } }
SwiftUI - DifferenceUpdateがデフォルト - StateはHashableではなくIdentifiableに準拠する
Diffアルゴリズムはどこからくるのか UICollectionViewDiffableDataSourceの実装はわからないけれども、 Swift5.1からDiff関係のAPIが増えているのでおそらくそれらを使っているのでは。 Swift Evolution: Ordered Collection Diffing
New API - BidrectionalColleciton: difference(from:) - Swift Standard Library: CollectionDifference
- Foundation: NSOrderedCollectionDifference - _CollectionChanges
Layout - [Old] UICollectionViewFlowLayout + UICollectionViewDelegateFlowLayout - New APIs -
UICollectionViewCompositionalLayout - NSCollectionLayoutSection - NSCollectionLayoutGroup - NSCollectionLayoutItem - NSCollectionLayoutSize - Section > Group > Item
古いLayoutの宣言 - UICollectionViewFlowLayout もしくはCustom UICollectionViewLayout - Delegateからサイズ情報などを返す
新しいLayoutの宣言 - UICollectionViewCompositionalLayout - initの引数として、NSCollectionLayoutSectionか、SectionProviderというClosureを渡す。 public typealias UICollectionViewCompositionalLayoutSectionProvider = (Int,
NSCollectionLayoutEnvironment) -> NSCollectionLayoutSection? NSCollectionLayoutEnvironmentというので親CollectionViewの情報(ContentSize等)をとってくることができ る。SwiftUIでもGemetryReaderというのがあって、同じアプローチをとっているところが面白い。
Nested Collection View
Nested Collection View 縦スクロールの中の横スクロールが簡単に書けるようになった。 let section = NSCollectionLayoutSection(group: group) section.orthogonalScrollingBehavior
= .continuous UIKit側で_UICollectionViewOrthogonalScrollerEmbeddedScrollView的な ScrollViewを勝手にいれてくれる。 画面外から戻ってきてももとのContentOffsetが保存されている。
Reference - Advances in Collection View Layout - Advances in
UI Data Sources