Hello,
Has anyone played around with using rotation and anchoring at the same
time? For example, if you want to rotate an image and reanchor it to
another side of a parent rectangle...
Some issues arise that I'm not sure how to overcome. For example, when you
rotate your image (let's say it's just a simple rectangle) it rotates the
image about it's center, but the anchors for it remain where they were in
relation to it's center prior to rotation and do not update to accomodate
the new dimensions of the picture. Does anyone have any ideas on how to
get the anchors to recognize the actual borders of the rotated object?
The following example demonstrates the goal of this experiment, but uses
property bindings rather than anchors and required some figuring out to
determine what the new x and y values had to be (if there is a way to avoid
that that would be great!):
// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
import QtQuick 1.1
Rectangle {
height:300
width:250
color:"darkblue"
id: container
anchors.centerIn: parent
property string nextState
state: "left"
Rectangle {
id:toy
height: 70
width: 30
color: "darkred"
Rectangle {
height: 10
width: 10
color: "black"
anchors.centerIn: parent
}
Rectangle {
height: 10
width: 10
color: "lightgreen"
anchors.centerIn: parent.TopLeft
}
}
MouseArea {
anchors.fill: parent
onClicked:container.state = nextState
}
states: [
State {
name: "left"
PropertyChanges {
target: container
nextState: "top"
}
PropertyChanges {
target: toy
rotation: 0
height: container.height
width: 30
x: 0
y: 0
}
// AnchorChanges {
// target: toy
// anchors.right: undefined
// anchors.left: parent.left
// anchors.bottom: parent.bottom
// anchors.top: parent.top
// }
},
State {
name: "top"
PropertyChanges {
target: container
nextState: "right"
}
PropertyChanges {
target: toy
rotation: 90
height: container.width
width: 30
x: (container.width - width) / 2//0
y: (-container.width + width) / 2//0
}
// AnchorChanges {
// target: toy
// anchors.bottom: undefined
// anchors.top: parent.top
// anchors.left: parent.left
// anchors.right: parent.right
// }
},
State {
name: "right"
PropertyChanges {
target: container
nextState: "bottom"
}
PropertyChanges {
target: toy
rotation: 180
height: container.height
width: 30
x: container.width - width
y: 0
}
// AnchorChanges {
// target: toy
// anchors.left: undefined
// anchors.top: parent.top
// anchors.right: parent.right
// anchors.bottom: parent.bottom
// }
},
State {
name: "bottom"
PropertyChanges {
target: container
nextState: "left"
}
PropertyChanges {
target: toy
rotation: 270
height: container.width
width: 30
x: height/2 - width/2
y: container.height - height + height/2 - width/2
}
// AnchorChanges {
// target: toy
// anchors.top: undefined
// anchors.bottom: parent.bottom
// anchors.right: parent.right
// anchors.left: parent.left
// }
}
]
}
--
David Chamberlain
Computer & Electrical Engineer
Qt/C++ Software Developer
Integrated Computer Solutions
_______________________________________________
Qt-qml mailing list
Qt-qml@qt.nokia.com
http://lists.qt.nokia.com/mailman/listinfo/qt-qml
