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
24
Compose「急いで」キャッチアップする
Swimmy
April 12, 2022
Tweet
Share
More Decks by Swimmy
See All by Swimmy
違いがワカルKotlinプログラマーへの道
reoandroider
0
140
違いのワカル Kotlinプログラマーへの道
reoandroider
0
220
[Jetpack Compose] 原理から見るSkippable対応
reoandroider
1
330
Androdアプリ開発におけるネストスクロール問題と向き合うの説明用途
reoandroider
0
2.8k
Androdアプリ開発におけるネストスクロール問題と向き合うの説明用途
reoandroider
0
2.7k
Androdアプリ開発におけるネストスクロール問題と向き合うの説明用途~NestedScrollInteropConnectionは何してるの?編~
reoandroider
0
2.5k
Roborazziを最大限に活用する(導入編)
reoandroider
0
300
Master of NestedScroll
reoandroider
0
14k
Jetpack_Composeで_半円のプログレスバーを作った話
reoandroider
0
410
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
695
190k
Building Adaptive Systems
keathley
43
2.7k
Making Projects Easy
brettharned
116
6.3k
GraphQLとの向き合い方2022年版
quramy
49
14k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
How GitHub (no longer) Works
holman
314
140k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Why Our Code Smells
bkeepers
PRO
336
57k
Practical Orchestrator
shlominoach
189
11k
We Have a Design System, Now What?
morganepeng
53
7.7k
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