في التنقل على Android، يشير مصطلح وجهة مربع الحوار إلى الوجهات ضمن الرسم البياني للتنقل في التطبيق والتي تكون على شكل نوافذ مربعات حوار، والتي تظهر فيها عناصر واجهة المستخدم والمحتوى.
بما أنّ وجهات مربّعات الحوار تظهر فوق الوجهات المستضافة التي تملأ مضيف التنقّل، هناك بعض الاعتبارات المهمة بشأن كيفية تفاعل وجهات الحوار مع حزمة الواجهة الخلفية لـ NavController
.
يمكن إنشاء مربّع حوار
لإنشاء وجهة لمربّع حوار في ميزة "إنشاء"، أضِف وجهة إلى NavHost
باستخدام الدالة dialog()
. تعمل الدالة بشكل أساسي مثل composable()
، ولكنها تنشئ وجهة مربّع حوار فقط وليس وجهة مستضافة.
فكّر في المثال التالي:
@Composable
fun SettingsDialog(){
Text("Settings")
// ...
}
@Composable
fun MyApp() {
val navController = rememberNavController()
NavHost(navController, startDestination = "home") {
composable("home") { Home(onNavigateToHome = { navController.navigate("home") }) }
dialog("settings") { SettingsDialog(onNavigateToSettingsDialog = { navController.navigate("settings") }) }
}
}
- وجهة البداية هي
Home
قابلة للإنشاء. وبما أنّها تستخدمcomposable()
، فهي وجهة مستضافة. - الوجهة الأخرى هي
SettingsDialog
القابل للإنشاء. وهي وجهة لمربّع الحوار لأنّ الدالةdialog()
تضيفه إلى الرسم البياني. عندما ينتقل المستخدم منHome
إلىSettingsDialog
، يظهر الاسم الأخير فوقHome
. - مع أنّ
SettingsDialog
لا يتضمن عنصرDialog
القابل للإنشاء نفسه، لأنه وجهة مربّع حوار، يعرضهNavHost
ضمنDialog
.
تظهر وجهات مربّع الحوار فوق الوجهة السابقة في NavHost
.
يمكنك استخدامها عندما يمثل مربع الحوار شاشة منفصلة في تطبيقك تحتاج إلى دورة حياة خاصة بها وحالتها المحفوظة، بغض النظر عن أي وجهة أخرى في الرسم البياني للتنقل. قد تفضّل استخدام AlertDialog
أو عنصر قابل
للإنشاء إذا كنت تريد مربّع حوار لطلب أقل تعقيدًا، مثل
تأكيد.
خدمة Kotlin DSL
إذا كنت تعمل على الأجزاء وكنت تستخدم Kotlin DSL لإنشاء الرسم البياني، تكون إضافة وجهة لمربع الحوار مشابهة جدًا عند استخدام Compose.
اطّلِع على كيفية استخدام المقتطف التالي لدالة dialog()
أيضًا لإضافة وجهة مربّع حوار تستخدم جزءًا:
// Add the graph to the NavController with `createGraph()`.
navController.graph = navController.createGraph(
startDestination = "home"
) {
// Associate the "home" destination with the HomeFragment.
fragment<HomeFragment>("home") {
label = "Home"
}
// Define the "settings" destination as a dialog using DialogFragment.
dialog<SettingsDialogFragment>("settings") {
label = "Settings Dialog"
}
}
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>