如何在Jetpack Compose/Kotlin中实现单选Checkbox功能？

当前你的每个SelectOptionsCheckbox都独立维护自己的选中状态，所以会出现多选情况。要改成单选，核心是把状态统一放到父组件管理，具体修改如下：

1. 调整子组件，移除内部状态 #

让SelectOptionsCheckbox不再自己持有选中状态，改为接收父组件传递的状态和选项标识，点击时通知父组件选中当前选项：

@Composable
fun SelectOptionsCheckbox(
    optionId: String, // 选项的唯一标识，用来区分不同选项
    optionText: String, // 选项显示的文本
    isSelected: Boolean,
    onSelectOption: (String) -> Unit // 点击时回传选中的选项ID
) {
    Row(
        modifier = Modifier.clickable { onSelectOption(optionId) }, // 把整个Row设为可点击，提升交互体验
        verticalAlignment = Alignment.CenterVertically
    ) {
        Text(text = optionText)
        Spacer(modifier = Modifier.width(8.dp)) // 文本和图标之间加间距
        Icon(
            painter = CheckboxResource(isSelected = isSelected),
            contentDescription = if (isSelected) "已选中复选框" else "未选中复选框"
        )
    }
}

2. 父组件统一管理选中状态 #

在父组件中维护当前选中的选项ID，遍历选项列表渲染每个SelectOptionsCheckbox，并控制它们的选中状态：

@Composable
fun SingleSelectCheckboxList() {
    // 示例选项集合，每个选项包含唯一ID和显示文本
    val options = listOf(
        "opt1" to "选项A",
        "opt2" to "选项B",
        "opt3" to "选项C"
    )
    // 父组件维护选中的选项ID，初始为null表示未选中任何选项
    val selectedOptionId = remember { mutableStateOf<String?>(null) }

    Column(modifier = Modifier.padding(16.dp)) {
        options.forEach { (id, text) ->
            SelectOptionsCheckbox(
                optionId = id,
                optionText = text,
                isSelected = selectedOptionId.value == id,
                onSelectOption = { selectedId ->
                    // 更新选中ID，实现单选逻辑
                    selectedOptionId.value = selectedId
                }
            )
            Spacer(modifier = Modifier.height(12.dp))
        }
    }
}

3. 保留原图标逻辑组件 #

你的CheckboxResource组件无需修改，继续用来提供选中/未选中状态的图标：

@Composable
fun CheckboxResource(isSelected: Boolean): Painter {
    return if (isSelected) {
        painterResource(id = R.drawable.check_on)
    } else {
        painterResource(id = R.drawable.check_off)
    }
}

逻辑说明 #

• 所有选项的选中状态由父组件的selectedOptionId统一控制，同一时间只会有一个选项的isSelected为true，实现单选效果。
• 如果需要默认选中某个选项，只需初始化selectedOptionId为对应选项的ID即可，比如mutableStateOf("opt1")。

内容的提问来源于stack exchange，提问作者user19846644