Question

更新：通常不是这样：你问一个问题，然后在短时间内自己发现答案。

在mouseX中引用mouseY和MouseArea以及从MouseEvent

获取鼠标数据之间似乎有些混淆

如果我将下面的代码更改为：

    var pt = Qt.point( mouse.x, mouse.y)

来自我所拥有的：

     var pt = Qt.point(mouseX, mouseY)

然后新创建的精灵位于点击点。这很好，但我仍然不理解差异，特别是在这种情况下，因为MouseArea填充整个窗口（父）。

两种方法中的鼠标数据相同，除非鼠标事件已传播 - 然后mouse方法会提供正确的数据，而mouseX, mouseY则不会。这是令我困惑的部分。

有人可以解释这里发生的事情的区别吗？

我制作了一个可重复使用的QML组件，它可以使用alpha通道加载.png图像，并通过传播鼠标事件来处理透明像素的点击。我已经在下面的代码中工作（任何改进的建议都很受欢迎）但似乎鼠标数据是错误的。

在下图中，我标记了3次点击的顺序和位置。在日志语句中，即使鼠标单击位置已更改，报告的位置也保持不变。所以正在发生的事情是，虽然已经创建了3个精灵，但它们堆叠在彼此之上

我是否遗漏了MouseArea报告鼠标位置或propagateComposedEvents工作原理的方法？

主要点击。在以下位置创建精灵： 598.01953125 492.953125
点击图片阿尔法：5.69921875 103.41015625 ＆lt; -----通过实施的事件 主要点击。在以下位置创建精灵： 598.01953125 492.953125
点击图片阿尔法：121.953125 103.01953125 ＆lt; -----通过实施的事件 点击图形阿尔法：5.69921875 103.41015625 ＆lt; -----通过实施的事件 主要点击。在以下位置创建精灵： 598.01953125 492.953125

// main.qml

import QtQuick 2.5
import QtQuick.Controls 1.4
import QtQuick.Dialogs 1.2

ApplicationWindow {
    id: appWindow
    visible: true
    width: 1024
    height: 768
    title: qsTr("QtQuick")

    Item {
        id: container
        anchors.fill: parent

        property var events: new Array()
        property int counter: 0;

        MouseArea {
            anchors.fill: parent

            onClicked: {
                console.log("---------main clicked. Creating sprite at:", mouseX, mouseY);
                var pt = Qt.point(mouseX, mouseY)
                var component = Qt.createComponent("graphicAsset.qml");

                var imageName = "Earth-icon.png";
                var  sprite = component.createObject(container, {"x": pt.x, "y": pt.y, "imageSource": imageName});

            }
        }
    }
}

//graphicAsset.qml

import QtQuick 2.5

Canvas {
    id: graphicAsset
    width: 50
    height: 50

    property string imageSource;

    onImageSourceChanged:loadImage(imageSource)

    onImageLoaded: {
        var ctx = getContext("2d")
        var imageData = ctx.createImageData(imageSource)
        graphicAsset.width = imageData.width;
        graphicAsset.height = imageData.height;

        x = x - (imageData.width /2);
        y = y - (imageData.height /2);
        requestPaint();
    }

    onPaint: {
        if (isImageLoaded(imageSource)){
            var ctx = getContext("2d")
            var imageData = ctx.createImageData(imageSource)
            ctx.drawImage(imageData, 0, 0)
        }
    }

    MouseArea {
        anchors.fill: parent
        drag.target: parent

        propagateComposedEvents: true

        onClicked: {
            var ctx = parent.getContext("2d")
            var imageData = ctx.getImageData(mouseX, mouseY, 1, 1)

            if (imageData.data[3] == 0 ){
                console.log("graphic alpha clicked:", mouseX, mouseY);
                 mouse.accepted = false;

            } else {
                 mouse.accepted = true;
            }
        }
    }
}

Answer 1

鼠标事件＆＃39; x和y位置相对于生成事件的MouseArea，以及同一区域内的coordinates of the mouse cursor（名为mouseX和mouseY）。

propagateComposedEvents：鼠标数据不准确？

1 个答案: