Как избежать дублирования флажков в моем LazyVerticalGrid в Jetpack Compose? ⇐ Android

[Anonymous]

Я пытаюсь создать экран отчета об ошибке. Пользователь должен ввести описание ошибки и может установить различные флажки. Затем я извлекаю эту информацию, чтобы написать с ней электронное письмо.
Моя проблема в том, что флажки воссоздаются при вводе текста в TextField или при повороте экрана.Почему это происходит и как этого избежать?
BugItems — это фиксированные элементы, которые я беру в массиве ресурсов. Я создал два класса данных для представления отчета об ошибке.

Код: Выделить всё

data class BugReport(
val message: String,
val bugItems: List,
)

data class BugItem(
val title: String,
val completed: Boolean = false,
)

Это составной элемент экрана:

Код: Выделить всё

@ExperimentalFoundationApi
@Composable
fun BugReportScreen(
modifier: Modifier = Modifier
) {
val launcher = rememberLauncherForActivityResult(
contract = ActivityResultContracts.StartActivityForResult(),
onResult = { }
)

val message = remember { mutableStateOf("") }

val bugItems = remember {
mutableStateListOf()
}

stringArrayResource(id = R.array.bug_report).forEach {
bugItems += BugItem(title = it, completed = false)
}
val bugReport = remember {
mutableStateOf(BugReport(message.value, bugItems))
}

Box(
modifier = modifier,
) {
Column(
modifier = modifier
.fillMaxSize()
.verticalScroll(rememberScrollState())
) {

Box(
modifier = Modifier
.fillMaxWidth()
.height(50.dp)
)

GenericToolbar(title = "Bug Report")
Spacer(modifier = Modifier.weight(1f))
Text(text = stringResource(id = R.string.bug_intro))
Text(text = stringResource(id = R.string.bug_description))

TextFieldBugDescription(message)
Text(text = stringResource(id = R.string.bug_check))

LazyVerticalGrid(
modifier = Modifier.heightIn(max = 1000.dp),
columns = GridCells.Fixed(2),
content = {
items(bugReport.value.bugItems.size) { index ->
Row(
modifier = Modifier.padding(1.dp),
verticalAlignment = Alignment.CenterVertically
) {

Checkbox(
checked = bugItems[index].completed,
onCheckedChange = { checked ->
bugItems[index] = bugItems[index].copy(completed = checked)
}
)
Text(
text = bugItems[index].title,
style = MaterialTheme.typography.bodyLarge,
)
}
}

}

)
Text(text = stringResource(id = R.string.bug_send))
Row(
horizontalArrangement = Arrangement.Center,
modifier = Modifier.fillMaxWidth(),
) {
LPlusButton(
onClick = {
sendEmail(launcher, bugReport)
},
text = { Text(text = stringResource(R.string.send_email)) },
leadingIcon = {
Icon(
imageVector = LPlusIcons.Email,
contentDescription = stringResource(R.string.send_email)
)
},
modifier = Modifier
.padding(horizontal = 24.dp)
.widthIn(364.dp)
.fillMaxWidth(),
)
}
}
}
}

Код: Выделить всё

@Composable
fun TextFieldBugDescription(message: MutableState) {
TextField(
value = message.value,
onValueChange = { message.value = it },
label = { Text(stringResource(id = R.string.bug_label)) },
maxLines = 2,
modifier = Modifier
.padding(20.dp)
.fillMaxWidth()
.height(200.dp)
)
}

Как видно на первом снимке экрана, флажки установлены правильно:


Но когда я активирую TextField и печатаю текст, элементы создаются заново. И то же самое произойдет, если я поверну экран:



Подробнее здесь: https://stackoverflow.com/questions/790 ... ck-compose