seek-bar

[详细示例：progress.vue]

可拖动进度条

属性

参数	描述	类型
progress	当前进度	int
secondProgress	第二段进度	int
maxProgress	总进度	int
barHeight	进度条高度	int
thumbWidth	滑块宽度	int
thumbHeight	滑块高度	int
backgroundColor	总进度条颜色	string(#aarrggbb)
progressColor	当前进度条颜色	string(#aarrggbb)
thumbColor	滑块颜色	string(#aarrggbb)
listenProgress	是否开启监听seek-change回调，默认false	boolean

事件

事件名称	描述	类型
seek-change	当用户拖动进度条时，会执行此回调函数。	Function

示例：

点击查看源码

<seek-bar
        :focusable="true"
        :maxProgress="100"
        :progress="50"
        :barHeight="6"
        :thumbWidth="35"
        :thumbHeight="35"
        backgroundColor="#40ffffff"
        progressColor="#60ffffff"
        thumbColor="#ffffff"
        :listenProgress="true"
        @seek-change="onSeekChange"
        name="progress"
        @focus="focusChange"
/>

点击查看源码

onSeekChange(e)
{
    console.log(`seekBar onSeekChange fromUser:${e.fromUser},left:${e.pLeft},right:${e.pRight},state:${e.state}`);
}