Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
これからUICollectionViewを実践活用する人のためのガイド / Guide to ...
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
USAMI Kosuke
July 12, 2023
Programming
830
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
これからUICollectionViewを実践活用する人のためのガイド / Guide to UICollectionView
※ Docswell に移行しました
https://www.docswell.com/s/usami-k/5W1L3X-guide-to-uicollectionview
USAMI Kosuke
July 12, 2023
More Decks by USAMI Kosuke
See All by USAMI Kosuke
Onsager代数とその周辺 / Onsager algebra tsudoi
usamik26
0
720
Apple HIG 正式名称クイズ結果発表 / HIG Quiz Result
usamik26
0
280
ゆめみ大技林製作委員会の立ち上げの話 / daigirin project
usamik26
0
410
@ViewLoadingプロパティラッパの紹介と自前で実装する方法 / @ViewLoading property wrapper implementation
usamik26
0
560
Xcodeとの最近の付き合い方のはなし / Approach To Xcode
usamik26
2
740
UICollectionView Compositional Layout
usamik26
0
890
Coding Swift with Visual Studio Code and Docker
usamik26
0
600
Swift Extension for Visual Studio Code
usamik26
2
1.2k
ソリトンとリー代数 / soliton history
usamik26
0
990
Other Decks in Programming
See All in Programming
実装をデザインガイドラインに追従させるための取り組み / 260731-dip-mosh-design-system
dachi023
0
7.8k
DynamoDBの基礎を振り返りながらベクトル検索機能を理解する
musan
2
200
AWS DevOps AgentのAzure接続機能を検証して見えた活用法/Use Cases Verified for the AWS DevOps Agent's Azure Connectivity Feature
masakiokuda
1
270
Hono + Inertia + React で LP を構築した話
oukayuka
2
160
書籍「プロフェッショナルAI駆動開発」紹介スライド
juntaromatsumoto
0
550
Flow は今どうなっているか
mizdra
PRO
0
710
言葉の格闘技のススメ~紙とペンと言葉から始める、キャリアの描き方~
progresscicada
2
180
170k Jobs a Day on GKE: Scaling Mercari's CI Platform - and What's Next for AI-Native Development
junyaokabe
0
120
Claude CodeとAgentCore Gatewayを繋ぐ際の認証認可 / Authentication and authorization when connecting Claude Code with AgentCore Gateway
har1101
2
380
komatsuna「分散システムにおけるバグ分析手法」
komatsunaqa
0
280
Go を使い始めて 2 ヶ月の学び / My first two months with Go
contour_gara
0
380
Go 1.27からのGODEBUG / Go 1.27 リリースパーティ #go127party
mazrean
0
220
Featured
See All Featured
The browser strikes back
jonoalderson
0
1.5k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
3k
Game over? The fight for quality and originality in the time of robots
wayneb77
1
250
Efficient Content Optimization with Google Search Console & Apps Script
katarinadahlin
PRO
1
810
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
67k
Balancing Empowerment & Direction
lara
6
1.2k
Leo the Paperboy
mayatellez
8
2.2k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
10k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.6k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3.7k
Transcript
これからUICollectionViewを 実践活用する人のためのガイド 宇佐見公輔 / 株式会社ゆめみ 2023-07-12 これからUICollectionViewを実践活用する人のためのガイド 1
自己紹介 宇佐見公輔(うさみこうすけ) 株式会社ゆめみ / iOSテックリード 大阪在住 iOSDC Japan 2023 パンフレット記事採択
→ 入稿済 9月に現地参加予定 これからUICollectionViewを実践活用する人のためのガイド 2
今日の内容 UICollectionViewの学びかたを整理し て話します (ポスターセッションで応募しました が、残念ながら不採択でした) これからUICollectionViewを実践活用する人のためのガイド 3
UICollectionViewとは iOS 6で登場 グリッド表示のUIコンポーネント コンテンツの配置が柔軟に行える その柔軟性ゆえに実装の難易度は高め iOS 13〜14で、モダンなAPI群が追加 された これからUICollectionViewを実践活用する人のためのガイド
4
構成要素:UITableViewの場合 Data Source Cell 画面に表示されるぶんだけのデータを取得してセルを生成する仕組み これからUICollectionViewを実践活用する人のためのガイド 5
構成要素:UICollectionView Layout Data Source Cell UITableViewに加えて、グリッド表示などのレイアウトが追加 これからUICollectionViewを実践活用する人のためのガイド 6
実装のための基本 Layout UICollectionViewLayout クラスのサブクラス Data Source UICollectionViewDataSource プロトコルの実装クラス Cell UICollectionViewCell
クラスのサブクラス これからUICollectionViewを実践活用する人のためのガイド 7
レイアウト UICollectionViewLayout クラスのサブクラス ただし、自前で実装するのは大変 標準で UICollectionViewCompositionalLayout が用意されている これでほとんどのレイアウトは実現できる(iOS 13以降) 参考:以前は
UICollectionViewFlowLayout が標準だった 現在も使えるがオススメしない これからUICollectionViewを実践活用する人のためのガイド 8
データソース UICollectionViewDataSource プロトコルの実装クラス 自前で実装するのも難しくない 標準で UICollectionViewDiffableDataSource が用意されている 差分更新の仕組みがあって高機能(iOS 13以降) ただし、使うために学ぶことが少し多い
これからUICollectionViewを実践活用する人のためのガイド 9
セル UICollectionViewCell クラスのサブクラス 自前で実装するのも難しくはない セルの登録・再利用の仕組みも知る必要がある UIContentView と UIContentConfiguration が用意されている セルの実装を安全にする(iOS
14以降) CellRegistration が用意されている セルの登録・再利用の仕組みを安全にする(iOS 14以降) これからUICollectionViewを実践活用する人のためのガイド 10
学ぶ順番:最初のステップ まずは最小限の実装でUICollectionViewを動かす 動かすために必要な要素を少ない労力で揃える これからUICollectionViewを実践活用する人のためのガイド 11
学ぶ順番:最初のステップ Layout UICollectionViewCompositionalLayout の最小限の利用 Data Source 最初は UICollectionViewDataSource プロトコルを自前実装する のがわかりやすい
Cell 最初は UICollectionViewCell のサブクラスを自前実装するのが わかりやすい これからUICollectionViewを実践活用する人のためのガイド 12
学ぶ順番:次のステップ (1) Data Source UICollectionViewDataSource プロトコルの自前実装をやめて、 UICollectionViewDiffableDataSource を使う Diffable Data
Sourceに必要な概念を学ぶ Identifiable / Hashable / Equatable スナップショット これからUICollectionViewを実践活用する人のためのガイド 13
学ぶ順番:次のステップ (2) Cell セルの登録・再利用に CellRegistration を使う セルの実装に UIContentView と UIContentConfiguration
を使う これからUICollectionViewを実践活用する人のためのガイド 14
学ぶ順番:次のステップ (3) Layout UICollectionViewCompositionalLayout をより詳しく学ぶ グループのネスト セクション、アイテムの装飾 これからUICollectionViewを実践活用する人のためのガイド 15
宣伝 UICollectionViewの本を書きました BOOTH、Zennなどで販売中 書ききれなかった内容もあるので、 続編を検討中・・・ これからUICollectionViewを実践活用する人のためのガイド 16