HarmonyOS 开发基础(六)Slider
@Entry
@Component
struct Index {
build() {
Row() {
Column() {
// Slider:ArkUI 的基础组件 滑动条组件
// options 参数:Slider 基础设置
Slider({
// 最小值
min: 20,
// 最大值
max: 200,
// 当前值
value: 50,
// 步长
step: 10,
// 样式,SliderStyle.InSet:条型,SliderStyle.OutSet:线型
style: SliderStyle.InSet,
// Axis.Horizontal:横向展示,Axis.Vertical:纵向展示
direction: Axis.Horizontal,
// 是否反向滑动
reverse: false
})
// width:属性方法,设置组件宽度
.width('80%')
// showSteps:属性方法,是否展示步长点
.showSteps(true)
// showTips:属性方法,滑动时是否展示 value 百分比提示
.showTips(true)
// blockColor:属性方法,设置滑块颜色
.blockColor('#fffff')
// margin:属性方法,设置外边距
.margin({top: 30})
// onChange:组件事件,当滑动时触发
.onChange(value => {
console.log(value.toString())
})
}
}
}
}