Strange offset after rotating a rectangle
What happens to the space surrounding a Rectangle after it’s rotated? I have observed that if I rotate +/- 90 degrees a Rectangle with these anchors:
- anchors.left: parent.left
- anchors.verticalCenter: parent.verticalCenter
or these anchors
- anchors.right: parent.right
- anchors.verticalCenter: parent.verticalCenter
the Rectangle is offset from the edge of its parent. However, if I create a Rectangle of the same size but with the width and height swapped, the Rectangle is drawn at the edge of its parent as I intended.
The code and screenshot below illustrates the situation. The 150 X 40 yellow “Configure” Rectangle is not rotated. It is drawn where it should be: at the right edge of the Blue rectangle and centered on the blue Rectangle’s vertical center. The 40 X 150 green “Help” Rectangle is rotated. While it is centred on the blue Rectangle’s vertical center, it is many pixels to the right of the left edge of the blue Rectangle.
- import QtQuick 1.0
- Rectangle {
- id: container
- height: 480
- width: 800
- color: "blue"
- Rectangle {
- id: rightButton
- anchors.right: parent.right
- anchors.verticalCenter: parent.verticalCenter
- width: 40
- height: 150
- color: "yellow"
- Text {
- id: rightButtonText
- text: "Configure"
- rotation: 90
- anchors.centerIn: parent
- }
- }
- Rectangle {
- id: leftButton
- rotation: -90
- anchors.left: parent.left
- anchors.verticalCenter: parent.verticalCenter
- width: 150
- height: 40
- color: "green"
- Text {
- id: leftButtonText
- text: "Help"
- anchors.centerIn: parent
- }
- }
- Text {
- text: "Click to Exit"
- anchors.centerIn: parent
- }
- MouseArea {
- anchors.fill: parent
- onClicked: {
- }
- }
- }
3 replies
You must log in to post a reply. Not a member yet? Register here!