Question

我遇到了问题，如何在qml中检测通过MouseArea滑动？

此代码来自文档：

SELECT * FROM deposit1_groupc_tga05
ORDER BY STR_TO_DATE(Transaction_Date, '%c/%e/%Y %H:%i')

但是我不知道如何向左或向右滑动，我在移动应用程序（ios＆amp; android）中得到了这个用途。

有人可以帮助我吗？谢谢。如何用手指检测左右滑动？感谢。

Answer 1

就像derM解释了事件的系列一样：触摸->运动->释放
这是我对该概念的解决方案。工作正常！！

MouseArea {
            width: 100
            height: 50
            preventStealing: true
            property real velocity: 0.0
            property int xStart: 0
            property int xPrev: 0
            property bool tracing: false
            onPressed: {
                xStart = mouse.x
                xPrev = mouse.x
                velocity = 0
                tracing = true
                console.log( " pressed  "+xStart)
                console.log( " pressed  "+xPrev)
            }
            onPositionChanged: {
                if ( !tracing ) return
                var currVel = (mouse.x-xPrev)
                velocity = (velocity + currVel)/2.0
                xPrev = mouse.x
                if ( velocity > 15 && mouse.x > parent.width*0.2 ) {
                    tracing = false
                    console.log( " positioned  ")
                    // SWIPE DETECTED !! EMIT SIGNAL or DO your action
                }
            }
            onReleased: {
                tracing = false
                if ( velocity > 15 && mouse.x > parent.width*0.2 ) {
                    // SWIPE DETECTED !! EMIT SIGNAL or DO your action
                    console.log("abcccccccccc")
                }
            }
        }
    }

Answer 2

滑动是一个简单的事件链：

Touch -> Movement -> Release

所以这就是你如何检测它：

初始化一些变量（例如originX / Y）onPressed，然后检测移动onPositionChanged，计算原点和当前位置之间的向量，分析长度和方向以评估方向和速度。将originX/Y设置为新位置，然后继续onReleased。然后你可以确定它是否是一个滑动（取决于最后一个向量或运动的历史 - 以某种方式存储或累积计算的向量）

您需要考虑的事项：最后一次移动可能很短暂，因为用户在发布之前放慢速度，或者因为他发布了两个步骤之间。因此，只考虑最后一个向量可能会产生不良结果。

相反，你可能累积最后n个向量，应用一些权重。

如果您通过计时器替换onPositionChanged以获得更长的分析间隔，您也可以改进。您可以使用间隔来查找最佳行为。

因为实现精确调整的检测算法并非易事，我建议重新考虑一下，是否有必要自己实施检测，或者是否有许多具有滑动行为的Item s实施可能就足够了。

Answer 3

有一种更简单的方法，您可以只使用一个空的Flickable。然后，您可以查看轻拂标志，以查看用户是否轻拂了它（刷过）。

Answer 4

    MouseArea {
        property variant previousPosition: 0
        property variant direction: 0

        anchors.fill: parent;

        onPressed: {
            previousPosition = mouseX;
            direction = 0;
            console.debug("onPressed mouseX:" + mouseX);
        }

        onPositionChanged: {
            if(previousPosition > mouseX){
                direction = 1;
            }
            else if(previousPosition < mouseX){
                direction = -1;
            }
            else{
                direction = 0;
            }
            previousPosition = mouseX;
        }

        onReleased: {
            if(direction > 0){
                console.debug("swipe to right");
            }
            else if(direction < 0){
                console.debug("swipe to left");
            }
            else{
                console.debug("swipe no detected");
            }
        }
    }

Answer 5

这是我使用 Flickable 的实现（受 Stuart 的回答启发）：

Flickable {
    id: swipeArea
    ...
    
    flickableDirection: Flickable.HorizontalFlick
    onFlickStarted: {
        if (horizontalVelocity < 0) {
            console.log("swiped right")
        }
        if (horizontalVelocity > 0) {
            console.log("swiped left")
        }
    }
    boundsMovement: Flickable.StopAtBounds
    pressDelay: 0
    
    // children
}

只要确保您拥有的任何控件都是 Flickable 的子项，因为新闻事件不会传播到 Flickable 下的项目。

通过MouseArea Qt QML检测向左或向右滑动

5 个答案: