赣州晒房网门户网站服务器win7网站建设
文章目录
- 前言
 - Checkbox 复选框的含义
 - Checkbox 复选框的使用
 - Switch 单选框的含义
 - Switch 单选框的使用
 - Slider 滑竿组件的含义
 - Slider 滑竿组件的使用
 
- 总结
 
前言
随着移动端的技术不断更新迭代,Compose也运用的越来越广泛,很多人都开始学习Compose
本文主要介绍Compose中 选择器 的含义和基本用法
Checkbox 复选框的含义
Checkbox复选框允许用户从一个集合选择一个或多个项目,可以将一个选项打开或关闭
@Composable
fun Checkbox(checked: Boolean,                                      //是否被选中onCheckedChange: ((Boolean) -> Unit)?,                 //当复选框被点击的回调函数modifier: Modifier = Modifier,                         //修饰符enabled: Boolean = true,                               //是否启用colors: CheckboxColors = CheckboxDefaults.colors(),    //复选框颜色组interactionSource: MutableInteractionSource = remember { MutableInteractionSource() } //监听组件状态的事件源
)
 
Checkbox 复选框的使用
Checkbox(checked = checkedState.value,onCheckedChange = { checkedState.value=it },colors = CheckboxDefaults.colors( checkedColor = Color(0xFF0079D3) ,uncheckedColor = Color(0xFF8869D3))
)
 
Switch 单选框的含义
Switch可以控制单个项目的开启或关闭状态
@Composable
@Suppress("ComposableLambdaParameterNaming", "ComposableLambdaParameterPosition")
fun Switch(checked: Boolean,                         //是否被选中onCheckedChange: ((Boolean) -> Unit)?,    //当单选框被点击的回调函数modifier: Modifier = Modifier,            //修饰符thumbContent: (@Composable () -> Unit)? = null, //自定义选中时的滑块外观enabled: Boolean = true,                        //是否启用colors: SwitchColors = SwitchDefaults.colors(), //开关组颜色interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }, //监听组件状态的事件源
) 
 
Switch 单选框的使用
Switch(checked = checkedState.value, onCheckedChange = { checkedState.value=it}
)
 
Slider 滑竿组件的含义
Slider 滑竿组件可以手动滑动进度条调节对应的数值
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun Slider(value: Float,                     //进度值onValueChange: (Float) -> Unit,   //进度改变的监听modifier: Modifier = Modifier,    //修饰符enabled: Boolean = true,          //是否启用valueRange: ClosedFloatingPointRange<Float> = 0f..1f,  //进度值的范围,默认0到1steps: Int = 0,                   //进度分段onValueChangeFinished: (() -> Unit)? = null,    //进度改变完成的监听colors: SliderColors = SliderDefaults.colors(), //滑竿颜色interactionSource: MutableInteractionSource = remember { MutableInteractionSource() } //监听组件状态的事件源
)
 
Slider 滑竿组件的使用
var sliderPosition by remember{ mutableStateOf(0f) }   //滑竿滑动的位置Text(text = "%.1f".format(sliderPosition * 100) + "%") //滑动进度计算
Slider(value = sliderPosition, onValueChange = {sliderPosition = it}) //设置进度值
 
总结
- Checkbox复选框允许用户从一个集合选择一个或多个项目,可以将一个选项打开或关闭
 - Switch可以控制单个项目的开启或关闭状态
 - Slider 滑竿组件可以手动滑动进度条调节对应的数值
 
