当 LazyColumn 在后台时，Compose Dialog 在键盘外观上关闭

Question

我有一个布局，其中 LazyColumn 中的每个项目都可以显示一个特定于项目的对话框。 Dialogs 显示并工作正常，除了一些较大的，每当我尝试在其中一个对话框中编辑文本时 TextFields 它会触发对话框消失。

我尝试了很多不同的方法，最奇怪的是对话框工作正常并且允许我编辑文本字段如果我只滚动LazyColumn 甚至 1 项，然后再尝试显示对话框。

已证明很难在简单的设置中重现该问题，因为即使更改我的代码的基本元素也会使错误消失，但我最终还是成功了。该错误的出现似乎取决于 LazyColumn 为 Scrollable 以及键盘为文本类型。接下来是一个有点长的代码示例和一个显示问题的 GIF：

@Composable
fun JointCourseTemplate(courseTemplateDto: CourseTemplateDto) {
    LazyColumn(
        //state= LazyListState()
    ){
        for(i in 0..4){
            item { TestPart(i = i) }
            for (j in 0..8){
                item { TestItem(i = j) }
            }
        }

    }
}

@Composable
fun TestPart(i:Int) {
    var showDialog by remember {
        mutableStateOf(false)
    }
    Row(Modifier.padding(8.dp)) {
        Text("part"+i)
        Button(onClick = { showDialog=true }) {
            Text("show dialog")
        }
    }
    
    PartDialog(showDialog = showDialog, hideDialog = {showDialog=false}) 
}

@Composable
fun TestItem(i:Int) {
    Row(Modifier.padding(8.dp)) {
        Text("item"+i)
        Button(onClick = { /*TODO*/ }) {
            Text("show dialog")
        }
    }
}

@OptIn(ExperimentalComposeUiApi::class)
@Composable
fun PartDialog(showDialog:Boolean, hideDialog: () -> Unit) {
    var text by remember {
        mutableStateOf("")
    }
    if (showDialog) {
        Dialog(properties = DialogProperties(
            dismissOnClickOutside = false,
            usePlatformDefaultWidth = false
        ),
            onDismissRequest = { hideDialog() }) {
            Surface(
                modifier = Modifier
                    //.wrapContentHeight()
                    //.fillMaxWidth(0.9f)
                    .width(400.dp)
                    .height(600.dp),
                shape = RoundedCornerShape(10.dp)
            ) {
                Column {
                    Text(text = "Some Dialog")
                    OutlinedTextField(value = text, onValueChange = {text=it}, label = { Text(text = "TroubleMaker")})
                }
            }
        }
    }
}

Answer 1

我确信这是一个需要 google 修复的错误，但是简单的解决方案是将 state 参数添加到 LazyColumn，如图所示。

val listState by remember{mutableStateOf(LazyListState())}
LazyColumn(state = listState  ){...}

我意识到这是一个相当小众的错误，但也许它可以帮助其他人节省时间

编辑

这显然是错误的，而且 dindt 总是有效。不确定为什么它第一次起作用

Answer 2

此问题是由于您从位于屏幕底部的惰性单元格打开对话框所致。因此，当键盘出现时，这个单元格变得不可见，并从视图树中移除。我会说这是有意为之的行为。

我建议您将对话框从 LazyColumn 移走。也许您需要有关要在对话框中显示的特定项目的信息，您可以存储所选项目而不是布尔值：

val (selectedDialogItem, setSelectedItem) = remember { mutableStateOf<Int?>(null) }
LazyColumn {
    items(4) { i ->
        Row(Modifier.padding(8.dp)) {
            Text("part"+i)
            Button(onClick = {
                setSelectedItem(i)
            }) {
                Text("show dialog")
            }
        }
    }
}
if (selectedDialogItem != null) {
    Dialog(
        // ...
    )
}

p.s。我在这里没有使用委托来允许 selectedDialogItem 在 if 块

中进行智能转换

当 LazyColumn 在后台时，Compose Dialog 在键盘外观上关闭

Compose Dialog closing on keyboard appearance when LazyColumn is in background

keyboard

android

dialog

android-jetpack-compose

lazycolumn