Jetpack Compose之选择器使用实例讲解

@Composable
fun Checkbox(
    checked: Boolean, // 是否被选中
    onCheckedChange: ((Boolean) -> Unit)?, // 当复选框被点击时的回调
    modifier: Modifier = Modifier,
    enabled: Boolean = true, // 是否启用复选框
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    colors: CheckboxColors = CheckboxDefaults.colors() // 复选框的演示组
) 

  @Composable
    fun CheckBoxDemo()
    {
        val checkedState = remember {
            mutableStateOf(true)
        }
        Checkbox(checked = checkedState.value, onCheckedChange = {
            checkedState.value = it
        },
        colors = CheckboxDefaults.colors(checkedColor = Color(0xFF0079D3)))
    }

    @Composable
    fun TriStateCheckBoxDemo()
    {
        val(state,onStateChange) = remember {
            mutableStateOf(true)
        }
        val(state2,onStateChange2) = remember {
            mutableStateOf(true)
        }
        val parentState = remember(state, state2) {
            if(state && state2) ToggleableState.On
            else if(!state && !state2) ToggleableState.Off
            else ToggleableState.Indeterminate
        }
        val onParentClick = {
            val s = parentState != ToggleableState.On
            onStateChange(s)
            onStateChange2(s)
        }
        Column(modifier = Modifier.padding(10.dp,0.dp,0.dp,0.dp)) {
            TriStateCheckbox(state = parentState, onClick = onParentClick,
                colors = CheckboxDefaults.colors(checkedColor = MaterialTheme.colors.primary)
            )
            Checkbox(checked = state, onCheckedChange = onStateChange)
            Checkbox(checked = state2, onCheckedChange = onStateChange2)
        }
    }

@Composable
@OptIn(ExperimentalMaterialApi::class)
fun Switch(
    checked: Boolean, // 开关的状态
    onCheckedChange: ((Boolean) -> Unit)?, 点击开关的回调，会获得最新的开关状态
    modifier: Modifier = Modifier,
    enabled: Boolean = true, // 是否启用
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    colors: SwitchColors = SwitchDefaults.colors() // 开关组的颜色。
) 

  @Composable
    fun SwitchDemo()
    {
        val checkedState = remember {
            mutableStateOf(true)
        }
        Switch(checked = checkedState.value, onCheckedChange = {
            checkedState.value = it
        })
    }

@Composable
fun Slider(
    value: Float, // 进度值
    onValueChange: (Float) -> Unit, // 进度改变的监听
    modifier: Modifier = Modifier, // 修饰符
    enabled: Boolean = true,
    valueRange: ClosedFloatingPointRange<Float> = 0f..1f, // 进度值的范围默认是0到1
    /*@IntRange(from = 0)*/
    steps: Int = 0,
    onValueChangeFinished: (() -> Unit)? = null,
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    colors: SliderColors = SliderDefaults.colors() // 滑杆颜色设置，默认值是SliderDefaults.colors
)

    @Composable
    fun SliderDemo()
    {
        var sliderPosition by remember {
            mutableStateOf(0f)
        }
        Text(text = "%.1f".format(sliderPosition*100) + "%")
        Slider(value = sliderPosition, onValueChange = {sliderPosition = it})
    }