Jetpack Compose Dialog切换内容后无法动态更新高度的问题求助
解决Compose Dialog切换内容后高度不更新的问题
问题根源在于你给Column设置了.height(IntrinsicSize.Min)——这个修饰符会把Column的高度固定为初始渲染时的最小固有高度,后续切换选项导致内容变化时,高度不会重新计算。再加上Card没有明确设置自适应高度,进一步限制了Dialog的高度调整。
按以下两步修改即可解决:
- 移除Column的固定高度限制:删掉
.height(IntrinsicSize.Min),让Column根据内部内容自动计算高度。 - 给Card添加自适应高度修饰符:在Card的modifier里加上
.wrapContentHeight(),确保Card能随内容伸缩。
修改后的完整代码:
var type = remember { mutableStateOf("Adult") } Dialog( onDismissRequest = { onDismiss() }, properties = DialogProperties( dismissOnBackPress = true, dismissOnClickOutside = true ), ) { Card( shape = RoundedCornerShape(12.dp), modifier = Modifier .fillMaxWidth() .wrapContentHeight(), // 添加自适应高度 elevation = 8.dp ) { Column( modifier = Modifier .background(Color.White) .padding(top = 10.dp), // 移除IntrinsicSize.Min限制 horizontalAlignment = Alignment.CenterHorizontally ) { Row() { SemiBoldTextSmall( text = "Adult", textColor = if (type.value == "Adult") Color.Black else Color.LightGray, fontSize = 14.sp, modifier = Modifier .fillMaxWidth() .padding(10.dp) .weight(1f) .clickable { type.value = "Adult" }) SemiBoldTextSmall(text = "Kids", textColor = if (type.value == "Kids") Color.Black else Color.LightGray, fontSize = 14.sp, modifier = Modifier .fillMaxWidth() .padding(10.dp) .weight(1f) .clickable { type.value = "Kids" }) } if (type.value == "Kids") { EditBox(modifier = Modifier .padding(top = 10.dp, start = 20.dp, end = 20.dp) .background(color = Color.White, shape = RoundedCornerShape(10.dp)) .border( width = 1.dp, color = Color.LightGray, shape = RoundedCornerShape(10.dp) ) .wrapContentSize(), placeholder = "Mobile Number", text = "", textSize = 14.sp, keyboardType = KeyboardType.Number, onValueChange = { }) } else { EditBox(modifier = Modifier .padding(top = 30.dp, start = 20.dp, end = 20.dp) .background(color = Color.White, shape = RoundedCornerShape(10.dp)) .border( width = 1.dp, color = Color.LightGray, shape = RoundedCornerShape(10.dp) ) .wrapContentSize(), placeholder = "Name", text = "", textSize = 14.sp, onValueChange = { }) EditBox(modifier = Modifier .padding(top = 10.dp, start = 20.dp, end = 20.dp) .background(color = Color.White, shape = RoundedCornerShape(10.dp)) .border( width = 1.dp, color = Color.LightGray, shape = RoundedCornerShape(10.dp) ) .wrapContentSize(), placeholder = "Mobile Number", text = "", textSize = 14.sp, keyboardType = KeyboardType.Number, onValueChange = { }) } SemiBoldTextSmall(text = "+ ADD", textColor = Color.White, fontSize = 14.sp, modifier = Modifier .padding(top = 30.dp) .fillMaxWidth() .background(color = greenColor, shape = RectangleShape) .padding(10.dp) .clickable { onSubmit() }) } } }
额外注意:如果你的EditBox组件内部有固定高度设置,也需要确保它是自适应的,否则可能依然会限制整体高度。
内容的提问来源于stack exchange,提问作者user7341161
相关产品推荐
相关产品推荐

