ปลายทางของกล่องโต้ตอบ

ในการนำทางของ Android คำว่าปลายทางของกล่องโต้ตอบหมายถึงปลายทาง ภายในกราฟการนำทางของแอป ซึ่งจะอยู่ในรูปแบบของหน้าต่างกล่องโต้ตอบ วางซ้อนองค์ประกอบและเนื้อหา UI ของแอป

เนื่องจากปลายทางของกล่องโต้ตอบปรากฏเหนือปลายทางที่โฮสต์ซึ่งเติมข้อมูลใน โฮสต์การนำทาง มีสิ่งสำคัญบางอย่างที่ควรพิจารณาเกี่ยวกับ ปลายทางโต้ตอบกับแบ็กสแต็กของ NavController

กล่องโต้ตอบที่ประกอบกันได้

หากต้องการสร้างปลายทางของกล่องโต้ตอบใน "เขียน" ให้เพิ่มปลายทางไปยัง NavHost โดยใช้ฟังก์ชัน dialog() โดยหลักแล้ว ฟังก์ชันนี้ทำงานเหมือนกับ 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 Composable แต่ เนื่องจากเป็นปลายทางของกล่องโต้ตอบ NavHost จะแสดง URL ภายใน Dialog

ปลายทางกล่องโต้ตอบจะปรากฏเหนือปลายทางก่อนหน้าใน NavHost ใช้ เมื่อกล่องโต้ตอบแสดงหน้าจอแยกต่างหากในแอปของคุณ ซึ่งจำเป็นต้องมีหน้าจอแยกต่างหาก วงจรและสถานะที่บันทึกไว้ โดยไม่เกี่ยวข้องกับปลายทางอื่นๆ ใน กราฟการนำทาง คุณอาจต้องการใช้ AlertDialog หรือสิ่งที่เกี่ยวข้อง Composable ถ้าคุณต้องการกล่องโต้ตอบสำหรับพรอมต์ที่ซับซ้อนน้อยกว่า เช่น ยืนยัน

Kotlin DSL

หากคุณทำงานกับ Fragment และกำลังใช้ Kotlin DSL เพื่อ การสร้างกราฟ การเพิ่มปลายทางของกล่องโต้ตอบจะคล้ายกันมากกับเมื่อใช้ เขียน

ลองดูว่าในข้อมูลโค้ดต่อไปนี้ใช้ฟังก์ชัน 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>