aboutsummaryrefslogtreecommitdiffstats
path: root/examples/quick/positioners
diff options
context:
space:
mode:
authorThomas Hartmann <thomas.hartmann@qt.io>2016-10-26 12:17:55 +0200
committerTim Jenssen <tim.jenssen@qt.io>2016-11-15 10:52:59 +0000
commit441e6bbdb01733c0f9860ce881b61f5907d2d2f8 (patch)
tree109d060fb5f968084e9a92f7a42bef91fdb6729f /examples/quick/positioners
parent47847bebcacef2bbf3b5627ca18966d7d34d6762 (diff)
Adjust positioners example for tooling
* Fully qualify all property bindings * Not using flow as id, because it collides with the property flow These changes are required so the example works nicely in the designer. Change-Id: I05972a5a7ebe7277ae7f4230bb68a8b8b011b2f3 Reviewed-by: Tim Jenssen <tim.jenssen@qt.io>
Diffstat (limited to 'examples/quick/positioners')
-rw-r--r--examples/quick/positioners/positioners-attachedproperties.qml18
-rw-r--r--examples/quick/positioners/positioners-transitions.qml94
2 files changed, 56 insertions, 56 deletions
diff --git a/examples/quick/positioners/positioners-attachedproperties.qml b/examples/quick/positioners/positioners-attachedproperties.qml
index ac2c76db47..e7fa59bb9a 100644
--- a/examples/quick/positioners/positioners-attachedproperties.qml
+++ b/examples/quick/positioners/positioners-attachedproperties.qml
@@ -66,14 +66,14 @@ Rectangle {
anchors.left: parent.left
anchors.leftMargin: page.width / 32
anchors.topMargin: page.height / 48
- spacing: elementSpacing
+ spacing: page.elementSpacing
//! [0]
Rectangle {
id: green
color: "#80c342"
- width: 100 * ratio
- height: 100 * ratio
+ width: 100 * page.ratio
+ height: 100 * page.ratio
Text {
anchors.left: parent.right
@@ -95,8 +95,8 @@ Rectangle {
Rectangle {
id: blue
color: "#14aaff"
- width: 100 * ratio
- height: 100 * ratio
+ width: 100 * page.ratio
+ height: 100 * page.ratio
Text {
anchors.left: parent.right
@@ -117,8 +117,8 @@ Rectangle {
Rectangle {
id: purple
color: "#6400aa"
- width: 100 * ratio
- height: 100 * ratio
+ width: 100 * page.ratio
+ height: 100 * page.ratio
Text {
anchors.left: parent.right
@@ -140,8 +140,8 @@ Rectangle {
Rectangle {
id: hidingRect
color: "#006325"
- width: 100 * ratio
- height: 100 * ratio
+ width: 100 * page.ratio
+ height: 100 * page.ratio
visible: false
Text {
diff --git a/examples/quick/positioners/positioners-transitions.qml b/examples/quick/positioners/positioners-transitions.qml
index 0d283f7301..17fe41a7e2 100644
--- a/examples/quick/positioners/positioners-transitions.qml
+++ b/examples/quick/positioners/positioners-transitions.qml
@@ -55,7 +55,7 @@ Item {
interval: 2000
running: true
repeat: true
- onTriggered: effectiveOpacity = (effectiveOpacity == 1.0 ? 0.0 : 1.0);
+ onTriggered: page.effectiveOpacity = (page.effectiveOpacity == 1.0 ? 0.0 : 1.0);
}
Column {
@@ -65,7 +65,7 @@ Item {
top: parent.top
topMargin: page.height / 48
}
- spacing: elementSpacing
+ spacing: page.elementSpacing
populate: Transition {
NumberAnimation { properties: "x,y"; from: 200; duration: 100; easing.type: Easing.OutBounce }
@@ -77,32 +77,32 @@ Item {
NumberAnimation { properties: "y"; easing.type: Easing.OutBounce }
}
- Rectangle { color: "#80c342"; width: bigSize; height: smallSize }
+ Rectangle { color: "#80c342"; width: page.bigSize; height: page.smallSize }
Rectangle {
id: greenV1
visible: opacity != 0
- width: bigSize; height: smallSize
+ width: page.bigSize; height: page.smallSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#14aaff"; width: bigSize; height: smallSize }
+ Rectangle { color: "#14aaff"; width: page.bigSize; height: page.smallSize }
Rectangle {
id: greenV2
visible: opacity != 0
- width: bigSize; height: smallSize
+ width: page.bigSize; height: page.smallSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#6400aa"; width: bigSize; height: smallSize }
- Rectangle { color: "#80c342"; width: bigSize; height: smallSize }
+ Rectangle { color: "#6400aa"; width: page.bigSize; height: page.smallSize }
+ Rectangle { color: "#80c342"; width: page.bigSize; height: page.smallSize }
}
Row {
@@ -112,7 +112,7 @@ Item {
bottom: page.bottom
bottomMargin: page.height / 48
}
- spacing: elementSpacing
+ spacing: page.elementSpacing
populate: Transition {
NumberAnimation { properties: "x,y"; from: 200; duration: 100; easing.type: Easing.OutBounce }
@@ -124,40 +124,40 @@ Item {
NumberAnimation { properties: "x"; easing.type: Easing.OutBounce }
}
- Rectangle { color: "#80c342"; width: smallSize; height: bigSize }
+ Rectangle { color: "#80c342"; width: page.smallSize; height: page.bigSize }
Rectangle {
id: blueH1
visible: opacity != 0
- width: smallSize; height: bigSize
+ width: page.smallSize; height: page.bigSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#14aaff"; width: smallSize; height: bigSize }
+ Rectangle { color: "#14aaff"; width: page.smallSize; height: page.bigSize }
Rectangle {
id: greenH2
visible: opacity != 0
- width: smallSize; height: bigSize
+ width: page.smallSize; height: page.bigSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#6400aa"; width: smallSize; height: bigSize }
- Rectangle { color: "#80c342"; width: smallSize; height: bigSize }
+ Rectangle { color: "#6400aa"; width: page.smallSize; height: page.bigSize }
+ Rectangle { color: "#80c342"; width: page.smallSize; height: page.bigSize }
}
Grid {
anchors.top: parent.top
anchors.topMargin: page.height / 48
- anchors.left: flow.left
+ anchors.left: flowItem.left
columns: 3
- spacing: elementSpacing
+ spacing: page.elementSpacing
populate: Transition {
NumberAnimation { properties: "x,y"; from: 200; duration: 100; easing.type: Easing.OutBounce }
@@ -169,55 +169,55 @@ Item {
NumberAnimation { properties: "x,y"; easing.type: Easing.OutBounce }
}
- Rectangle { color: "#80c342"; width: smallSize; height: smallSize }
+ Rectangle { color: "#80c342"; width: page.smallSize; height: page.smallSize }
Rectangle {
id: greenG1
visible: opacity != 0
- width: smallSize; height: smallSize
+ width: page.smallSize; height: page.smallSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#14aaff"; width: smallSize; height: smallSize }
+ Rectangle { color: "#14aaff"; width: page.smallSize; height: page.smallSize }
Rectangle {
id: greenG2
visible: opacity != 0
- width: smallSize; height: smallSize
+ width: page.smallSize; height:page. smallSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#6400aa"; width: smallSize; height: smallSize }
+ Rectangle { color: "#6400aa"; width: page.smallSize; height: page.smallSize }
Rectangle {
id: greenG3
visible: opacity != 0
- width: smallSize; height: smallSize
+ width: page.smallSize; height: page.smallSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#80c342"; width: smallSize; height: smallSize }
- Rectangle { color: "#14aaff"; width: smallSize; height: smallSize }
- Rectangle { color: "#6400aa"; width: smallSize; height: smallSize }
+ Rectangle { color: "#80c342"; width:page. smallSize; height: page.smallSize }
+ Rectangle { color: "#14aaff"; width: smallSize; height: page.smallSize }
+ Rectangle { color: "#6400aa"; width: page.page.smallSize; height: page.smallSize }
}
Flow {
- id: flow
+ id: flowItem
anchors.right: page.right
anchors.rightMargin: page.width / 32
- y: 2 * bigSize
- width: 1.8 * bigSize
- spacing: elementSpacing
+ y: 2 * page.bigSize
+ width: 1.8 * page.bigSize
+ spacing: page.elementSpacing
//! [move]
move: Transition {
@@ -237,42 +237,42 @@ Item {
}
//! [populate]
- Rectangle { color: "#80c342"; width: smallSize; height: smallSize }
+ Rectangle { color: "#80c342"; width: page.smallSize; height: page.smallSize }
Rectangle {
id: greenF1
visible: opacity != 0
- width: 0.6 * bigSize; height: smallSize
+ width: 0.6 * page.bigSize; height: page.smallSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#14aaff"; width: 0.3 * bigSize; height: smallSize }
+ Rectangle { color: "#14aaff"; width: 0.3 * page.bigSize; height: page.smallSize }
Rectangle {
id: greenF2
visible: opacity != 0
- width: 0.6 * bigSize; height: smallSize
+ width: 0.6 * page.bigSize; height: page.smallSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#6400aa"; width: smallSize; height: smallSize }
+ Rectangle { color: "#6400aa"; width: page.smallSize; height: page.smallSize }
Rectangle {
id: greenF3
visible: opacity != 0
- width: 0.4 * bigSize; height: smallSize
+ width: 0.4 * page.bigSize; height: page.smallSize
color: "#006325"
border.color: "transparent"
Behavior on opacity { NumberAnimation {} }
- opacity: effectiveOpacity
+ opacity: page.effectiveOpacity
}
- Rectangle { color: "#80c342"; width: 0.8 * bigSize; height: smallSize }
+ Rectangle { color: "#80c342"; width: 0.8 * page.bigSize; height: page.smallSize }
}
}