長按後拖動

Question

我想在自己的長按之後拖動自定義按鈕QML。我已經實現了這種行爲，但問題是，在啓用drag後，我需要再次按下按鈕才能真正開始拖動。如果我想長時間按下而不釋放按鈕，我應該如何實現這種機制？

這裏是我的按鈕代碼（onReleased和onLongPressed是我自己的信號）：

ButtonWidget.SoftButtonUI 
{ 
    id:softButtonDelegate2 
    x:500 
    y:300 
    labelText: "button" 
    iconImageSource: path 
    isGrayedOut: false 

    Drag.active: dragArea2.drag.active 
    Drag.hotSpot.x: 10 
    Drag.hotSpot.y: 10 
    onReleased: 
    { 
     console.log("onClicked") 
    } 

    onLongPressed: 
    { 
     console.log("onLongPressed") 
     dragArea2.enabled = true 
    } 

    MouseArea { 
     id: dragArea2 
     enabled: false 
     anchors.fill: parent 
     drag.target: parent 
     onReleased: parent.Drag.drop() 
     onClicked: { 
      console.log("MouseArea onClicked") 
     } 
     onPressAndHold: { 
      console.log("MouseArea onPressAndHold") 
     } 
    } 
} 

任何想法？

Answer 1

一般而言，您可以連接不同的信號並連接操作，如page中所述。你應該看看它，因爲它充滿了好的和有用的信息。

但是，當涉及到鼠標事件時，一個有趣的事件串聯方法由MouseEvent的接受給出。 Documentation說，大約MouseEvent::accepted：

設置接受真正的防止鼠標事件被 傳播到這個項目下面的項目。一般來說，如果該項目作用於 鼠標事件，則應該接受該項目，以便堆疊順序中較低的項目也不會響應相同的事件。

在這種情況下，我們可以採取相反的做法，而不是接受事件。這樣pressed事件可用於兩個激活拖動並實際執行它。然後MouseEvent可以在release事件中被隱式接受，發生在拖動結束時。

下面是一個簡單的例子，遵循這種方法。當鼠標按下並按住drag.target並且可以開始拖動時，而當釋放鼠標時，drag.target被刪除，消除拖動行爲。要測試它，只需將鼠標按住矩形，當它改變顏色時，只需拖動它即可。

import QtQuick 2.4 
import QtQuick.Controls 1.3 

ApplicationWindow { 
    width: 300 
    height: 300 
    visible: true 

    Rectangle { 
     id: item 
     border.width: 2 
     x: 100 
     y: 100 
     width: 100 
     height: 100 
     state: "BASE" 

     states: [ 
      State { 
      name: "BASE" 
      PropertyChanges { target: mouseArea; drag.target: undefined} 
      PropertyChanges { target: item; color: "steelblue"} 
     }, 
      State { 
      name: "DRAGGABLE" 
      PropertyChanges { target: mouseArea; drag.target: item} 
      PropertyChanges { target: item; color: "darkblue"} 
     } 
     ] 


     MouseArea { 
      id: mouseArea 
      anchors.fill: parent 
      drag{ 
       // target: NOT SET HERE 
       minimumX: 0 
       minimumY: 0 
       maximumX: parent.parent.width - parent.width 
       maximumY: parent.parent.height - parent.height 
       smoothed: true 
      } 

      onPressAndHold: { 
       item.state = "DRAGGABLE" 
       mouse.accepted = false  // mouse event is USED but NOT CONSUMED... 
      } 

      onReleased: { 
       item.state = "BASE"   // mouse event acceptation occurs here! 
      } 
     } 
    } 
} 

這種簡單的方法應該可以完美地與您的自定義信號一起工作。