Cancella ancoraggio QML

Question

Ho un MouseArea che desidero iniziare centrato e quindi avere una posizione assoluta una volta che i tasti su/giù/sinistra/destra sono premuti. Il mio problema è che non so come cancellare l'ancoraggio sul MouseArea in modo che posso specificare una posizione assoluta:

import QtQuick 2.0 
import QtQuick.Window 2.0 

Window { 
    id: screen 
    width: 360 
    height: 360 
    visible: true 

    Rectangle { 
     anchors.fill: parent 

     states: [ 
      State { 
       name: "moved" 
       AnchorChanges { 
        target: mouseArea 
        anchors.bottom: undefined 
        anchors.left: undefined 
        anchors.right: undefined 
        anchors.top: undefined 
       } 
      } 
     ] 

     MouseArea { 
      id: mouseArea 
      anchors.centerIn: parent 
      width: 250 
      height: 250 
      focus: true 
      onClicked: console.log("clicked!") 
      onPositionChanged: console.log("position changed!") 

      function moveMouseArea(x, y) { 
       mouseArea.x += x; 
       mouseArea.y += y; 
       mouseArea.state = "moved"; 
       mouseAreaPosText.text = 'Mouse area was moved... new pos: ' 
        + mouseArea.x + ', ' + mouseArea.y; 
      } 

      Keys.onPressed: { 
       if (event.key === Qt.Key_Up) 
        moveMouseArea(0, -1); 
       if (event.key === Qt.Key_Down) 
        moveMouseArea(0, 1); 
       if (event.key === Qt.Key_Left) 
        moveMouseArea(-1, 0); 
       if (event.key === Qt.Key_Right) 
        moveMouseArea(1, 0); 
      } 

      Rectangle { 
       anchors.fill: parent 
       border.width: 2 
       border.color: "black" 
       color: "transparent" 
      } 

      Text { 
       id: mouseAreaPosText 
       anchors.centerIn: parent 
      } 
     } 
    } 
} 

In un primo momento ho solo provato a installare mouseArea.anchors-undefined ma ho ottenuto un errore circa anchors essere un proprietà di sola lettura. Ho quindi scoperto AnchorChanges, ma non riesco a trovare un modo per rimuovere/cancellare l'ancora; l'impostazione di anchors.bottom ecc. a undefined non funziona.

Answer 1

Secondo docs, l'impostazione di un attributo di ancoraggio su undefined dovrebbe funzionare. Non ho ben capito il motivo per cui AnchorChanges non ha permesso di impostare anchors.centerIn, ma si può aggirare nella vostra funzione moveMouseArea:

function moveMouseArea(x, y) { 
    mouseArea.anchors.centerIn = undefined; // <-- reset anchor before state change 
    mouseArea.pos.x += x; 
    mouseArea.pos.y += y; 
    mouseArea.state = "moved"; 
    mouseAreaPosText.text = 'Mouse area was moved... new pos: ' 
     + mouseArea.pos.x + ', ' + mouseArea.pos.y; 
} 

Answer 2

Grazie per il vostro aiuto ragazzi. Ho trovato che l'impostazione indefinita all'interno di uno stato funziona (se per opere si intende solo che non dà errori), tuttavia, una volta che l'elemento si sposta in un altro stato, le ancore magicamente (e in modo molto frustrante) ritornano. Ciò accade ANCHE se si impostano tutte le ancore indefinite nello stato finale. Come accennato in precedenza, tuttavia, l'impostazione indefinita nella funzione prima di cambiare stato funziona alla grande. Nel mio caso, l'ho impostato nel mouseArea in onPressed.

   onPressed: { 
       plotWindow04Frame.anchors.bottom = undefined 
       plotWindow04Frame.anchors.left = undefined 
       plotWindow04Frame.state = "inDrag" 
      } 

Ho scoperto che non era necessario menzionare l'ancora nell'accolto, solo lo stato successivo. onReleased: { plotWindow04Frame.state = "caduto" }

Inoltre, vorrei ricordare, che la finale "caduto" stato non menziona neanche ancore, solo l'opacità.

states: [ 
    State { 
     name: "inDrag" 
     PropertyChanges { 
      target: plotWindow04Frame 
      opacity: .5 
     } 
    }, 
    State { 
     name: "dropped" 
     PropertyChanges { 
      target: plotWindow04Frame 
      opacity: 1 
     } 
    } 

] 

    transitions: Transition { 
     NumberAnimation { properties: "opacity"; duration:200 } 
    } 
} 

(L'idea qui è che queste finestre trama sarebbe diventato trasparente (opacità: 0,5) mentre si trascina, ma tornano a opaco (opacità: 1) quando l'utente li lascia cadere)

Ciò che è bello è che i "rettangoli" della finestra della trama sono inizialmente ancorati alla parte inferiore della GUI, ma una volta che l'utente li ha prelevati, possono metterli dove vogliono.