🛠️

AndroidViewからJetpackComposeを表示する方法

2024/04/10に公開

近年、JetpackComposeがデファクトスタンダードになる傾向にあるが、昔のアプリでは、AndroidViewからJetpackComposeに置き換えないとならない。

今回は、いろいろなことはすっ飛ばして、超簡単にAndroidViewからJetpackComposeに移行するサンプルプロジェクトを作成してみる。

■やること

今回は、AndroidStudioのテンプレートから作れるAndroidViewプロジェクトに対して、JetpackComposeに置き換えたサンプルを作成する。

■手順

  1. AndroidStudioのテンプレートから作れるAndroidViewプロジェクトを選択する
  2. JetpackComposeに必要なライブラリをインストールする(今回は過去のJetpackComposeプロジェクトから移植して対応)
  3. テキストだけ表示するCompose画面を作成する
  4. FragmentのonCreateからsetContentを用いて、3で作成した画面を呼び出す

MainActivity

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
//        setContentView(R.layout.activity_main)    既存のAndroidView表示はコメントアウトして表示させない
        setContent {
            GreetingScreen(message = "AndroidViewプロジェクトから\nJetpackComposeの表示だよ!")
        }
    }
}

GreetingScreen.kt

@Composable
fun GreetingScreen(message: String, modifier: Modifier = Modifier) {
    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Text(
            text = message,
            modifier = modifier
        )
    }
}

★作成したサンプルプロジェクトの画面SS

★一応、作成したサンプルはGithubにあげています。
https://github.com/KZTkotlin/ViewToCompose

■既存アプリからの移行するためのポイント

箇条書きでポイントだけかいつまんで書いておきます。

  • AndroidViewの画面パーツを洗い出して、Composeでの対応方針を固める
  • 処理に関しては、既存のものを流用できるものは行い、できないものは新規で処理を作成する
  • ComposeではFlowが使用できるので、移行したほうが良さそうなものは移行する
  • 遷移処理はAndroidViewとComposeで、かなり処理系が異なるので、最初に基盤部分を作成する

あとは、思いついたら追記します。

Discussion