欢迎阅读本篇关于使用 Jetpack Compose 构建 RadioButton（单选按钮）的博客。Jetpack Compose 是 Google 发布的现代化 UI 工具包，用于构建 Android 界面。它的声明式设计使得 UI 开发更加简洁直观。

---

一、什么是 RadioButton？

RadioButton 是一个可以勾选的按钮，通常与其他 RadioButton 组成一组，并在该组中只能选择一个。它通常用于表示一组互斥选项，当用户选择一个新选项时，之前的选项会自动取消勾选。

二、使用 Jetpack Compose 构建 RadioButton

Jetpack Compose 提供了一个名为 RadioButton 的 composable 函数，可以方便地创建 RadioButton。下面是一个简单的例子

@Preview
@Composable
fun RadioButtonExample(){
    val options = listOf("Option1","Option2","Option3")
    var selectedOption by remember { mutableStateOf(options[0])}

    Column{
        options.forEach { text->
            Row(
                Modifier
                    .fillMaxWidth()
                    .padding(8.dp),
                verticalAlignment = Alignment.CenterVertically
            ) {
                RadioButton(selected = (text== selectedOption), onClick = { selectedOption =text})
                Text(text = text, style = MaterialTheme.typography.body1,
                modifier = Modifier.padding(start = 8.dp))
            }

        }
    }
}

 

在这个例子中，我们首先定义了一个包含三个选项的列表和一个用于记录当前选中选项的状态变量 selectedOption。然后我们在 Column 中为每个选项创建一个 Row，其中包含一个 RadioButton 和一个 Text。

RadioButton 的 selected 属性决定了这个 RadioButton 是否为选中状态。我们将它设为 text == selectedOption，表示当该选项的文本与 selectedOption 相等时，这个 RadioButton 为选中状态。

当用户点击某个 RadioButton 时，我们将 selectedOption 更新为这个 RadioButton 对应的文本，表示这个选项被选中。

结论

在这篇博客中，我们学习了如何使用 Jetpack Compose 构建 RadioButton。Jetpack Compose 提供了简单直观的接口来创建和管理 RadioButton，让我们可以用更少的代码和更高的生产力来构建 UI。