带有复选框android compose的列表的所有选择选项

Question

当我单击“选择”选项时，它应该检查所有列表。我有一个对话框，其中包含用户列表和复选框。当我选中“全部”选项并将所有列表设置为 true 时，它不会反映在对话框中。当我关闭并打开对话框时，它将检查所有项目。我知道列表中的值设置为 true，但它不会重新组合列表中的项目。或者不更新复选框状态。

查看模型代码

var listOfRolesMaster = mutableStateListOf<AnnnouncementListData>()

API收集数据

 vm.listOfRolesMaster = data.data.users.toMutableStateList()

数据类

data class AnnnouncementListData(
var id: String,
var name: String,
var isCheck: Boolean,

）

打开对话框并检查项目的功能

@Composable
fun RoleSearchDialog(vm: AnnouncementViewModel) {
Dialog(
    onDismissRequest = {
        vm.isSendRoleDialog.value = false
    },
    properties = DialogProperties(
        usePlatformDefaultWidth = false, // experimental,
    )
) {
    Spacer(modifier = Modifier.height(20.dp))

    Column(
        modifier = Modifier
            .wrapContentHeight()
            .width(320.dp)
            .height(400.dp)
            .padding(all = 16.dp)
            .background(
                color = Color(0xFFFFFFFF),
                shape = RoundedCornerShape(15.dp)
            ),
        horizontalAlignment = Alignment.CenterHorizontally
    ) {

        /*Header*/
        Row(
            modifier = Modifier
                .fillMaxWidth()
                .clip(RoundedCornerShape(bottomStart = 15.dp, bottomEnd = 15.dp)),
            horizontalArrangement = Arrangement.SpaceBetween
        ) {

            Text(
                modifier = Modifier
                    .padding(16.dp)
                    .align(Alignment.CenterVertically),
                text = "Select Users",
                style = TextStyle(
                    fontFamily = FontFamily(Font(R.font.opensans_bold)),
                    fontSize = 16.sp,
                    color = Color(0xFFB20710)
                ),
                textAlign = TextAlign.Start
            )

            Image(
                modifier = Modifier
                    .size(48.dp)
                    .padding(10.dp)
                    .clip(RoundedCornerShape(10.dp))
                    .clickable {
                        vm.isSendRoleDialog.value = false
                    },
                painter = painterResource(R.drawable.ic_attachment_remove), contentDescription = "Icon"
            )
        }

            var allCheckedState = remember { mutableStateOf(vm.isAllRoleSelected.value) }


            Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(start = 16.dp, top = 5.dp),
                horizontalArrangement = Arrangement.Start,
            ) {
                Text(
                    text = "All",
                    modifier = Modifier
                        .padding(start = 10.dp, end = 16.dp)
                        .weight(0.8f)
                        .align(Alignment.CenterVertically),
                    style = TextStyle(
                        fontFamily = FontFamily(
                            Font(
                                resId = R.font.opensans_semibold
                            )
                        ),
                        fontSize = 12.sp,
                        color = Color(0xFF121212),
                    )
                )

                Checkbox(
                    checked = allCheckedState.value,
                    onCheckedChange = {
                        allCheckedState.value = it
                        vm.listOfRolesMaster.forEachIndexed  { index , item ->
                            vm.listOfRolesMaster[index].isCheck = it
                        }
                        vm.isAllRoleSelected.value = it
                    }
                )
            }


            vm.listOfRolesMaster.forEachIndexed { index, item ->

                Log.e(TAG, "ALL_FLOOR1 item ${item.isCheck}")
                var myState by remember { mutableStateOf(item.isCheck) }
                Log.e(TAG, "ALL_FLOOR myState = $myState == ${item.isCheck}")

                Row(
                    modifier = Modifier
                        .fillMaxWidth()
                        .padding(start = 16.dp, top = 5.dp),
                    horizontalArrangement = Arrangement.Start,
                ) {
                    Text(
                        text = item.name,
                        modifier = Modifier
                            .padding(start = 10.dp, end = 16.dp)
                            .weight(0.8f)
                            .align(Alignment.CenterVertically),
                        style = TextStyle(
                            fontFamily = FontFamily(
                                Font(
                                    resId = R.font.opensans_semibold
                                )
                            ),
                            fontSize = 12.sp,
                            color = Color(0xFF121212),
                        )
                    )

                    Checkbox(
                        checked = item.isCheck,
                        onCheckedChange = { isChecked ->
                            item.isCheck = isChecked
                        }
                    )
                }
       
        }
    }
}
}

当我将“item.isCheck”分配给 mystate 时。该值为 true，但 mystate 值返回 false。

var myState by remember { mutableStateOf(item.isCheck) }

Answer 1

即使您使用 mutableStateListOf()，Jetpack Compose 也只能检测您何时添加、删除或替换项目。它不会检测您何时修改项目。

因此，不要使用

vm.listOfRolesMaster[index].isCheck = it

修改现有对象的 isChecked 变量，而是分配一个新的修改项，如下所示：

onCheckedChange = {
    allCheckedState.value = it
    vm.listOfRolesMaster.forEachIndexed  { index , item ->
        vm.listOfRolesMaster[index] = vm.listOfRolesMaster[index].copy(isChecked = it)
    }
    vm.isAllRoleSelected.value = it
}