20200604-01 PathView mouse drag 实现鼠标拖动 安卓设置时间效果，循环

前言

pathView 与 ListView 等具备类似的效果，不过区别是 pathview 可以根据 path 定义的路径进行循环的运行

代码

PathView {
    property string displayUnit: ""
    property int displayStartValue: 0
    id: list

    highlightRangeMode: ListView.StrictlyEnforceRange
    highlightMoveDuration: 200
    preferredHighlightBegin: 0.5 //高亮区域默认顶层，所以这里也需要设置
    preferredHighlightEnd: 0.5
    pathItemCount: 4

    model: 200
    delegate: Column {
	    z: PathView.zOrder !== undefined ? PathView.zOrder : 0
	    opacity: PathView.itemAlpha !== undefined ? PathView.itemAlpha : 0
	    scale: PathView.itemScale !== undefined ? PathView.itemScale : 0
	    Text {
	        text: index + displayStartValue + displayUnit
	        font.pixelSize: 28
    	}
	}

    path:Path {
        startX: list.width / 2;
        startY: 10;
        PathAttribute { name: "zOrder"; value: 0 }
        PathAttribute { name: "itemAlpha"; value: 0.1 }
        PathAttribute { name: "itemScale"; value: 0.6 }
        PathLine {
          	relativeX: 0;
            relativeY: 100;
        }
        PathAttribute { name: "zOrder"; value: 10 }
        PathAttribute { name: "itemAlpha"; value: 0.8 }
        PathAttribute { name: "itemScale"; value: 1.5 }
        PathLine {
            relativeX: 0;
            relativeY: 100;
        }
        PathAttribute { name: "zOrder"; value: 0 }
        PathAttribute { name: "itemAlpha"; value: 0.1 }
        PathAttribute { name: "itemScale"; value: 0.6 }

    }
}

要点说明：

1. path 属性决定了显示元素的移动位置和效果，这部分具体看官方帮助
2. 要支持鼠标按住拖动效果，显示的文本是否在 PathView 范围内
3. 按键切换查看帮助文档　focus: true; Keys.onLeftPressed: decrementCurrentIndex(); Keys.onRightPressed: incrementCurrentIndex() 在 pathview 中添加类似这样的效果就可以了
4. 定义在　PathAttribute 的属性，在委托项直接可以使用
5. 如果要实现鼠标滑轮滚动的效果，可以参考国外论坛的解决方案

PathView {
	id: view
	anchors.fill: parent
	focus: true
	model: monthModel
	property int wheelIndex:- 1;
	currentIndex: 0;
	
	MouseArea {
	anchors.fill: parent
	preventStealing: true;
	propagateComposedEvents: true
	
	Timer {
	    id:wheelTimer
	    interval: 200;
	    running: false;
	    repeat: false
	    onTriggered: {
	       view.wheelIndex = -1;
	    }
	}
	
	onWheel: {
	    wheelTimer.start();
	
	    if (view.wheelIndex === -1) {
	        view.wheelIndex = view.currentIndex;
	    }
	
	    if (wheel.angleDelta.y > 0) {
	        view.wheelIndex++
	        if (view.wheelIndex > view.model.count) {
	            view.wheelIndex = 0;
	        }
	
	        view.currentIndex = view.wheelIndex;
	    } else {
	        view.wheelIndex--;
	        if (view.wheelIndex < 0) {
	            view.wheelIndex = view.model.count - 1;
	        }
	
	        view.currentIndex = view.wheelIndex;
	    }
	}
}