Compose「急いで」キャッチアップする

Transcript

1. Compose 「急いで」キャッチアップする
2. 名はすいみー 23卒な学生
3. 個人アプリの Composeの移行作業 やってるよ
4. 4 やっていること 既存のアプリで移行作業 やってみる
5. 5 FragmentをまるっとCompose化 override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle? ): View { return ComposeView(requireContext()).apply { setContent { // In Compose World
6. 6 アノテーションを付けたもの/付いてるものであ れば、他のcomposable関数を呼び出せる。 Text(“テキスト”) @Compose fun TextView() { Text(“テキスト”) }
7. 7 Viewの配置はどうやるん？ 基本的にはColumn / Row / Boxで対応できる 困ったらConstraintLayout Column { Row { Text(“1行目”) Text(“1列目”) Text(“2行目”) Text(“2列目”) Text(“3行目”) Text(“3列目”) } }
8. 8 ネスト多くなっちゃうけど大丈夫なん？ →Composeは複数測定を回避してくれるので　 大丈夫！ とはいえ、ネスト祭りになると可読性と保守性が 落ちる 素直にConstraintLayout使っていき！
9. 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. 10 素朴な疑問 ファイル分けどうやってやるん？？ →AndroidViewだと悩まなかった 　共通化出来るからこそ気になった
11. 11 わいのGithub参考にしたらええ 詳しい人
12. 12 アトミックデザイン的な分け方していた -> HogeComponent.ktにUIパーツの 　最小単位（ボタン、テキスト）を作る。 → HogeScreen.ktに画面のcomposable関数を 一つだけ定義する 　@HogeScreen() = { … } →別画面でも使えるものに対しては 　commonディレクトリに入れてる
13. 13 Viewの状態はどうするん？ val name = remember { mutableStateOf(“”) } TextField( value = name, onValueChange = { name = it } ) なんか、ViewModel不要論あるけども どうなん？？
14. 14 状態を保持するクラスは関心の分離の観点で必 要 今はライフサイクルの同期と コルーチンとの相性の点など で結果論ViewModelを使っているだけ 別にViewModelじゃなくてもよい 詳しい人
15. 15 liveDataをstateとして扱う // ViewModel private val _name = MutableLiveData(“”) val name: LiveData<String> = _name // Compose val name by viewModel.hoge.observeAsState(“”)
16. 16 かんそう Composeそんなに難しくないよ！ 初学者はComposeから！ とはいえ、AndroidViewは業務でまだ触る
17. thank you