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
780
UI Component Catalog for Android
AndroidでUI Componentの一覧を表示をする
kazutoyo
March 27, 2019
Tweet
Share
Other Decks in Programming
See All in Programming
現場で役立つモデリング 超入門
masuda220
PRO
15
3.1k
GitHub Actionsのキャッシュと手を挙げることの大切さとそれに必要なこと
satoshi256kbyte
5
410
Hotwire or React? ~Reactの録画機能をHotwireに置き換えて得られた知見~ / hotwire_or_react
harunatsujita
8
5k
Generative AI Use Cases JP (略称:GenU)奮闘記
hideg
0
190
What’s New in Compose Multiplatform - A Live Tour (droidcon London 2024)
zsmb
1
440
Tauriでネイティブアプリを作りたい
tsucchinoko
0
350
[PyCon Korea 2024 Keynote] 커뮤니티와 파이썬, 그리고 우리
beomi
0
120
Snowflake x dbtで作るセキュアでアジャイルなデータ基盤
tsoshiro
2
500
Webの技術スタックで マルチプラットフォームアプリ開発を可能にするElixirDesktopの紹介
thehaigo
2
1k
광고 소재 심사 과정에 AI를 도입하여 광고 서비스 생산성 향상시키기
kakao
PRO
0
160
カラム追加で増えるActiveRecordのメモリサイズ イメージできますか?
asayamakk
4
1.9k
JaSST 24 九州:ワークショップ(は除く)実践!マインドマップを活用したソフトウェアテスト+活用事例
satohiroyuki
0
320
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
693
190k
Facilitating Awesome Meetings
lara
49
6.1k
Teambox: Starting and Learning
jrom
133
8.8k
Faster Mobile Websites
deanohume
305
30k
Designing for humans not robots
tammielis
249
25k
Scaling GitHub
holman
458
140k
Documentation Writing (for coders)
carmenintech
65
4.4k
Practical Orchestrator
shlominoach
186
10k
Optimizing for Happiness
mojombo
376
69k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
10
700
Imperfection Machines: The Place of Print at Facebook
scottboms
264
13k
Into the Great Unknown - MozCon
thekraken
32
1.5k
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ͳͲܴ͠·͢ʂ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ ϐοΫΞοϓגࣜձࣾͰΤϯδχΞΛ ืू͍ͯ͠·͢ͷͰԿଔ