2016-08-30 51 views
1

我有一個滑塊和用於在滑塊上滑動的圖像,如下所示。當我們退出鼠標區域時無法取消拖動

Image 
{ 
    id: slideImg 
    source: "/slider/SliderSelected.png" 
    width: 65 
    height: 65 

    onDragActiveChanged: 
    { 


     if (!dragActive) 
     { 
      main.selection (x + slideImg.width/2 , true); 
     } 

    } 
    property bool dragActive: dragArea.drag.active 

} 

的鼠標區域看起來是這樣的:

MouseArea 
{ 
    id: dragArea 
    anchors.fill: thumb 
    enabled: !isDisabled 
    height: 65 
    width: 463 
    drag 
    { 
     readonly property int dragThreshold: 10 
     target: thumb 
     minimumX: 0 
     minimumY: 0 
     maximumY:100 

     maximumX: mainElement.width - thumb.width 
     axis: Drag.XAxis 
     threshold: dragThreshold 
    } 
    onCanceled: { 
     console.log("onCanceled ") 

    } 
    onExited: { 
     console.log("onExited ") 
     Drag.cancel() 
    } 


} 

當我握住sliderImage並滑動滑塊我將要取消的阻力的區域之外。拖動區域應限制在鼠標區域。如果我們移出鼠標區域,我想取消拖動。但是,Drag.cancel()不會取消拖動。有什麼辦法可以取消拖動嗎?

回答

0

我不知道,你試圖通過這個達到什麼目的,但要儘量取消設置drag.target

onExited: drag.target = null 
onEntered: drag.target = myTarget 

我認爲這應該爲你工作。

但是,你可能也想看看狀態(有拖動的狀態,其時,纔會啓用當鼠標移動到該地區。

MouseArea { 
    id: dragArea 
    anchors.fill: parent 

    states: [ 
     State { 
      when: dragArea.containsMouse 

      PropertyChanges { 
       target: dragArea 
       drag.target: dragger 
      } 
     } 
    ] 
} 

你也可能想看看在最大和最小X和Y值 這可能是你真正想要的東西
我不認爲有可能自動重置位置,但是你可以很容易地處理你的自我,通過將ne值存儲在一個額外的變量中,一旦你合法地結束了拖拽,並且恢復它們,一旦你沒有。

我希望我能夠幫助你!

+0

這真的很有幫助,謝謝:) – user2717079

相關問題