如何在JetpackCompose中将AlertDialog与导航组件集成

Question

我使用的是Jetpack Compose和Android导航组件。当我在带有AlertDialog的屏幕上时，我无法向后导航。我想这是由于AlertDialog捕捉到了后退按钮事件。但是我不知道如何将AlertDialog连接到导航组件？有什么官方方法或最佳实践可以做到这一点吗？这是我的代码：

// sample with a screen and a "navigate to dialog" button.
// once the button is pressed, an AlertDialog is shown.
// Using the back button while the AlertDialog is open has no effect ):    
@Composable
fun MyNavHost(navController: NavHostController, modifier: Modifier = Modifier) {
NavHost(
navController = navController,
startDestination = "start_route",
modifier = modifier
) {
composable("start_route") {
Text("start screen")
}

// this is my screen with the dialog
dialog("dialog_route") {
AlertDialog(
onDismissRequest = {  /*TODO*/ }, // guess I need to connect this to the navigation component? bug how?
title = {
Text(text = "Dialog title")
},
text = {
Text(text = "I am a dialog")
},
buttons = {}
)
}
}
}

class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
MyJetpackComposeTheme {
val navController = rememberNavController()
Scaffold() { innerPadding ->
Column {
Button(onClick = { navController.navigate("dialog_route") }) {
Text("navigate to dialog")
}
MyNavHost(navController, modifier = Modifier.padding(innerPadding))
}
}
}
}
}
}

Answer 1

根据dialog文档：

只有当此对话框代表应用程序中需要其自身生命周期和保存状态的单独屏幕时，才适用于此对话框，而不依赖于导航图中的任何其他目的地对于AlertDialog这样的用例，您应该直接在想要显示该对话框的composable目标中使用这些API

因此根本不应该使用dialog目的地：dialog目的地专门用于提供常规Dialog的contentlambda。您的代码实际上正在做的是创建一个空的Dialog(即，您在传递给dialog的lambda中不发射任何可组合元素，然后在该空的dialog之上创建另一个AlertDialog。这不是您想要做的。

相反，您应该遵循AlertDialog文档，并在您希望使用的位置直接创建AlertDialog，设置自己的布尔值以确定何时显示/隐藏。