アジェンダ段階 Compose for Deskopで始めるAndroid開発効率化ツールの作成

Transcript

1. Compose for Deskopで始める Android開発効率化ツールの作成 Droidkaigi 2022 Day01 Yusuke Katsuragawa / YUMEMI Inc.
2. 自己紹介 - 桂川 祐介 - 株式会社ゆめみ - Androidエンジニア - Twitter : @kaleidot725 - GitHub : kaleidot725
3. 本セッションで取り扱うこと
4. 本セッションで取り扱うこと - Compose for Desktopとは - Android開発効率化ツールの作成方法 - 開発環境のセットアップ方法 - プロジェクトのセットアップ方法 - ADBを利用したGUIツールの作成方法 - Compose
5. アジェンダ
6. アジェンダ 1. Compose for Desktopとは 2. どのようなツールを作るか 3. どのようにツールを作るか 4. おわりに
7. Compose for Desktopとは
8. 開発環境
9. プロジェクト作成
10. どんなツールを作るのか？
11. Andoroid端末の一覧を取得する
12. ADBコマンドを実行する
13. コマンド実行 - 作成する画面
14. View StateHolder Model
15. @Composable fun CommandItem ( title: String, detail: String, onExecute : () -> Unit, modifier : Modifier = Modifier ) { Card(modifier ) { Row( horizontalArrangement = Arrangement .spacedBy (8.dp), verticalAlignment = Alignment .CenterVertically , modifier = Modifier .padding(8.dp) ) { Column(modifier = Modifier .weight(0.9f, true)) { Text(text = title) Text(text = detail) } Button(onClick = { onExecute () }) { Text(text = Strings.EXECUTE) } } } } @Preview @Composable private fun CommandItem_Preview () { CommandItem( title = "ダークテーマ ON", detail = "端末のダークテーマ設定を ONにします", onExecute = {}, modifier = Modifier .fillMaxWidth().wrapContentWidth() ) } コマンド実行 - View層①
16. View StateHolder Model
17. @Composable fun CommandItem ( title: String, detail: String, onExecute : () -> Unit, modifier : Modifier = Modifier ) { Card(modifier ) { Row( horizontalArrangement = Arrangement .spacedBy (8.dp), verticalAlignment = Alignment .CenterVertically , modifier = Modifier .padding(8.dp) ) { Column(modifier = Modifier .weight(0.9f, true)) { Text(text = title) Text(text = detail) } Button(onClick = { onExecute () }) { Text(text = Strings.EXECUTE) } } } } @Preview @Composable private fun CommandItem_Preview () { CommandItem( title = "ダークテーマ ON", detail = "端末のダークテーマ設定を ONにします", onExecute = {}, modifier = Modifier .fillMaxWidth().wrapContentWidth() ) } コマンド実行 - StateHolder①
18. View StateHolder Model
19. @Composable fun CommandItem ( title: String, detail: String, onExecute : () -> Unit, modifier : Modifier = Modifier ) { Card(modifier ) { Row( horizontalArrangement = Arrangement .spacedBy (8.dp), verticalAlignment = Alignment .CenterVertically , modifier = Modifier .padding(8.dp) ) { Column(modifier = Modifier .weight(0.9f, true)) { Text(text = title) Text(text = detail) } Button(onClick = { onExecute () }) { Text(text = Strings.EXECUTE) } } } } @Preview @Composable private fun CommandItem_Preview () { CommandItem( title = "ダークテーマ ON", detail = "端末のダークテーマ設定を ONにします", onExecute = {}, modifier = Modifier .fillMaxWidth().wrapContentWidth() ) } コマンド実行 - Model①