[英]How to integrate AlertDialog with Navigation component in Jetpack Compose?
I am using Jetpack Compose and the Android navigation component.我正在使用 Jetpack Compose 和 Android 导航组件。 When I am on a screen with an
AlertDialog
, I am unable to navigate back.当我在带有
AlertDialog
的屏幕上时,我无法返回。 I guess it's due to the AlertDialog
catching the back button event.我猜这是由于
AlertDialog
捕获了后退按钮事件。 However I don't know how to connect the AlertDialog
to the navigation component?但是我不知道如何将
AlertDialog
连接到导航组件? Is there any official way or best practice to do this?是否有任何官方方式或最佳实践来做到这一点? Here's my code:
这是我的代码:
// 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))
}
}
}
}
}
}
As per the dialog
documentation :根据
dialog
文档:
This is suitable only when this dialog represents a separate screen in your app that needs its own lifecycle and saved state, independent of any other destination in your navigation graph.
仅当此对话框表示您的应用程序中需要其自己的生命周期和保存状态的单独屏幕时,此对话框才适用,独立于导航图中的任何其他目的地。 For use cases such as
AlertDialog
, you should use those APIs directly in thecomposable
destination that wants to show that dialog.对于
AlertDialog
等用例,您应该直接在要显示该对话框的composable
目标中使用这些 API。
So you shouldn't be using a dialog
destination at all: a dialog
destination is specifically and only for providing the content
lambda of a regular Dialog
.因此,您根本不应该使用
dialog
目标: dialog
目标专门且仅用于提供常规Dialog
的content
lambda。 What your code is actually doing is creating an empty Dialog
(ie, you don't emit any composables in the lambda you pass to dialog
, then creating another AlertDialog
stacked on top of that empty dialog
. That's not what you want to be doing.您的代码实际上在做的是创建一个空
Dialog
(即,您不会在传递给dialog
的 lambda 中发出任何可组合项,然后在该空dialog
顶部创建另一个AlertDialog
。这不是您想要做的。
Instead, you should be following the AlertDialog
docs and directly creating the AlertDialog
where you want it to be used, setting your own boolean for when it should be shown/hidden.相反,您应该遵循
AlertDialog
文档并直接在您希望使用它的位置创建AlertDialog
,设置您自己的布尔值以了解何时显示/隐藏它。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.