鸿蒙开发组件之Slider

一、Slider控件是鸿蒙开发中的滑动条组建，初始化方式

Slider({
    min:0, //最小值
    max:100,//最大值
    value:30,//默认值
    step:10,//步长，每次滑动的差值
    style:SliderStyle.OutSet, //滑块的样式，默认outset
    direction:Axis.Horizontal, //水平方式的滑动条
    reverse:false //是否反向滑动
})

二、其他属性

设置滑动条的高度不能用height，要用trackThickness属性。

小tips：如果不知道需要设置什么，可以通过看官方文档，而且是中文版，真的是遥遥领先，👍

也可以通过showTips值来设置是否有上方的value小提示

Slider({
    min:100,//最小
    max:400,//最大
    value:this.imageWidth,//默认值
    step:10,//滑动的步长
    style:SliderStyle.OutSet,//滑块在滑动条外
    direction:Axis.Horizontal,
    reverse:false
})      
.width('90%')
.trackThickness(8)
.showTips(true)

三、值变化监听

Slider滑动条值改变是通过onChange方法监听的

Slider({
  min:100,//最小
  max:400,//最大
  value:this.imageWidth,//默认值
  step:10,//滑动的步长
  style:SliderStyle.OutSet,//滑块在滑动条外
  direction:Axis.Horizontal,
  reverse:false
})
.width('90%')
.onChange((value,changeMode) => {
     console.log(value.toString())
     this.imageWidth = value
})

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.kler.cn/a/163480.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！