qml 音乐播放器的进度条

进度条采用qml的Slider组件

样式什么的,网上很多。我就不列举了。接下来主要说明,进度条是怎样按秒移动的。

   Slider {

                  id: control

       value: 0

       stepSize: 0.01
       onValueChanged: {
               txt_time_start.text =formation(control.value)
               txt_time_end.text = formation(maximumValue);
          }
}
//timer启动
   Timer{
        id:time
        running: false
        repeat: true
       // interval: 500
        onTriggered:{
            control.value = control.value + control.stepSize 
      }
    }
//取得小数点后两位
     function splitAndRound(num) {
       num = num * Math.pow(10, 2);
        return (Math.round(num)) / (Math.pow(10, 0));
    }
//歌曲的格式都是00:00 为了保持格式因为补0
function formation(controlvalue)
        {
            //补0
              function pad(num, n) {
                  var len = num.toString().length;
                  while(len < n) {
                      num = "0" + num;
                      len++;
                  }
                  return num;
              }
            var min = Math.floor(splitAndRound(controlvalue)/60)
            var sec = splitAndRound(controlvalue)%60
            return(pad(min,2) + ":" + pad(sec,2))
        }
还没有搞清楚的是slider属性。在1.4版本里有maximumValue,minimumValue属性来改变滑块的最大值与最小值。
到了2.3版本变成了from与to。共同点value还是0至1之间的小数。我这里用的是2.3版本。

猜你喜欢

转载自www.cnblogs.com/wxmwanggood/p/9155551.html