QML多点触控区域

多点触控区域

支持双触摸点响应，双触摸点的每个触摸点也可单独响应

Item {
		//触控区域坐标
        x:710
        y:0
		//触控区域范围
        width: 540
        height: 80

		//多点触控区域控件
        MultiPointTouchArea {
            anchors.fill: parent
           //可识别的最大最小触摸点个数
            minimumTouchPoints: 1
            maximumTouchPoints: 2
            //定义2个触摸点
            touchPoints: [
                TouchPoint { id: point1 },
                TouchPoint { id: point2 }
            ]
            
            onPressed: {

//         longPressTimer1.start()
				//分别获取2个触摸点的实时坐标
                var touch1X = point1.x
                var touch1Y = point1.y
                var touch2X = point2.x
                var touch2Y = point2.y

                // 检查触摸点是否在按钮1上,自己根据log测试x,y的范围
                if (touch1X >= 0 && touch1X <= 245 &&
                        touch1Y >= 0 && touch1Y <= 80 ) {
					//要执行的操作
                    console.log("Button 1")
                    resetCheck()
                }
                // 检查触摸点是否在按钮2上，自己根据log测试x,y的范围
                if (touch1X >= 285 && touch1X <=  530&&
                        touch1Y >= 0 && touch1Y <= 80) {
					//要执行的操作
                    console.log("Button 2")
                }
				//检查触摸点是否同时在按钮1 ，2上，自己根据log测试x,y的范围
                if (touch1X >= 0 && touch1X <= 245 &&
                        touch1Y >= 0 && touch1Y <= 80 &&
                        touch2X >= 285 && touch2X <=  530&&
                        touch2Y >= 0 && touch2Y <= 80){
					//要执行的操作
                    console.log("Button1  2",touch1X,touch1Y)
                    longPressTimer1.start()
                }
                console.log("Button1  2",touch1X,touch1Y)

            }


            onReleased: {
                longPressTimer1.stop()
            }
			//计时器
            Timer {
                id: longPressTimer1
                interval: 5000
                repeat: false

                onTriggered: {
                    console.log("Button1  2",touch1X,touch1Y)
                    //root.exit()
                }
            }
        }
    }

获取两个触摸区域的范围

通过下面的代码打印测试出要控制区域的范围，通过此控制区域的范围来判断触摸点是否在该区域内进行对应位置的操作，双指触摸则是同时满足两个触摸区域。其他多指操作类似，可通过可识别的最大最小触摸点个数

        minimumTouchPoints: 1
        maximumTouchPoints: 2

来进行判断

Item {
		//触控区域坐标
        x:710
        y:0
		//触控区域范围
        width: 540
        height: 80

MultiPointTouchArea {
            anchors.fill: parent
           //可识别的最大最小触摸点个数
            minimumTouchPoints: 1
            maximumTouchPoints: 2
            //定义2个触摸点
            touchPoints: [
                TouchPoint { id: point1 },
                TouchPoint { id: point2 }
            ]
            
            onPressed: {

				//分别获取2个触摸点的实时坐标
                var touch1X = point1.x
                var touch1Y = point1.y
                var touch2X = point2.x
                var touch2Y = point2.y

                console.log("Button1  2",touch1X,touch1Y)

            }
        }
}