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
ざっくり Jetpack Compose / Cookpad.apk #3
Search
star_zero
July 23, 2019
Programming
2
1k
ざっくり Jetpack Compose / Cookpad.apk #3
star_zero
July 23, 2019
Tweet
Share
More Decks by star_zero
See All by star_zero
今からはじめるAndroidアプリ開発 2024 / DevFest 2024
star_zero
0
1.2k
Jetpack Compose の Side-effect を使いこなす / DroidKaigi 2023
star_zero
5
5.7k
Android 14 新機能 / Android 14 Meetup Nagoya
star_zero
1
580
Android 14 と Predictive back gesture / Shibuya.apk #42
star_zero
0
360
Coroutines Test 入門 / Android Test Night #8
star_zero
2
1.1k
What's new in Jetpack / I/O Extended Japan 2022
star_zero
1
620
Kotlin 2021 Recap / DevFest 2021
star_zero
3
1.3k
Kotlin Symbol Processing (KSP) を使ったコード生成 / DroidKaigi 2021
star_zero
2
5.2k
What's new Android 12
star_zero
0
560
Other Decks in Programming
See All in Programming
SpringBoot3.4の構造化ログ #kanjava
irof
2
970
負債になりにくいCSSをデザイナとつくるには?
fsubal
9
2.3k
Software Architecture
hschwentner
6
2.1k
技術を根付かせる / How to make technology take root
kubode
1
240
Formの複雑さに立ち向かう
bmthd
1
720
AWSマネコンに複数のアカウントで入れるようになりました
yuhta28
2
160
“あなた” の開発を支援する AI エージェント Bedrock Engineer / introducing-bedrock-engineer
gawa
11
1.8k
Immutable ActiveRecord
megane42
0
130
なぜイベント駆動が必要なのか - CQRS/ESで解く複雑系システムの課題 -
j5ik2o
7
2.5k
AHC041解説
terryu16
0
590
Open source software: how to live long and go far
gaelvaroquaux
0
620
チームリードになって変わったこと
isaka1022
0
190
Featured
See All Featured
How STYLIGHT went responsive
nonsquared
98
5.3k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Site-Speed That Sticks
csswizardry
3
370
Optimising Largest Contentful Paint
csswizardry
34
3.1k
Practical Orchestrator
shlominoach
186
10k
Embracing the Ebb and Flow
colly
84
4.6k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
27
1.5k
Scaling GitHub
holman
459
140k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
45
2.3k
How GitHub (no longer) Works
holman
313
140k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.2k
Transcript
ざっくり Jetpack Compose Cookpad.apk #3 2019/07/23
About me •Kenji Abe •メディアプロダクト開発部 •cookpadLive, storeTV •Twitter: @STAR_ZERO
⚠注意⚠ まだAlphaにもなってないので、 今後変更されると思います。 2019/07/20のコードでやっています。
Jetpack Compose
Jetpack Compose •Google I/O 2019で発表 •UIを宣言的に書いてく •Kotlinを使う •React, Litho, Vue.js,
Flutterみたいな感じ
Jetpack Composeで アプリを作ってみた https://github.com/STAR-ZERO/GithubCompose
Hello World
Hello World override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent {
MaterialTheme { Text(text = "Hello World") } } }
レイアウト
レイアウト MaterialTheme { Container( padding = EdgeInsets(16.dp), alignment = Alignment.TopLeft,
width = 240.dp, height = 120.dp ) { Text(text = "Hello World") } }
レイアウト MaterialTheme { Column { Row { Text(text = "123")
Text(text = "456") } Row { Text(text = "abc") Text(text = "def") } } }
レイアウト MaterialTheme { Table { for (i in 0 until
20) { tableRow { for (j in 0 until 2) { Padding(16.dp) { Text(text = "Cell $i - $j") } } } } } }
ステート
ステート Column { val counter = +state { 0 }
Text(text = "count = ${counter.value}") Button( text = "Button", onClick = { counter.value++ } ) }
ステート Column { val flag = +state { false }
if (flag.value) { Text(text = "Jepack") } else { Text(text = "Compose") } Button( text = "Button", onClick = { flag.value = !flag.value } ) }
Commit Scope? (Lifecycle?)
Commit Scope Column { +onActive { } // 最初の1回 +onCommit
{ // 描画されるたび onDispose { } // 破棄されるとき } val flag = +state { false } if (flag.value) { Container { +onCommit { onDispose { } } } } else { // ... } }
まとめ
まとめ •直感的でよさそう ‣ でも、すべてJetpack Composeはツライかも? •ステートやライフサイクルは今までと異なるので注意 ‣ 設計どうしよう
まとめ •ただし、今やるべきではない ‣ Alphaにもなってないので当然 ‣ 正式リリースまではだいぶ時間かかりそうな印象
ありがとうございました