Slide 1
Slide 1 text
No more Adapter with Epoxy and
Data Binding
@takuji31
ژDev͔;͐ #5
Slide 2
Slide 2 text
ࣗݾհ
Slide 3
Slide 3 text
ࣗݾհ
• @takuji31 id:takuji31
• Takuji Nishibayashi
• Hatena Co., Ltd.
• App Team
• δϟϯϓϧʔΩʔʂ
• ίϛοΫDAYS
• ΧΫϤϜ
Slide 4
Slide 4 text
ࣗݾհ
• Android
• Kotlin
•
!
https://blog.takuji31.jp
•
"
https://nazuna.takuji31.jp
•
# $
https://photo.takuji31.jp
Slide 5
Slide 5 text
RecyclerView
Slide 6
Slide 6 text
ͬͯͳ͍ਓ͍·ͤΜΑͶʁ
Slide 7
Slide 7 text
ViewHolder + Adapter
Slide 8
Slide 8 text
ΦϓγϣϯͰ DiffUtil
Slide 9
Slide 9 text
blog.takuji31.jp/entry/kanmoba17
Slide 10
Slide 10 text
ෳࡶͳը໘
Slide 11
Slide 11 text
No content
Slide 12
Slide 12 text
Ͳ͏࣮ݱ͢Δʁ
Slide 13
Slide 13 text
खͰؤுΔ
Slide 14
Slide 14 text
ViewHolderΛview type͝ͱʹ࡞Δ
Slide 15
Slide 15 text
onCreateViewHolderͰ֘͢Δ
ViewHolderΛ࡞Δ
Slide 16
Slide 16 text
onBindViewHolderͰViewHolderͷ
ܕΛݟͯΛઃఆ
Slide 17
Slide 17 text
มߋݕ
Slide 18
Slide 18 text
DiffUtilͰؤுΔ
Slide 19
Slide 19 text
!
Slide 20
Slide 20 text
Section Library
Slide 21
Slide 21 text
※ ͍͔ͭ͘ϥΠϒϥϦʔ͕͋Γ·͢
͕ҰൠతͳͰ͢
Slide 22
Slide 22 text
view typeͷΘΓʹSectionͱ͍͏
ΫϥεΛ͏
Slide 23
Slide 23 text
Section
class WorkSection(val items:List): Section() {
override fun onCreateViewHolder(inflator: LayoutInflator, parent: ViewGroup): WorkViewHolder {
return WorkViewHolder(inflator.inflate(R.layout.recycle_item_work, parent, false))
}
override fun onBindViewHolder(viewHolder: WorkViewHolder, position: Int) {
val work = items[position]
viewHolder.title = work.title
Picasso.get().load(work.imageUri).into(viewHolder.imageView)
}
}
Slide 24
Slide 24 text
Adapter
val adapter = Adapter()
adapter.addSection(BannerSection(works))
adapter.addSection(WorkSection(works.take(10)))
adapter.addSection(EntrySection(works))
adapter.addSection(WorkSection(works.drop(10)))
Slide 25
Slide 25 text
ύοͱݟ؆୯ͦ͏
Slide 26
Slide 26 text
ΫϦοΫΠϕϯτͷୡͲ͏͢Δ…ʁ
class WorkSection(val items:List, val onClick: (Work) -> Unit): Section() {
override fun onCreateViewHolder(inflator: LayoutInflator, parent: ViewGroup): WorkViewHolder {
return WorkViewHolder(inflator.inflate(R.layout.recycle_item_work, parent, false))
}
override fun onBindViewHolder(viewHolder: WorkViewHolder, position: Int) {
val work = items[position]
viewHolder.title = work.title
Picasso.get().load(work.imageUri).into(viewHolder.imageView)
viewHolder.itemView.setOnClickListener { onClick() }
}
}
Slide 27
Slide 27 text
Adapter
val adapter = Adapter(
{work -> viewModel.onWorkSelected(work)},
{entry -> viewModel.onEntrySelected(entry)},
{banner -> viewModel.onBannerSelected(banner)},
)
adapter.addSection(BannerSection(works))
adapter.addSection(WorkSection(works.take(10)))
adapter.addSection(EntrySection(works))
adapter.addSection(WorkSection(works.drop(10)))
Slide 28
Slide 28 text
ͪΐͬͱ໘
Slide 29
Slide 29 text
ͦͦ
Slide 30
Slide 30 text
Adapter
-> Section
-> ViewHolder
Slide 31
Slide 31 text
֊͕૿͑Δ
Slide 32
Slide 32 text
ঢ়ଶΛόϥόϥʹ͍࣋ͬͯͨΓ͢Δ
ͱ෮ݩͰࢮ͵
Slide 33
Slide 33 text
Ϋϥε૿͑Δ
Slide 34
Slide 34 text
ॳݟͰΊͬͪΌΉ͍ͣ
Slide 35
Slide 35 text
Epoxy
Slide 36
Slide 36 text
github.com/airbnb/epoxy
Slide 37
Slide 37 text
No more
Slide 38
Slide 38 text
ViewHolder
Slide 39
Slide 39 text
notifyDataSetChanged()
Slide 40
Slide 40 text
Adapter
Slide 41
Slide 41 text
Carousel support
Slide 42
Slide 42 text
Data Binding Friendly
Slide 43
Slide 43 text
Kotlin DSL support!!!
Slide 44
Slide 44 text
build.gradle
dependencies {
implementation "com.airbnb.android:epoxy:3.3.0"
implementation "com.airbnb.android:epoxy-databinding:3.3.0"
kapt "com.airbnb.android:epoxy-processor:3.3.0"
}
Slide 45
Slide 45 text
package-info.java
@EpoxyDataBindingPattern(rClass = R.class, layoutPrefix = "recycler")
package jp.takuji31.epoxyexample;
import com.airbnb.epoxy.EpoxyDataBindingPattern;
Slide 46
Slide 46 text
recycler_item_work.xml
Slide 47
Slide 47 text
Activity or Fragment
recyclerView.withModels {
works.forEach { work ->
itemWork {
id("work_${work.id}")
work(work)
}
}
}
Slide 48
Slide 48 text
No content
Slide 49
Slide 49 text
!
Slide 50
Slide 50 text
Carousel
Slide 51
Slide 51 text
Carousel
recyclerView.withModels {
carousel {
id("entryCaroucel")
withModelsFrom(entries) { entry ->
ItemEntryBindingModel_()
.id("entry_${entry.id}")
.entry(entry)
}
}
}
Slide 52
Slide 52 text
No content
Slide 53
Slide 53 text
؆୯͗͢Ͱ
Slide 54
Slide 54 text
ෳࡶͳϨΠΞτ
Slide 55
Slide 55 text
ෳࡶͳϨΠΞτ
Carousel.setDefaultGlobalSnapHelperFactory(null)
carousel {
id("bannerCarousel")
withModelsFrom(banners) {
ItemBannerBindingModel_()
.id("banner_${it.id}")
.banner(it)
}
}
works.take(10).forEach { work ->
itemWork {
id("work_${work.id}")
work(work)
}
}
Slide 56
Slide 56 text
ෳࡶͳϨΠΞτ
headerBlogEntry {
id("blog_header")
}
carousel {
id("entryCaroucel")
withModelsFrom(entries) { entry ->
ItemEntryBindingModel_()
.id("entry_${entry.id}")
.entry(entry)
}
}
works.drop(10).forEach { work ->
itemWork {
id("work_${work.id}")
work(work)
}
}
Slide 57
Slide 57 text
ʂ
Slide 58
Slide 58 text
https://github.com/takuji31/epoxy-
example
Slide 59
Slide 59 text
Enjoy RecyclerView life
Slide 60
Slide 60 text
!
࠾༻ใ
Slide 61
Slide 61 text
גࣜձࣾͯͳͰɺ
ͱʹʮઓʯͰ͖Δ
ؒΛืू͍ͯ͠·͢
Slide 62
Slide 62 text
͜ΜͳਓΛ୳͍ͯ͠·͢
• AndroidΞϓϦΛ࡞Γ͍ͨਓ
• iOSΞϓϦΛ࡞Γ͍ͨਓ
• ͋Δ͍྆ํ
• ͳΜͳΒαʔόʔαΠυ
Slide 63
Slide 63 text
https://hatenacorp.jp/recruit/