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
UI Component Catalog for Android
Search
kazutoyo
March 27, 2019
Programming
2
750
UI Component Catalog for Android
AndroidでUI Componentの一覧を表示をする
kazutoyo
March 27, 2019
Tweet
Share
Other Decks in Programming
See All in Programming
Ruby Pattern Matching
bkuhlmann
0
940
初心者のためのRubyKaigi入門/RubyKaigi Introduction
a_matsuda
10
1.7k
Try creating your own orderedmap
kazamori
1
270
Tailwind CSSを本気でカスタマイズする方法
fsubal
15
5.6k
PostmanでAPIの動作確認が楽になった話
h455h1
0
190
Git Lint
bkuhlmann
4
770
パフォーマンスを求めてDBに機能を寄せる戦略
aoyagikouhei
0
110
Fast JSX: Don't clone props object #28768
yossydev
1
220
Ruby GitHub Packages
bkuhlmann
0
650
dbtのドメイン分割による データ基盤の改善とDigdagとの連携
sakama
0
480
Webアプリをできるだけコードを手書きしないで作ってみる
tomokusaba
2
190
Documentation for users with AsciiDoc and Antora
ahus1
0
370
Featured
See All Featured
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
9
1.3k
For a Future-Friendly Web
brad_frost
172
9k
Building Effective Engineering Teams - LeadDev
addyosmani
32
1.9k
VelocityConf: Rendering Performance Case Studies
addyosmani
321
23k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
21
1.6k
What the flash - Photography Introduction
edds
64
11k
Creatively Recalculating Your Daily Design Routine
revolveconf
211
11k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
117
18k
Web development in the modern age
philhawksworth
203
10k
The MySQL Ecosystem @ GitHub 2015
samlambert
244
12k
BBQ
matthewcrist
80
8.8k
RailsConf 2023
tenderlove
9
570
Transcript
UI Component Catalog for Android ϐοΫΞοϓגࣜձࣾ @kazutoyo
ࣗݾհ ϐοΫΞοϓגࣜձࣾ ౦ւ ๛ ʢ@kazutoyoʣ νϟοτܕখઆͷDMM TELLERͷ iOS/Androidͷ։ൃΛ୲
None
UI Component
None
UI Component • ΞϓϦέʔγϣϯ্Ͱ࠶ར༻Ͱ͖ΔΑ͏ͳViewΛ·ͱΊΔ • ϘλϯɺϦετɺΧʔυ…etc
UI Component Catalog
None
Storybook • React/Vue/AngularͰͷUI Component Catalog • StorybookΛ͏͜ͱͰɺ։ൃऀσβΠφʔίϯϙʔωϯ τ୯ҐͰͦΕͧΕͷ࣮ৼΔ͍Λ֬ೝ͢Δ͜ͱ͕Ͱ͖Δ • ͲΜͳίϯϙʔωϯτ͕͋Δ͔ಈ͔ͯ֬͠ೝ͢Δ͜ͱ͕Ͱ͖
Δ
ΊͬͪΌ͍͍ʂʂ
AndroidͰ͍ͨͯ͘ ʢࡶʹʣͭͬͯ͘Έ·ͨ͠
https://github.com/kazutoyo/ UIComponentCatalog
طଘͷϓϩδΣΫτʹՃͯ͠ΈΔ
طଘͷطଘͷϓϩδΣΫτʹՃͯ͠ΈΔ • TELLERͷΞϓϦͰݱࡏϚϧνϞδϡʔϧʹͳ͍ͬͯͳ͍ • ৽نͰ࡞ΔίϯϙʔωϯτΛ:uicomponentͱͯ͠Ϟδϡʔϧʹ Γग़͢ • UIComponentCatalog༻ͷPhone&TabletϞδϡʔϧΛՃͯ͠ɺ ͦ͜Ͱ:uicomponentϞδϡʔϧΛಡΈࠐΈUIComponentCatalog Λ࣮͢Δ
NewModule → Android Library
͜Μͳײ͡ͰUIComponent༻ͷϞδϡʔϧΛՃ
:uicomponentʹͭͬͨ͘ComponentΛՃ
NewModule → Phone & Tablet Module
UIComponentCatalogϞδϡʔϧΛՃ
ActivityΛՃʢLayout Fileੜ͠ͳ͍ʣ
JitPackϦϙδτϦΛՃ > build.gradle (project) repositories { google() jcenter() maven {
url "https://jitpack.io" } }
UIComponentCatalogͱ :uicomponentϞδϡʔϧΛՃ > uicomponentcatalog/build.gradle dependencies { implementation ‘com.github.kazutoyo:UIComponentCatalog:0.0.+’ implementation project(':uicomponent')
}
ComponentCatalogActivityΫϥεΛܧঝͯ͠ createCollections()Λ࣮͢Δ class TellerUIComponentCatalogActivity : ComponentCatalogActivity() { override fun createCollections():
List<ComponentCatalogCategory> = listOf( ComponentCatalogCategory("Common", listOf( ComponentCatalogSubCategory("ϑΥϩʔϘλϯ", listOf( object : ComponentItem("ϑΥϩʔϘλϯʢະϑΥϩʔʣ") { override fun buildItem(): View { return FollowButton(this@TellerUIComponentCatalogActivity).apply { setIsFollowed(false) } } } )) )) ) }
͔ͭͬͯΈͯ • ߴʹUIίϯϙʔωϯτͷ։ൃͰ͖ΔΑ͏ʹͳͬͨ • ͱ͘ʹຊମΞϓϦ͕Ϟδϡʔϧׂ͞Ε͍ͯͳ͔͔ͬͨΒ͍··ͰΊͪΌͪ͘Ό Ϗϧυ͕͔͔͍͚࣌ؒͬͯͨͲɺUIComponentCategoryͷΞϓϦέʔγϣϯ Ͱ֬ೝͰ͖ΔͷͰϏϧυ͕ͪͳ͘ͳͬͨ • ViewΛίϯϙʔωϯτԽ͢Δบ͕ͭ͘Α͏ͳؾ͕͢Δ •
σβΠφʔ͞Μͱίϯϙʔωϯτ୯ҐͰσβΠϯνΣοΫ͕Ͱ͖ΔͷͰɺΓ ͘͢ͳΓͦ͏
·ͩ·ͩUIComponentCatalog࡞Γ్தͳͷͰ ఏҊPullRequestͳͲܴ͠·͢ʂ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ ϐοΫΞοϓגࣜձࣾͰΤϯδχΞΛ ืू͍ͯ͠·͢ͷͰԿଔ