在 Jetpack Compose 中自定义 Switch 可组合项的选定/未选定背景？

Question

我正在使用 Switch Composable，我想为其提供选定和未选定状态的自定义背景。我怎样才能做到这一点？

var switchState by remember { mutableStateOf(false) }

Switch(
   checked = switchState,
   onCheckedChange = { switchState = !switchState }                          
)

Answer 1

您可以使用该属性自定义拇指和卡车的颜色colors。如果您还想自定义背景，可以使用background修改器。

就像是：

var switchState by remember { mutableStateOf(false) }

Switch(
    checked = switchState,
    onCheckedChange = { switchState = !switchState },
    colors  = SwitchDefaults.colors(
        checkedThumbColor = Teal200,
        checkedTrackColor = Teal200,
        uncheckedThumbColor = Yellow,
        uncheckedTrackColor= Yellow,
    ),
    modifier = Modifier.background(if (switchState) Blue else Red )
)