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
a lighter reusable cell
Search
Pin-Shih Wang
October 01, 2012
Programming
0
60
a lighter reusable cell
for TableView & CollectionView
https://github.com/wpsteak/MVCTableViewExample
Pin-Shih Wang
October 01, 2012
Tweet
Share
More Decks by Pin-Shih Wang
See All by Pin-Shih Wang
iOS Extension
wpsteak
4
470
A tip for using magical record
wpsteak
0
130
CI with Git Flow
wpsteak
2
240
Test With Xcode Server
wpsteak
0
81
Other Decks in Programming
See All in Programming
AIで開発生産性を上げる個人とチームの取り組み
taniigo
0
130
Django Ninja による API 開発効率化とリプレースの実践
kashewnuts
0
890
GitHub Actions × AWS OIDC連携の仕組みと経緯を理解する
ota1022
0
230
アメ車でサンノゼを走ってきたよ!
s_shimotori
0
130
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう! #FEC余熱NIGHT
izumin5210
3
340
(Extension DC 2025) Actor境界を越える技術
teamhimeh
1
210
Serena MCPのすすめ
wadakatu
4
870
Reduxモダナイズ 〜コードのモダン化を通して、将来のライブラリ移行に備える〜
pvcresin
2
670
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
480
Playwrightはどのようにクロスブラウザをサポートしているのか
yotahada3
7
2.2k
LLMとPlaywright/reg-suitを活用した jQueryリファクタリングの実際
kinocoboy2
4
660
Pythonスレッドとは結局何なのか? CPython実装から見るNoGIL時代の変化
curekoshimizu
4
1.2k
Featured
See All Featured
Site-Speed That Sticks
csswizardry
11
870
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
960
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.9k
It's Worth the Effort
3n
187
28k
Building an army of robots
kneath
306
46k
Optimising Largest Contentful Paint
csswizardry
37
3.4k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
Side Projects
sachag
455
43k
Transcript
a lighter reusable cell for TableView & CollectionView @wpsteak
None
TableView
ViewController TableView
ViewController TableView DataSource
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells? TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells? Add/remove subview every time? TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells? Add/remove subview every time? TableCell
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get Cell
Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells? Add/remove subview every time? TableCell <reuse>
Step1 move logic into cell
None
TableView
ViewController TableView
ViewController TableView DataSource
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells?
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells?
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells?
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells? Add/remove subview every time?
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells? Add/remove subview every time? <reuse>
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells? <reuse>
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon return Cell 10 Cells? 100 Cells? 1000 Cells? <reuse> prepareForReuse
Step2 split logics
TableViewCell / CollectionViewCell • Init UI • PrepareForReuse (reset UI)
• SetupContent with DataModel (set data)
None
Controller
Model Controller
Model Controller PrepareDataList Model Model Model
TableCell Model Controller PrepareDataList Model Model Model
TableCell Model Controller PrepareDataList Model Model Model SetupContent Model Update
UI
TableCell Model Controller PrepareDataList Model Model Model prepare data handle
user interaction data display SetupContent Model Update UI
- (void)initControl { init UI… } - (void)setupContent:(id)data { update
UI with new content } - (void)prepareForReuse { [super prepareForReuse]; reset UI reset logic } Sample
None
TableView
ViewController TableView
ViewController TableView DataSource
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource
ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell (init Control at first time) Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell (init Control at first time) Create UILabel1 Create UILabel2 Create Image1 Create Image2 Create Icon set Data
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell prepareForReuse setup Content update UI set Data
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell return Cell prepareForReuse setup Content update UI set Data
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell return Cell prepareForReuse setup Content update UI set Data
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell return Cell 10 Cells prepareForReuse setup Content update UI set Data
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell return Cell 10 Cells 100 Cells prepareForReuse setup Content update UI set Data
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell return Cell 10 Cells 100 Cells 1000 Cells prepareForReuse setup Content update UI set Data
TableCell ViewController - (UITableViewCell *) tableView: cellForRowAtIndexPath: TableView DataSource Get
Cell return Cell 10 Cells 100 Cells 1000 Cells <reuse> prepareForReuse setup Content update UI set Data
• init UIView once and only once • reset UI
and necessary logic in prepareForReuse: method
End