Navigation3を実装してみるPart1

はじめに

今回から、Compose3を使って遷移実装をしていきます。
まずは簡単な２画面の遷移実装をしていきます。

導入方法

まずは、以下２つにコードを追加し、ライブラリを使えるようにします

libs.versions.toml

navigation3 = "1.0.0-alpha09"
androidx-navigation3-runtime = { group = "androidx.navigation3", name = "navigation3-runtime", version.ref = "navigation3" }
androidx-navigation3-ui = { group = "androidx.navigation3", name = "navigation3-ui", version.ref = "navigation3" }

build.gradle

    implementation(libs.androidx.navigation3.runtime)
    implementation(libs.androidx.navigation3.ui)

これで導入は完了です

実装方法

次は実装方法です

MainActivity

// Navigation3のキーを定義
// 実用化する場合、Objectなどでキーをまとめておくのがいいと思いますが、今回はMainAvtivityにまとめて書いちゃいましょう
@Serializable
object Home : NavKey

@Serializable
object Detail : NavKey

@Composable
fun AppNavigation3(modifier: Modifier = Modifier) {
    // Navigation3のバックスタックを作成
    val backStack = rememberNavBackStack(Home)

    // NavDisplayを使用してナビゲーションを実装
    NavDisplay(
        backStack = backStack,
        entryProvider = entryProvider {
            entry<Home> {
                HomeScreen(
                    onNavigateToDetail = { backStack.add(Detail) }
                )
            }
            entry<Detail> {
                DetailScreen(
                    onNavigateBack = { backStack.removeLast() }
                )
            }
        },
        modifier = modifier
    )
}

これで無事２画面間の簡単な遷移実装ができましたね！
次からはもう少し複雑な遷移の実装をしてみようと思います

最後に

今年のDroidKaigiで一番気になっていたNavigation3の発表でさまざまな知見を得ることができましたが、便利な分要素が多いのでいつでも自分で見返せるように記事を書いてみました。
どなたかのお役に立てたら幸いです