diff options
| -rw-r--r-- | demos/declarative/calculator/calculator.qml | 22 |
1 files changed, 13 insertions, 9 deletions
diff --git a/demos/declarative/calculator/calculator.qml b/demos/declarative/calculator/calculator.qml index 3e1c6507cd..b3e4f2f9b5 100644 --- a/demos/declarative/calculator/calculator.qml +++ b/demos/declarative/calculator/calculator.qml @@ -46,7 +46,7 @@ import "Core/calculator.js" as CalcEngine Rectangle { id: window - width: 480; height: 360 + width: 360; height: 480 color: "#282828" property string rotateLeft: "\u2939" @@ -63,7 +63,15 @@ Rectangle { id: main state: "orientation " + runtime.orientation - width: parent.width; height: parent.height; anchors.centerIn: parent + property bool landscapeWindow: window.width > window.height + property real baseWidth: landscapeWindow ? window.height : window.width + property real baseHeight: landscapeWindow ? window.width : window.height + property real rotationDelta: landscapeWindow ? -90 : 0 + + rotation: rotationDelta + width: main.baseWidth + height: main.baseHeight + anchors.centerIn: parent Column { id: box; spacing: 8 @@ -132,24 +140,20 @@ Rectangle { states: [ State { name: "orientation " + Orientation.Landscape - PropertyChanges { target: main; rotation: 90; width: window.height; height: window.width } - PropertyChanges { target: rotateButton; operation: rotateLeft } + PropertyChanges { target: main; rotation: 90 + rotationDelta; width: main.baseHeight; height: main.baseWidth } }, State { name: "orientation " + Orientation.PortraitInverted - PropertyChanges { target: main; rotation: 180; } - PropertyChanges { target: rotateButton; operation: rotateRight } + PropertyChanges { target: main; rotation: 180 + rotationDelta; } }, State { name: "orientation " + Orientation.LandscapeInverted - PropertyChanges { target: main; rotation: 270; width: window.height; height: window.width } - PropertyChanges { target: rotateButton; operation: rotateLeft } + PropertyChanges { target: main; rotation: 270 + rotationDelta; width: main.baseHeight; height: main.baseWidth } } ] transitions: Transition { SequentialAnimation { - PropertyAction { target: rotateButton; property: "operation" } RotationAnimation { direction: RotationAnimation.Shortest; duration: 300; easing.type: Easing.InOutQuint } NumberAnimation { properties: "x,y,width,height"; duration: 300; easing.type: Easing.InOutQuint } } |