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
新 Kyash Card を支える技術
Search
Yoshihiro Tanaka
January 16, 2020
Technology
2
3k
新 Kyash Card を支える技術
Bonfire Android #6 での発表資料です
https://yj-meetup.connpass.com/event/158328/
Yoshihiro Tanaka
January 16, 2020
Tweet
Share
More Decks by Yoshihiro Tanaka
See All by Yoshihiro Tanaka
Nim and sha1
cordea
0
480
Possibility of terminal
cordea
0
1.5k
Other Decks in Technology
See All in Technology
分解して理解する Aspire
nenonaninu
2
1.1k
Two Blades, One Journey: Engineering While Managing
ohbarye
4
2k
Fraxinus00tw assembly manual
fukumay
0
100
システム・ML活用を広げるdbtのデータモデリング / Expanding System & ML Use with dbt Modeling
i125
1
320
Cracking the Coding Interview 6th Edition
gdplabs
14
28k
Snowflake ML モデルを dbt データパイプラインに組み込む
estie
0
100
ウォンテッドリーのデータパイプラインを支える ETL のための analytics, rds-exporter / analytics, rds-exporter for ETL to support Wantedly's data pipeline
unblee
0
130
JavaにおけるNull非許容性
skrb
2
2.6k
Exadata Database Service on Cloud@Customer セキュリティ、ネットワーク、および管理について
oracle4engineer
PRO
2
1.5k
AIエージェント元年@日本生成AIユーザ会
shukob
1
210
Change Managerを活用して本番環境へのセキュアなGUIアクセスを統制する / Control Secure GUI Access to the Production Environment with Change Manager
yuj1osm
0
100
脳波を用いた嗜好マッチングシステム
hokkey621
0
290
Featured
See All Featured
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
10
510
GitHub's CSS Performance
jonrohan
1030
460k
Building Adaptive Systems
keathley
40
2.4k
Documentation Writing (for coders)
carmenintech
67
4.6k
Six Lessons from altMBA
skipperchong
27
3.6k
The World Runs on Bad Software
bkeepers
PRO
67
11k
Being A Developer After 40
akosma
89
590k
YesSQL, Process and Tooling at Scale
rocio
172
14k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
175
52k
Faster Mobile Websites
deanohume
306
31k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Transcript
None
Bonfire Android #6 ৽ Kyash Card Λࢧ͑Δٕज़
3 • 2019/05 ~ Kyash Inc. • Android applications engineer
• Kyash Point • Kyash Card • ࣮ݧతػೳ • ͳͲ Yoshihiro Tanaka (@_Cordea)
4 Kyash Card
5 2020ॳΊࠒൃߦ༧ఆ
6 • Kyash Card ͷਃ͠ࠐΈΧʔυઃఆͳͲ • ৽نͷը໘ 30 ~ 40
• Kyash ͷதͰൺֱతେ͖Ίͷ։ൃنͳͷͰɺઃܭ࠾༻ٕज़ݟ͠ • ࠓճ͜ͷΜͷΛ͠·͢ ΞϓϦ͍Ζ͍ΖՃ͞Ε·͢
7 • Architecture MVVM • Databinding Ͱ VM ͱ
View Λ bind • BaseViewModel ࣗͨͪͰ࡞ͬͨͷ • ࠾༻ٕज़ • Dagger 2, Retrofit, RxJava ͳͲඪ४తͳબ • Kyash Point ͷࡍʹ androidx.paging Λ࠾༻͢ΔͳͲ͍ͯ͠Δ ͜Ε·Ͱͷ Kyash Android
8 Kyash Card ։ൃʹ͋ͨͬͯߟ͑ͨ͜ͱ
9 • Kyash Android ͷ։ൃࠓ 1.2 ਓ͘Β͍ • ࣌ؒͱϦιʔε͕গͳ͍ •
৽ػೳվળΓ͍ͨ͜ͱେྔʹ͋Δ • ৽͘͠ਓ͕ೖ͖ͬͯͨ࣌ʹֶशίετ͍͑ͨ͘
10 ඪ४ʹد͍ͤͨʂ
11 • ConstraintLayout • androidx.lifecycle.ViewModel • Navigation component <- New!
• SpringAnimation <- New! • Kakao <- New! ༻ٕͨ͠ज़
12 • ͓ೃછΈͷͭ • ৽نͷը໘΄΅ ConstraintLayout ʹͳ͍ͬͯΔ • Kyash ͳΒͰͷԿ͔ͱ͍͏͜ͱͰʮΧʔυ݊໘ͷඳըʯΛհ
ConstraintLayout
13 Kyash Card Lite • PAN Custom view •
Autosizing Ͱ Text size Λௐ • جຊͷϥΠϯΛ Guideline Ͱఆٛ͠ɺ֤ཁૉͰ percent, chainStyle, bias ͳͲΛઃఆͯ͠૬ޓʹ ଓ͠ܗΛอ͍ͬͯΔ • ཁ͢ΔʹՄಡੑ͕͍
14 Kyash Card Lite • PAN Custom view •
Autosizing Ͱ Text size Λௐ • جຊͷϥΠϯΛ Guideline Ͱఆٛ͠ɺ֤ཁૉͰ percent, chainStyle, bias ͳͲΛઃఆͯ͠૬ޓʹ ଓ͠ܗΛอ͍ͬͯΔ • ཁ͢ΔʹՄಡੑ͕͍
15 Kyash Card Lite <TextView android:id="@+id/exp_label" app:autoSizeMinTextSize="5sp" app:autoSizeTextType="uniform" app:layout_constraintBottom_toTopOf="@id/exp" app:layout_constraintEnd_toEndOf="@id/exp"
app:layout_constraintHeight_percent="0.05" app:layout_constraintStart_toStartOf="@id/exp" app:layout_constraintTop_toBottomOf="@id/guideline" /> <TextView android:id="@+id/exp" android:layout_marginStart="16dp" app:autoSizeMinTextSize="12sp" app:autoSizeTextType="uniform" app:layout_constraintEnd_toStartOf="@id/cvv" app:layout_constraintHeight_percent="0.08" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@id/exp_label" app:layout_constraintWidth_percent="0.2" />
16 Kyash Card • ͯ͢ TextView • Autosizing Ͱ Text
size Λௐ • ֤ཁૉͷҐஔؔΛ Guideline Ͱఆٛ͠ɺը૾ʹ ର͢Δ percent Ͱࢦఆ͢Δ • ͞Βʹ weight ͰͦΕͧΕͷ size Λௐ͢Δ
17 Kyash Card • ͯ͢ TextView • Autosizing Ͱ Text
size Λௐ • ֤ཁૉͷҐஔؔΛ Guideline Ͱఆٛ͠ɺը૾ʹ ର͢Δ percent Ͱࢦఆ͢Δ • ͞Βʹ weight ͰͦΕͧΕͷ size Λௐ͢Δ
18 Kyash Card <TextView android:id="@+id/exp" app:autoSizeMinTextSize="5sp" app:autoSizeTextType="uniform" app:layout_constraintBottom_toTopOf="@id/bottom_guideline" app:layout_constraintEnd_toStartOf="@id/end_guideline" app:layout_constraintHorizontal_weight="2"
app:layout_constraintStart_toEndOf="@id/good_thru" app:layout_constraintTop_toBottomOf="@id/month_year" app:layout_constraintVertical_weight="2" /> <androidx.constraintlayout.widget.Guideline android:id="@+id/top_guideline" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" app:layout_constraintGuide_percent="0.1" />
19 • Space ratio ۦ͢Εෳࡶͳ Layout ConstraintLayout Ͱ݁Ͱ͖Δ
• Preview ͰҰݟ͔ͯ͠Βͳ͍ෳࡶ͞อकͰ͖ͳ͍ ConstraintLayout
20 • Kyash Card ͷ৽نը໘Ͱͯ͢ androidx.lifecycle.ViewModel ʹ౷Ұ • Navigation component
ͱͱ࠾༻͍ͨ͠ͱ͍͏͕͋ͬͨͷͰ࠾༻ • ෳͷը໘ؒͰڞ༗͞ΕΔ Data Event Ͱ Shared ViewModel Λ༻ • ਃ͠ࠐΈͷঢ়ଶཧͷͨΊ • Nav graph ͕ෳʹͳ͍ͬͯΔͷͰͦΕຖʹ Shared ViewModel Λஔ ViewModel & Navigation component
21 • ී௨ʹ༻͢ΔͱඞཁҎ্ͷ Data ʹΞΫηεͰ͖ͯ͠·͏ • A Fragment ༻ͷ Data
ʹ B Fragment ͕ΞΫηεͰ͖ͯ͠·͏ • ҆શͰͳ͍ • ςετͮ͠Β͍ Shared ViewModel • A Fragment, B Fragment ༻ʹ Interface ΛΓɺ͜ΕΛ Inject ͢Δ
22 Shared ViewModel ͷ Inject interface CardApplicationSharedViewModel { fun apply()
} interface AddressRegistrationSharedViewModel { fun register() } class CardApplicationSharedViewModelImpl( ) : ViewModel(), CardApplicationSharedViewModel, AddressRegistrationSharedViewModel { override fun apply() { } override fun register() { } } @Module class CardApplicationSharedViewModelProvideModule { @Provides fun provideSharedViewModel(activity: AppCompatActivity): CardApplicationSharedViewModel = ViewModelProviders.of(activity).get<CardApplicationSharedViewModelImpl>() } class CardApplicationFragment : Fragment() { @Inject lateinit var sharedViewModel: CardApplicationSharedViewModel }
23 • ϩδοΫΛ Shared ViewModel ʹؚΊΔͱҰؾʹෳࡶԽ͢Δ • Λ͔ͳΓ੍ݶͯ͠ӡ༻͢Δඞཁ͕͋Δ • ·ͣΘͳͯ͘ྑ͍Α͏ͳํ๏Λߟ͑Δͷ͕͓͢͢Ί
Shared ViewModel
24 • View ʹόωͷΑ͏ͳಈ͖Λ༩͑Δɻݮਰൺ߶ੑͳͲΛઃఆͰ͖Δɻ • Kyash Card ͷਃ͠ࠐΈͳͲɺཁॴཁॴʹ༷ʑͳ Animation ͕ࠐ·Ε͍ͯ·͢
• ΆΑΜΆΑΜ͕͍͔ͭ͋͘Γ͜ΕΛ͍͍ײ͡ʹදݱ͍ͨ͠ͷͰ࠾༻ SpringAnimation
25 SpringAnimation fun startAnimation() { scaleX = 1.5f SpringAnimation(this, SpringAnimation.SCALE_X,
1f) .apply { spring.dampingRatio = SpringForce.DAMPING_RATIO_HIGH_BOUNCY spring.stiffness = SpringForce.STIFFNESS_LOW } .start() }
26 SpringAnimation
27 • ؆୯ʹɺΑΓࣗવͳಈ͖Λ࣮Ͱ͖Δ • BounceInterpolator ͳͲͷ Interpolator ͱͲͪΒ͕ྑ͍͔ߟ͑ͳ͕Β͏ͷ͕ྑ͍ SpringAnimation
28 • Espresso ͷ DSL • UI tests Λॻ͖ͯ͘͘͢͠ΕΔ •
ςετΛॻ͘͜ͱࣗମʹ࣌ؒΛ͔͚Δͷຊ࣭తͰͳ͍ • ਃ͠ࠐΈͳͲͷҰ࿈ͷྲྀΕΛਓͷखΛΘͣʹ࣮ߦ͢Δ Kakao
29 Espresso object InputPageObject { fun setFirstName() = apply {
onView(withId(R.id.first_name_edit_text)).perform(replaceText("Taro")) } fun setLastName() = apply { onView(withId(R.id.last_name_edit_text)).perform(replaceText("Kyash")) } fun clickButton() = apply { onView(withText(getString(R.string.button))).perform(click()) } } class InputTest { @Test fun test() { InputPageObject .setFirstName() .setLastName() .clickButton() } }
30 Kakao class InputScreen : Screen<InputScreen>() { val firstNameEditText =
KEditText { withId(R.id.first_name_edit_text) } val lastNameEditText = KEditText { withId(R.id.last_name_edit_text) } val button = KButton { withText(getString(R.string.button)) } } class InputTest { @Test fun test() { onScreen<InputScreen> { firstNameEditText { replaceText("Taro") } lastNameEditText { replaceText("Kyash") } button.click() } } }
31 Kakao class ExampleScreen : Screen<ExampleScreen>() { val recyclerView =
KRecyclerView({ withId(R.id.recycler_view) }) { itemType(::Item) } class Item(parent: Matcher<View>) : KRecyclerItem<Item>(parent) { val title = KTextView(parent) { withId(R.id.title) } val description = KTextView(parent) { withId(R.id.description) } } } class ExampleTest { @Test fun test() { onScreen<ExampleScreen> { recyclerView.children<ExampleScreen.Item> { title { isVisible() hasAnyText() } description { isVisible() isNotClickable() hasEmptyText() } } } } }
32 • UI tests Λॻ࣌ؒ͘͘ͳΔ • Espresso ͔Βॻ͖͑ͨՕॴͰͨ·ʹࣦഊ͢Δ͜ͱ͕͋Δ • λΠϛϯά
Delay গ͠ௐ͢Δඞཁ͕͋ͬͨΓ͢Δ͔ Kakao
33 • ConstraintLayout ԿͰग़དྷΔ • Γ͗͢ΔͱՄಡੑΛԼ͛Δ • Shared ViewModel ͷ༻৻ॏʹ
• UI tests ʹྗΛೖΕ͍ͯΔ߹ Kakao ͕ศར ·ͱΊ
Thank you 34
None