qml多点触控

最新推荐文章于 2024-07-23 09:07:58 发布

_探索_

最新推荐文章于 2024-07-23 09:07:58 发布

阅读量507

点赞数 1

文章标签： html css 前端

本文链接：https://blog.csdn.net/qq_27050303/article/details/129793626

版权

import QtQuick 2.15

Rectangle {
    id: root
    width: window.width
    height: window.height
    color: "black"

    property real arcRadius: 150

    MultiPointTouchArea {
        anchors.fill: parent
        minimumTouchPoints: 1
        maximumTouchPoints: 5
        touchPoints: [
            TouchPoint { id: touch1 },
            TouchPoint { id: touch2 },
            TouchPoint { id: touch3 },
            TouchPoint { id: touch4 },
            TouchPoint { id: touch5 }
        ]
    }

    Item {
        visible: touch1.pressed
        Rectangle {
            x: touch1.x-width/2
            y: touch1.y-height/2
            width: arcRadius
            height: width
            color: "transparent"
            border.width: 1
            border.color: "red"
            radius: width/2
        }

        Rectangle {
            y: touch1.y
            width: root.width
            height: 1
            color: "red"
        }

        Rectangle {
            x: touch1.x
            width: 1
            height: root.height
            color: "red"
        }
    }

    Item {
        visible: touch2.pressed
        Rectangle {
            x: touch2.x-width/2
            y: touch2.y-height/2
            width: arcRadius
            height: width
            color: "transparent"
            border.width: 1
            border.color: "green"
            radius: width/2
        }

        Rectangle {
            y: touch2.y
            width: root.width
            height: 1
            color: "green"
        }

        Rectangle {
            x: touch2.x
            width: 1
            height: root.height
            color: "green"
        }
    }

    Item {
        visible: touch3.pressed
        Rectangle {
            x: touch3.x-width/2
            y: touch3.y-height/2
            width: arcRadius
            height: width
            color: "transparent"
            border.width: 1
            border.color: "blue"
            radius: width/2
        }

        Rectangle {
            y: touch3.y
            width: root.width
            height: 1
            color: "blue"
        }

        Rectangle {
            x: touch3.x
            width: 1
            height: root.height
            color: "blue"
        }
    }

    Item {
        visible: touch4.pressed
        Rectangle {
            x: touch4.x-width/2
            y: touch4.y-height/2
            width: arcRadius
            height: width
            color: "transparent"
            border.width: 1
            border.color: "yellow"
            radius: width/2
        }

        Rectangle {
            y: touch4.y
            width: root.width
            height: 1
            color: "yellow"
        }

        Rectangle {
            x: touch4.x
            width: 1
            height: root.height
            color: "yellow"
        }
    }

    Item {
        visible: touch5.pressed
        Rectangle {
            x: touch5.x-width/2
            y: touch5.y-height/2
            width: arcRadius
            height: width
            color: "transparent"
            border.width: 1
            border.color: "white"
            radius: width/2
        }

        Rectangle {
            y: touch5.y
            width: root.width
            height: 1
            color: "white"
        }

        Rectangle {
            x: touch5.x
            width: 1
            height: root.height
            color: "white"
        }
    }

    // 返回主页
    Image {
        anchors.left: parent.left
        anchors.leftMargin: 30
        anchors.top: parent.top
        anchors.topMargin: 30

        source: "qrc:/img/home.png"
        sourceSize: Qt.size(64, 64)

        MouseArea {
            anchors.fill: parent
            onClicked: {
                rootStackView.f_pop()
            }
        }
    }
}