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
Compose「急いで」キャッチアップする
Search
Swimmy
April 12, 2022
0
8
Compose「急いで」キャッチアップする
Swimmy
April 12, 2022
Tweet
Share
More Decks by Swimmy
See All by Swimmy
違いのワカル Kotlinプログラマーへの道
reoandroider
0
140
[Jetpack Compose] 原理から見るSkippable対応
reoandroider
0
150
Androdアプリ開発におけるネストスクロール問題と向き合うの説明用途
reoandroider
0
1.5k
Androdアプリ開発におけるネストスクロール問題と向き合うの説明用途
reoandroider
0
1.4k
Androdアプリ開発におけるネストスクロール問題と向き合うの説明用途~NestedScrollInteropConnectionは何してるの?編~
reoandroider
0
1.3k
Roborazziを最大限に活用する(導入編)
reoandroider
0
160
Master of NestedScroll
reoandroider
0
8.3k
Jetpack_Composeで_半円のプログレスバーを作った話
reoandroider
0
310
funny plugins
reoandroider
0
13
Featured
See All Featured
How to Ace a Technical Interview
jacobian
273
22k
In The Pink: A Labor of Love
frogandcode
138
21k
A designer walks into a library…
pauljervisheath
201
23k
Thoughts on Productivity
jonyablonski
60
3.9k
[RailsConf 2023] Rails as a piece of cake
palkan
28
4.1k
Product Roadmaps are Hard
iamctodd
45
9.8k
Practical Orchestrator
shlominoach
183
9.8k
The MySQL Ecosystem @ GitHub 2015
samlambert
244
12k
The Illustrated Children's Guide to Kubernetes
chrisshort
32
47k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k
Rebuilding a faster, lazier Slack
samanthasiow
74
8.3k
GraphQLの誤解/rethinking-graphql
sonatard
56
9.3k
Transcript
Compose 「急いで」キャッチアップする
名はすいみー 23卒な学生
個人アプリの Composeの移行作業 やってるよ
4 やっていること 既存のアプリで移行作業 やってみる
5 FragmentをまるっとCompose化 override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState:
Bundle? ): View { return ComposeView(requireContext()).apply { setContent { // In Compose World
6 アノテーションを付けたもの/付いてるものであ れば、他のcomposable関数を呼び出せる。 Text(“テキスト”) @Compose fun TextView() { Text(“テキスト”) }
7 Viewの配置はどうやるん? 基本的にはColumn / Row / Boxで対応できる 困ったらConstraintLayout Column {
Row { Text(“1行目”) Text(“1列目”) Text(“2行目”) Text(“2列目”) Text(“3行目”) Text(“3列目”) } }
8 ネスト多くなっちゃうけど大丈夫なん? →Composeは複数測定を回避してくれるので 大丈夫! とはいえ、ネスト祭りになると可読性と保守性が 落ちる 素直にConstraintLayout使っていき!
9 マージンどうやって取るん? Modifierを引数に渡す → padding基調 → marginを取るには上の階層にpadding Column(Modifier.padding(16.dp)) { Text(“一行目”,
Modifier.padding(8.dp)) Text(“二行目”, Modifier.padding(8.dp)) Text(“三行目”, Modifier.padding(16.dp)) }
10 素朴な疑問 ファイル分けどうやってやるん?? →AndroidViewだと悩まなかった 共通化出来るからこそ気になった
11 わいのGithub参考にしたらええ 詳しい人
12 アトミックデザイン的な分け方していた -> HogeComponent.ktにUIパーツの 最小単位(ボタン、テキスト)を作る。 → HogeScreen.ktに画面のcomposable関数を 一つだけ定義する @HogeScreen() =
{ … } →別画面でも使えるものに対しては commonディレクトリに入れてる
13 Viewの状態はどうするん? val name = remember { mutableStateOf(“”) } TextField(
value = name, onValueChange = { name = it } ) なんか、ViewModel不要論あるけども どうなん??
14 状態を保持するクラスは関心の分離の観点で必 要 今はライフサイクルの同期と コルーチンとの相性の点など で結果論ViewModelを使っているだけ 別にViewModelじゃなくてもよい 詳しい人
15 liveDataをstateとして扱う // ViewModel private val _name = MutableLiveData(“”) val
name: LiveData<String> = _name // Compose val name by viewModel.hoge.observeAsState(“”)
16 かんそう Composeそんなに難しくないよ! 初学者はComposeから! とはいえ、AndroidViewは業務でまだ触る
thank you