可变状态复选框在选择后不改变外观 - Jetpack Compose
这里有一个类似的问题。我与其他一些解决方案一起尝试了这些解决方案,但仍然没有取得任何成功。
我在 Jetpack Compose 的对话框中有一个不同选项的清单。当选择 optionItem 时,我可以看到状态已更改,但复选框图标不会更新。
val _optionItems by remember {
mutableStateOf(
optionItemArray!!.map {
OptionItem(
label = it.label,
value = it.value,
number = it.number,
type = it.type,
subtitle = it.subtitle,
group = it.group,
matchType = it.matchType,
isSelected = it.isSelected,
isHidden = it.isHidden,
)
}
)
}
val optionItems: MutableList<OptionItem> = _optionItems as MutableList<OptionItem>
fun setOptionSelectedAtIndex(index: Int, isSelected: Boolean){
(_optionItems as MutableList<OptionItem>)[index] = _optionItems[index].copy(isSelected = !isSelected)
}
LazyColumn {
items(optionItems.size) { i ->
Row(
modifier = Modifier
.fillMaxWidth()
.clickable
{
optionItems.mapIndexed { j, item ->
if(i == j){
setOptionSelectedAtIndex(i, item.isSelected)
} else item
}
}
.padding(16.dp),
horizontalArrangement = Arrangement.SpaceBetween
) {
optionItems[i].label?.let { Text(text = it) }
if (optionItems[i].isSelected) {
Icon(
Icons.Filled.CheckBox,
contentDescription = "Selected"
)
} else {
Icon(
Icons.Filled.CheckBoxOutlineBlank,
contentDescription = "Not Selected"
)
}
}
}
}
}
我知道应该再次调用该列表,这就是我假设 setOptionSelectedAtIndex 函数应该做的事情,但我在弄清楚这一点时遇到了很多麻烦。
There is a similar question here. I tried these solutions along with some others and still not having any success.
I have a checklist for different options in a dialog in Jetpack Compose. When an optionItem is selected I can see that the state has changed, but the checkbox icon won't update.
val _optionItems by remember {
mutableStateOf(
optionItemArray!!.map {
OptionItem(
label = it.label,
value = it.value,
number = it.number,
type = it.type,
subtitle = it.subtitle,
group = it.group,
matchType = it.matchType,
isSelected = it.isSelected,
isHidden = it.isHidden,
)
}
)
}
val optionItems: MutableList<OptionItem> = _optionItems as MutableList<OptionItem>
fun setOptionSelectedAtIndex(index: Int, isSelected: Boolean){
(_optionItems as MutableList<OptionItem>)[index] = _optionItems[index].copy(isSelected = !isSelected)
}
LazyColumn {
items(optionItems.size) { i ->
Row(
modifier = Modifier
.fillMaxWidth()
.clickable
{
optionItems.mapIndexed { j, item ->
if(i == j){
setOptionSelectedAtIndex(i, item.isSelected)
} else item
}
}
.padding(16.dp),
horizontalArrangement = Arrangement.SpaceBetween
) {
optionItems[i].label?.let { Text(text = it) }
if (optionItems[i].isSelected) {
Icon(
Icons.Filled.CheckBox,
contentDescription = "Selected"
)
} else {
Icon(
Icons.Filled.CheckBoxOutlineBlank,
contentDescription = "Not Selected"
)
}
}
}
}
}
I know that the list is supposed to be called again, which is what I was assuming the setOptionSelectedAtIndex
function was supposed to do, but I'm having quite a lot of trouble figuring this out.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论