qml放大缩小，进度条

import QtQuick 2.7
import QtQuick.Controls 1.4
Item {
    id: zoomId
    width: 200
    height: 50
    property int m_count: 7
    property int m_currentIndex: 5
    property var m_currentScaleVal: 1.0
    property int m_width: 12
    property int m_height: 20
    onM_currentIndexChanged: {
        m_currentScaleVal = repeaterid.model[m_currentIndex];
    }
    Row{
        anchors.verticalCenter: parent.verticalCenter
        anchors.right: parent.right
        anchors.rightMargin: 10
        spacing: 10
        Item {
            width: m_height
            height: m_height
            Rectangle{width: m_height;height: 5;color: Color.zoomBarLightColor;anchors.centerIn: parent}
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    if (m_currentIndex > 0) {
                        m_currentIndex--
                    }
                }
            }
        }
        Repeater {
            id: repeaterid
            model: [0.5,0.6,0.7,0.8,0.9,1.0,2.0,3.0,4.0,5.0]
            delegate: Rectangle {
                width: index == m_currentIndex ? m_width : m_width-3
                height: index == m_currentIndex ? m_height : m_height-3
                color: index == m_currentIndex ? Color.zoomBarLightColor : "#B2AFA9"
                radius: 2
            }
        }
        Item {
            width: m_height
            height: m_height
            Rectangle{width: 5;height: m_height;color: Color.zoomBarLightColor;anchors.centerIn: parent }
            Rectangle{width: m_height;height: 5;color: Color.zoomBarLightColor;anchors.centerIn: parent }
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    if (m_currentIndex < 9) {
                        m_currentIndex++
                    }
                }
            }
        }
    }
}
使用如下：
Rectangle{width: 600; height: 500;color: "#3A3223";
    MouseArea{
        anchors.fill: parent
 onWheel: {//滚轮
     var diff = (wheel.angleDelta.y)/120;
   if(diff){ zoomitemid.m_currentIndex+=diff;}
 }
Rectangle{
    x:50
    y:50
id: iddragitem; width: 100; height: 100;
scale: zoomitemid.m_currentScaleVal
}
    }

    Zoom{//放大缩小
            id: zoomitemid
            width: parent.width
            height: 50
            anchors.right: parent.right
        }
}