ダイアログのデスティネーション

Android のナビゲーションでは、「ダイアログのデスティネーション」という用語は、アプリの UI 要素とコンテンツをオーバーレイするダイアログ ウィンドウの形式をとる、アプリのナビゲーション グラフ内のデスティネーションを指します。

ダイアログのデスティネーションは、ホストされているデスティネーションの上に表示されるためです。 使用する場合、ダイアログの移動方法に関して デスティネーションは NavController のバックスタックとやり取りします。

Dialog コンポーザブル

Compose でダイアログのデスティネーションを作成するには、dialog() 関数を使用して NavHost にデスティネーションを追加します。この関数は基本的に composable と同じように動作しますが、ホストされているデスティネーションではなくダイアログのデスティネーションを作成します。

次の例を考えてみましょう。

@Serializable
object Home
@Serializable
object Settings
@Composable
fun HomeScreen(onNavigateToSettings: () -> Unit){
    Column {
        Text("Home")
        Button(onClick = onNavigateToSettings){
            Text("Open settings")
        }
    }
}

// This screen will be displayed as a dialog
@Composable
fun SettingsScreen(){
    Text("Settings")
    // ...
}

@Composable
fun MyApp() {
    val navController = rememberNavController()
    NavHost(navController, startDestination = Home) {
        composable<Home> { HomeScreen(onNavigateToSettings = { navController.navigate(route = Settings) }) }
        dialog<Settings> { SettingsScreen() }
    }
}
  1. 開始デスティネーションは Home ルートを使用します。なぜなら、 composable() はそれをグラフに追加します。これはホストされているデスティネーションです。
  2. もう一方の宛先は Settings ルートを使用します。
    • 同様に、dialog() がこれをグラフに追加するため、ダイアログになります。 あります。
    • ユーザーが HomeScreen から SettingsScreen に移動すると、 後者は HomeScreen 上に表示されます。
  3. SettingsScreen はダイアログのデスティネーションであるため、Dialog コンポーザブル自体は含まれていませんが、NavHost によって Dialog 内に表示されます。

ダイアログのデスティネーションは、NavHost 内の前のデスティネーションの上に表示されます。使用 ダイアログが、独自の画面を必要とするアプリ内の別の画面を表している場合は、 保存された状態を、同じインフラストラクチャ内の 作成します。確認などのそれほど複雑でないプロンプトのダイアログが必要な場合は、AlertDialog または関連するコンポーザブルを使用することをおすすめします。

Kotlin DSL

フラグメントを使用していて、Kotlin DSL を使ってグラフを作成する場合、ダイアログのデスティネーションを追加する方法は Compose を使用する場合とよく似ています。

次のスニペットでも、dialog() 関数を使用して、フラグメントを使用するダイアログのデスティネーションを追加しています。

// Define destinations with serializable classes or objects
@Serializable
object Home
@Serializable
object Settings

// Add the graph to the NavController with `createGraph()`.
navController.graph = navController.createGraph(
    startDestination = Home
) {
    // Associate the home route with the HomeFragment.
    fragment<HomeFragment, Home> {
        label = "Home"
    }

    // Define the settings destination as a dialog using DialogFragment.
    dialog<SettingsFragment, Settings> {
        label = "Settings"
    }
}

XML

既存の DialogFragment がある場合は、<dialog> 要素を使用して以下を行います。 次の例に示すように、ダイアログをナビゲーション グラフに追加します。

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/nav_graph">

...

<dialog
    android:id="@+id/my_dialog_fragment"
    android:name="androidx.navigation.myapp.MyDialogFragment">
    <argument android:name="myarg" android:defaultValue="@null" />
        <action
            android:id="@+id/myaction"
            app:destination="@+id/another_destination"/>
</dialog>

...

</navigation>