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 / Lateinit Epoxy
Search
Sho Masegi
November 06, 2018
Technology
2
830
今更ながらEpoxy / Lateinit Epoxy
今更ながらEpoxyを触ってみました。
Sho Masegi
November 06, 2018
Tweet
Share
More Decks by Sho Masegi
See All by Sho Masegi
独自の共通認証基盤を用いているサービスでアカウント削除機能を提供したときの道程
shomasegi
1
2.5k
Migrate Swift 4.2 to 5.2
shomasegi
4
840
Material Components ことはじめ / Get Started Material Components
shomasegi
0
760
Other Decks in Technology
See All in Technology
MCPを利用して自然言語で3Dプリントしてみよう!
hamadakoji
0
1.1k
CloudBruteによる外部からのS3バケットの探索・公開の発見について / 20250605 Kumiko Henmi
shift_evolve
3
360
Text-to-SQLの評価データセットを作って最新LLMモデルの性能評価をしてみた
gotalab555
3
490
Cursor Meetup Tokyo
iamshunta
5
1.5k
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
6.7k
バクラクのモノレポにおける AI Coding のための環境整備と {Roo,Claude} Code活用事例 / AI Coding in Bakuraku's Monorepo: Environment Setup & Case Studies with {Roo, Claude} Code
upamune
7
2.8k
Eight Engineering Unit 紹介資料
sansan33
PRO
0
3.4k
Flutterアプリを⾃然⾔語で操作する
yukisakai1225
0
210
Two-Tower モデルで実現する 検索リランキング / Shibuya_AI_2
visional_engineering_and_design
2
130
Observability 入門班:可觀測性的核心技術架構與 OpenTelemetry 實作指南
unclejoe
0
240
データベースの引越しを Ora2Pg でスマートにやろう
jri_narita
0
180
AIとSREの未来 / AI and SRE
ymotongpoo
2
1.8k
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
337
57k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
25
2.8k
Making the Leap to Tech Lead
cromwellryan
134
9.3k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
180
53k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
30
2.4k
Balancing Empowerment & Direction
lara
1
110
Build The Right Thing And Hit Your Dates
maggiecrowley
35
2.7k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
22k
Embracing the Ebb and Flow
colly
85
4.7k
The Cost Of JavaScript in 2023
addyosmani
49
8.3k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
228
22k
BBQ
matthewcrist
89
9.7k
Transcript
ࠓߋͳ͕ΒEpoxy ɹ Sho Masegi
ࣗݾհ • όέπඃͬͯ·͢ɻ • େֶੜͰ͢ɻ • Androidɺ࣌ʑiOS • ࠷ۙ iOS
> Android @boc_sho
ͬͨ͜ͱ͋Δํ͍·͔͢ʁ
ກձΛଓ͚͍ͯͩ͘͞
ࠓճ͢͜ͱ • Epoxyͱʁ • Epoxyͷ؆୯ͳ͍ํ
͞ͳ͍͜ͱ • Epoxyͷ࣮ફతͳ͍ํ • ଞͷϥΠϒϥϦͱൺͯͲ͏͔
͜ͷϨΠΞτͲ͏ͬͯΉ?
͜ͷϨΠΞτͲ͏ͬͯΉ?
RecyclerView or ScrollView ?
ͪΐͬͱ໘ͦ͘͞͏…
ෳࡶͳϨΠΞτΛ ؆୯ʹΈ͍ͨʂ
ͦ͜Ͱ Epoxy !!
Epoxyͱ?
Epoxyͱ? • ෳࡶͳը໘ΛRecyclerViewͰ࡞ΔͨΊͷϥΠϒϥϦ • Airbnb͕࡞͍ͯ͠Δ • 2016/08/25 Initial public release
• ࠓͰ݁ߏ׆ಈ͍ͯ͠Δ
Ͳ͏͍͏͜ͱ͕Ͱ͖Δͷʁ
Epoxyͱ? • ҧ͏ϨΠΞτͷCellΛRecyclerViewͰ؆୯ʹදࣔ Ͱ͖Δ • ಈతʹCellΛೖΕସ͑ͨΓͰ͖Δ
Epoxyͱ? .kt .xml or Epoxy EpoxyModel ϨΠΞτϑΝΠϧ͔ΒEpoxyModelΛ ࣗಈੜ
override fun buildModels(city: City) { headerView { id(“header view”) cityName(city.name)
description(city.description) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } carouselHeaderView { id(“carousel header view”) onClick { _ -> callbacks.onSeeAllClick() } } carouselView { id(“carousel view”) EpoxyModel EpoxyModel EpoxyModel EpoxyRecyclerView Epoxyͱ?
͜ͷϨΠΞτΛEpoxyͰΉͱ….
override fun buildModels(city: City) { headerView { id(“header view”) cityName(city.name)
description(city.description) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } // . . . . EpoxyͰΉͱ….
override fun buildModels(city: City) { headerView { id(“header view”) cityName(city.name)
description(city.description) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } // . . . . EpoxyͰΉͱ….
override fun buildModels(city: City) { headerView { id(“header view”) cityName(city.name)
description(city.description) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } // . . . . EpoxyͰΉͱ….
override fun buildModels(city: City) { // . . . .
carouselHeaderView { id(“carousel header view”) onClick { _ -> callbacks.onSeeAllClick() } } carouselView { id(“carousel view”) homes(city.homes) onClick { _ -> callbacks.onHomeClick() } } footerView { . . . . } EpoxyͰΉͱ….
override fun buildModels(city: City) { // . . . .
carouselHeaderView { id(“carousel header view”) onClick { _ -> callbacks.onSeeAllClick() } } carouselView { id(“carousel view”) homes(city.homes) onClick { _ -> callbacks.onHomeClick() } } footerView { . . . . } EpoxyͰΉͱ….
override fun buildModels(city: City) { // . . . .
carouselHeaderView { id(“carousel header view”) onClick { _ -> callbacks.onSeeAllClick() } } carouselView { id(“carousel view”) homes(city.homes) onClick { _ -> callbacks.onHomeClick() } } footerView { . . . . } EpoxyͰΉͱ….
override fun buildModels(city: City) { // . . . .
carouselHeaderView { id(“carousel header view”) onClick { _ -> callbacks.onSeeAllClick() } } carouselView { id(“carousel view”) homes(city.homes) onClick { _ -> callbacks.onHomeClick() } } footerView { . . . . } EpoxyͰΉͱ….
؆୯ͦ͏͡ΌΜ
ಋೖͯ͠ΈΑ͏ʂ
1. ४උ 2. EpoxyModel (CellView)Λ࡞ 3. Controller (Adapter)Λ࡞ 4. EpoxyRecyclerViewΛFragmentʹՃ͢Δ
खॱ
1. ४උ
apply plugin: ‘kotlin-kapt’ kapt { correctErrorTypes = true // .
. . } build.gradle ͍ͭͷ
dependencies { // . . . implementation ‘com.airbnb.android:epoxy:2.x.y’ implementation ‘com.airbnb.android:epoxy-databinding:2.x.y’
kapt ‘com.airbnb.android:epoxy-processor:2.x.y’ // . . . } build.gradle ͍ͭͷ
͜Ε package-info.java ͍ͭͷ͡Όͳ͍ͭ
package-info.javaͱʁ • DataBindingΛͬͯEpoxyModelΛ࡞Δͷʹඞཁ
• DataBindingΛͬͯEpoxyModelΛ࡞Δͷʹඞཁ package-info.javaͱʁ override fun buildModels(city: City) { headerView {
id(“header view”) cityName(city.name) description(city.description) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } EpoxyModel EpoxyModel
• DataBindingΛͬͯEpoxyModelΛ࡞Δͷʹඞཁ • ͲͷϨΠΞτϑΝΠϧ͔ΒEpoxyModelΛ࡞Δ͔ɺ ͱ͍͏Indexͷׂ • ಛघͳJavaϑΝΠϧ package-info.javaͱʁ
package-info.javaͱʁ @EpoxyDataBindnigPattern(rClass = R.class, layoutPrefix = “epoxy_layout”) @EpoxyDataBindingLayouts({R.layout.header_view, . .
.}) package com.tutorial.epoxy; import com.airbnb.epoxy.EpoxyDataBindingPattern; import com.airbnb.epoxy.EpoxyDataBindingLayouts; package-info.java
package-info.javaͱʁ @EpoxyDataBindnigPattern(rClass = R.class, layoutPrefix = “epoxy_layout”) @EpoxyDataBindingLayouts({R.layout.header_view, . .
.}) package com.tutorial.epoxy; import com.airbnb.epoxy.EpoxyDataBindingPattern; import com.airbnb.epoxy.EpoxyDataBindingLayouts; package-info.java
@EpoxyDataBindingPattern (಄ޠ) @EpoxyDataBindnigPattern(rClass = R.class, layoutPrefix = “epoxy_layout”) epoxy_layout_header.xml Epoxy
HeaderBindingModel_.java
package-info.javaͱʁ @EpoxyDataBindnigPattern(rClass = R.class, layoutPrefix = “epoxy_layout”) @EpoxyDataBindingLayouts({R.layout.header_view, . .
.}) package com.tutorial.epoxy; import com.airbnb.epoxy.EpoxyDataBindingPattern; import com.airbnb.epoxy.EpoxyDataBindingLayouts; package-info.java
package-info.javaͱʁ @EpoxyDataBindnigPattern(rClass = R.class, layoutPrefix = “epoxy_layout”) @EpoxyDataBindingLayouts({R.layout.header_view, . .
.}) package com.tutorial.epoxy; import com.airbnb.epoxy.EpoxyDataBindingPattern; import com.airbnb.epoxy.EpoxyDataBindingLayouts; package-info.java
@EpoxyDataBindingLayouts @EpoxyDataBindingLayouts({R.layout.header_view, . . .}) header_view.xml HeaderViewBindingModel_.java Epoxy
४උྃʂ
̎. CellΛ࡞͢Δ
CellΛ࡞͢Δ <?xml version=“1.0” encoding=“utf-8”?> <layout> <data> <variable name=“cityName” type=“String” />
</data> <LinearLayout . . .> <TextView . . . android:text=“@{cityName}” /> </LinearLayout> </layout> epoxy_layout_header.xml
CellΛ࡞͢Δ <?xml version=“1.0” encoding=“utf-8”?> <layout> <data> <variable name=“cityName” type=“String” />
</data> <LinearLayout . . .> <TextView . . . android:text=“@{cityName}” /> </LinearLayout> epoxy_layout_header.xml override fun buildModels(city: City) { headerView { id(“header view”) cityName(city.name) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } // . . . . SampleController.kt
CellΛ࡞͢Δ <?xml version=“1.0” encoding=“utf-8”?> <layout> <data> <variable name=“cityName” type=“String” />
</data> <LinearLayout . . .> <TextView . . . android:text=“@{cityName}” /> </LinearLayout> epoxy_layout_header.xml override fun buildModels(city: City) { headerView { id(“header view”) cityName(city.name) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } // . . . . SampleController.kt
Build !
epoxy_layout_header.xml Epoxy HeaderBindingModel_.java HeaderBindingModel_.java͕ੜʂ
3. ControllerΛ࡞͢Δ
class SampleController: TypedEpoxyController<City>() { override fun buildModels(city: City?) { //
͜͜ͰViewΛ࡞Δ . . . . } } SampleController.kt Controller
class SampleController: TypedEpoxyController<City>() { override fun buildModels(city: City?) { //
͜͜ͰViewΛ࡞Δ . . . . } } SampleController.kt Controller
class SampleController: TypedEpoxyController<City>() { override fun buildModels(city: City?) { //
͜͜ͰViewΛ࡞Δ . . . . } } SampleController.kt Controller
class SampleController: TypedEpoxyController<City>() { override fun buildModels(city: City?) { //
͜͜ͰViewΛ࡞Δ . . . . } } SampleController.kt Controller
class SampleController: TypedEpoxyController<City>() { override fun buildModels(city: City?) { //
͜͜ͰViewΛ࡞Δ . . . . } } SampleController.kt Controller
ViewΛ࡞͍ͬͯ͘
Controller epoxy_layout_header.xml epoxy_layout_link_view.xml
Controller epoxy_layout_header.xml epoxy_layout_link_view.xml Build !!
Controller HeaderBindingModel_.java LinkViewBindingModel_.java
override fun buildModels(city: City) { header { id(“header view”) cityName(city.name)
description(city.description) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } // . . . . Controller HeaderBindingModel_.java LinkViewBindingModel_.java SampleController.kt
Controller HeaderBindingModel_.java LinkViewBindingModel_.java SampleController.kt override fun buildModels(city: City) { header
{ id(“header view”) cityName(city.name) description(city.description) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } // . . . .
Controller HeaderBindingModel_.java LinkViewBindingModel_.java SampleController.kt override fun buildModels(city: City) { header
{ id(“header view”) cityName(city.name) description(city.description) } linkView { id(“link view”) onClick { _ -> callbacks.onLinkClick() } } // . . . .
4. EpoxyRecyclerViewΛՃʂ
Fragment <?xml version=“1.0” encoding=“utf-8”?> <layout> <FrameLayout . . .> <com.airbnb.epoxy.EpoxyRecyclerView
. . . /> </FrameLayout> </layout> sample_fragment.xml
Fragment <?xml version=“1.0” encoding=“utf-8”?> <layout> <FrameLayout . . .> <com.airbnb.epoxy.EpoxyRecyclerView
. . . /> </FrameLayout> </layout> sample_fragment.xml
Fragment SampleFragment.kt class SampleFragment: Fragment() { val controller = SampleController()
var city = City(~) override fun onCreateView(~): View { . . . binding.epoxyRecyclerView.setController(controller) controller.setData(city) . . . } . . . }
Fragment SampleFragment.kt class SampleFragment: Fragment() { val controller = SampleController()
var city = City(~) override fun onCreateView(~): View { . . . binding.epoxyRecyclerView.setController(controller) controller.setData(city) . . . } . . . }
Fragment SampleFragment.kt class SampleFragment: Fragment() { val controller = SampleController()
var city = City(~) override fun onCreateView(~): View { . . . binding.epoxyRecyclerView.setController(controller) controller.setData(city) . . . } . . . }
ʂ
https://github.com/ShoMasegi/TutorialEpoxy ࠓճ࡞ͨ͠ͷ
؆୯ʹ࡞͢Δ͜ͱ͕Ͱ͖·ͨ͠ɻ ࣍ୈͰڽͬͨͷ͕ൺֱతָʹ࣮Ͱ͖ͦ͏ɻ ײ
͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ