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
Epoxyを用いたレイアウト構築術
Search
kobayashi_kento
August 27, 2019
Programming
1
200
Epoxyを用いたレイアウト構築術
8/27(火)に開催された pixiv App Night(ゲスト: Bitrise) での発表資料です
kobayashi_kento
August 27, 2019
Tweet
Share
More Decks by kobayashi_kento
See All by kobayashi_kento
Compose駆動開発のためのマルチモジュール化
kobaken0029
0
170
DataStoreを導入してみた
kobaken0029
1
250
Androidエンジニアが1週間でiOSアプリ開発を学び、1ヶ月で大規模アプリ開発にJOINした話
kobaken0029
0
2.9k
Modern REST Communicate for Android
kobaken0029
0
1.5k
AndroidでモダンREST通信してみたった
kobaken0029
0
250
Other Decks in Programming
See All in Programming
The Sequel to a Dream of Ruby Parser's Grammar
ydah
1
220
LangChainでWebサイトの内容取得やGitHubソースコード取得
shukob
0
160
オートマトン学習しろ / Do automata learning
makenowjust
3
130
実践!難読化ガイド
mitchan
0
250
GoのIteratorに詳しくなってしまう
inatonix
1
210
開発を加速する共有Swift Package実践
elmetal
PRO
0
420
Findy - エンジニア向け会社紹介 / Findy Letter for Engineers
findyinc
4
90k
いつか使える ObjectSpace / Maybe useful ObjectSpace
euglena1215
2
140
Go1.23で入った errorsパッケージの小さなアプデ
kuro_kurorrr
2
400
LangGraphでのHuman-in-the-Loopの実装
os1ma
3
1.1k
上手に付き合うコンポーネントテスト
quramy
1
260
Modern Angular with the NGRX Signal Store New Rules for Your Architecture @BASTA! 2024 in Mainz
manfredsteyer
PRO
0
170
Featured
See All Featured
Designing on Purpose - Digital PM Summit 2013
jponch
114
6.8k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
8.9k
How To Stay Up To Date on Web Technology
chriscoyier
786
250k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
123
18k
Pencils Down: Stop Designing & Start Developing
hursman
119
11k
Happy Clients
brianwarren
96
6.6k
Intergalactic Javascript Robots from Outer Space
tanoku
268
26k
Typedesign – Prime Four
hannesfritz
39
2.3k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
190
16k
Building a Modern Day E-commerce SEO Strategy
aleyda
36
6.8k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
326
21k
Transcript
EpoxyΛ༻͍ͨϨΠΞτߏஙज़ pixiv.inc kobaken
kobaken ϐΫγϒגࣜձࣾ AndroidΞϓϦΤϯδχΞ Kotlin / Swift / Ruby
༏ / εϚϒϥ / ϙέΧ Twitter: @koba_dog_ GitHub: @kobaken0029
ɾEpoxyͬͯԿʁ ɾྨࣅϥΠϒϥϦʁ ɾEpoxyΛ͏ͱͲ͏ศརʹͳΔʁ ɾpixiv Sketch AndroidͰͷ׆༻ࣄྫ Index
EpoxyͬͯԿʁ
EpoxyͬͯԿʁ RecyclerView(ϦετάϦουදࣔʹ͏)ʹΑΔෳࡶͳϨΠΞτΛએݴతʹ ߏஙग़དྷΔAndroidϥΠϒϥϦɻAirbnbɻ https://github.com/airbnb/epoxy
ྨࣅϥΠϒϥϦʁ
ྨࣅϥΠϒϥϦʁ RecyclerViewΛ͍͍ײ͡ʹ͢Δܥ ɾGroupie એݴతʹUIΛΈཱͯΒΕΔܥ ɾKotlin/anko ɾJetpack Compose ɾsquare/contour←NEW!
એݴతʹUIΛΈཱͯΒΕΔܥ ɾSwiftUI
Ͱɺ࣮ࡍͲ͏ศརʹͳΔͷʁʁʁ
EpoxyΛ͏ͱͲ͏ศརʹͳΔʁ ɾAdapterΛॻ͔ͳ͍͍ͯ͘ʂˡ͜Ε͖͢ ɾࠩཧΛࣗಈͰͬͯ͘ΕΔʂˡ͜Ε͖͢ ɾData Binding ʹରԠ ɾศརͳΞυΦϯ͕ͨ͘͞Μʂ
EpoxyΛ͏ͱͲ͏ศརʹͳΔʁ ɾAdapterΛॻ͔ͳ͍͍ͯ͘ʂˡ͜Ε͖͢ ɾࠩཧΛࣗಈͰͬͯ͘ΕΔʂˡ͜Ε͖͢ ɾData Binding ʹରԠ ɾศརͳΞυΦϯ͕ͨ͘͞Μʂ
Adapter
%BUB4PVSDF -JTU "EBQUFS -JTU7JFX
σʔλ͕ViewʹΘΔ Α͏ʹ͍͍ײ͡ʹม ͯ͘͠ΕΔౕ
Ϧετදࣔ͢ΔͨΊͷ࠷খίʔυ
Ϧετදࣔ͢ΔͨΊͷ࠷খίʔυ
CustomAdapterͷ࣮
RecyclerView.Adapter with ViewTypeͷ࣮
&QPYZ͍ͬͯ͏ͷ͕͋ΔΑʂ ͔ΜͨΜͩΑʂ ΈΜͳͬͯΔΑʂ
Epoxyͩͱ͜͏
EpoxyΛ͏ͱͲ͏ศརʹͳΔʁ ɾAdapterΛॻ͔ͳ͍͍ͯ͘ʂˡ͜Ε͖͢ ɾࠩཧΛࣗಈͰͬͯ͘ΕΔʂˡ͜Ε͖͢ ɾData Binding ʹରԠ ɾศརͳΞυΦϯ͕ͨ͘͞Μʂ
EpoxyΛ͏ͱͲ͏ศརʹͳΔʁ ɾAdapterΛॻ͔ͳ͍͍ͯ͘ʂˡ͜Ε͖͢ ɾࠩཧΛࣗಈͰͬͯ͘ΕΔʂˡ͜Ε͖͢ ɾData Binding ʹରԠ ɾศརͳΞυΦϯ͕ͨ͘͞Μʂ
ࠩཧ ɾEpoxyController͕ࣗಈͰࠩΛऔͬͯ͘ΕΔ ɾͦ͜Ͱੜ͢ΔEpoxyModelͷequalshashCodeΛࢀর͍ͯ͠Δ ɾࠩߋ৽ΞϧΰϦζϜʹDiffUtilΛ࠾༻ ɾhttps://github.com/airbnb/epoxy/wiki/Diffing
EpoxyΛ͏ͱͲ͏ศརʹͳΔʁ ɾAdapterΛॻ͔ͳ͍͍ͯ͘ʂˡ͜Ε͖͢ ɾࠩཧΛࣗಈͰͬͯ͘ΕΔʂˡ͜Ε͖͢ ɾData Binding ʹରԠ ɾศརͳΞυΦϯ͕ͨ͘͞Μʂ
EpoxyΛ͏ͱͲ͏ศརʹͳΔʁ ɾAdapterΛॻ͔ͳ͍͍ͯ͘ʂˡ͜Ε͖͢ ɾࠩཧΛࣗಈͰͬͯ͘ΕΔʂˡ͜Ε͖͢ ɾData Binding ʹରԠ ɾศརͳΞυΦϯ͕ͨ͘͞Μʂ
EpoxyModelͱ EpoxyEpoxyModelΛհͯ͠ViewʹDataΛόΠϯυ͍ͯ͠Δ EpoxyModelࣗಈੜ͞ΕΔ EpoxyModelΛੜ͢Δํ๏3ͭ ɾCustomViewʹରͯ͠ΞϊςʔγϣϯΛ༩͢Δ ɾEpoxyModelWithHolderΛܧঝͯ͠ΞϊςʔγϣϯΛ༩͢Δ ɾpackage-info.javaΛهड़ͯ͠xmlΛData BindingରԠ͢Δ
Data BindingʹରԠ ɾ֤ηϧʹؔͯ͠େମͷ߹ɺxmlͷΈͰ݁Ͱ͖Δ ɾCustomViewΛ࡞Βͳͯ͘ྑ͍ ɾࠐΈೖͬͨॲཧBindingAdapterͰΓग़͢
EpoxyΛ͏ͱͲ͏ศརʹͳΔʁ ɾAdapterΛॻ͔ͳ͍͍ͯ͘ʂˡ͜Ε͖͢ ɾࠩཧΛࣗಈͰͬͯ͘ΕΔʂˡ͜Ε͖͢ ɾData Binding ʹରԠ ɾศརͳΞυΦϯ͕ͨ͘͞Μʂ
ศརͳΞυΦϯ ɾը૾ͷPreLoading on ɾศརʹΧελϚΠζ͞ΕͨRecyclerViewΛఏڙ ɾΧϧʔηϧ࣮ ɾεϫΠϓυϥοά&υϩοϓ
pixiv Sketch AndroidͰͷ׆༻ࣄྫ
௨ը໘
௨ը໘ ɾpackage-info.java ɾlayout xml ɾdata class ɾController ɾActivity/Fragment
package-info.java
Layout xml
Layout xml
Data class
Controller (ఆٛ)
Controller (Listener)
Controller
Activity / Fragment
ଞʹ…
ɾEpoxyෳࡶͳϦετ/ίϨΫγϣϯUIΛએݴతʹ࣮ग़དྷΔ ɾ֤row/cellͷ࣮ʹूதͰ͖Δ ɾEpoxyModelͷࠩΛݟͯɺࣗಈͰࠩߋ৽ͯ͘͠ΕΔ ɾ๛ͳΞυΦϯ͕ศར ɾEpoxy͍͍ͧ ·ͱΊ
Let’s Epoxy!