qiurui
/
qtdeclarative
mirror of https://github.com/qt/qtdeclarative.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

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>
This commit is contained in:
Thomas Hartmann 2016-10-26 12:17:55 +02:00 committed by Tim Jenssen
parent 47847bebca
commit 441e6bbdb0
2 changed files with 56 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
examples/quick/positioners/positioners-attachedproperties.qml
View File

@ -66,14 +66,14 @@ Rectangle {
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: page.width / 32 anchors.leftMargin: page.width / 32
anchors.topMargin: page.height / 48 anchors.topMargin: page.height / 48
spacing: elementSpacing spacing: page.elementSpacing
//! [0] //! [0]
Rectangle { Rectangle {
id: green id: green
color: "#80c342" color: "#80c342"
width: 100 * ratio width: 100 * page.ratio
height: 100 * ratio height: 100 * page.ratio
Text { Text {
anchors.left: parent.right anchors.left: parent.right
@ -95,8 +95,8 @@ Rectangle {
Rectangle { Rectangle {
id: blue id: blue
color: "#14aaff" color: "#14aaff"
width: 100 * ratio width: 100 * page.ratio
height: 100 * ratio height: 100 * page.ratio
Text { Text {
anchors.left: parent.right anchors.left: parent.right
@ -117,8 +117,8 @@ Rectangle {
Rectangle { Rectangle {
id: purple id: purple
color: "#6400aa" color: "#6400aa"
width: 100 * ratio width: 100 * page.ratio
height: 100 * ratio height: 100 * page.ratio
Text { Text {
anchors.left: parent.right anchors.left: parent.right
@ -140,8 +140,8 @@ Rectangle {
Rectangle { Rectangle {
id: hidingRect id: hidingRect
color: "#006325" color: "#006325"
width: 100 * ratio width: 100 * page.ratio
height: 100 * ratio height: 100 * page.ratio
visible: false visible: false
Text { Text {

94
examples/quick/positioners/positioners-transitions.qml
View File

@ -55,7 +55,7 @@ Item {
interval: 2000 interval: 2000
running: true running: true
repeat: true repeat: true
onTriggered: effectiveOpacity = (effectiveOpacity == 1.0 ? 0.0 : 1.0); onTriggered: page.effectiveOpacity = (page.effectiveOpacity == 1.0 ? 0.0 : 1.0);
} }
Column { Column {
@ -65,7 +65,7 @@ Item {
top: parent.top top: parent.top
topMargin: page.height / 48 topMargin: page.height / 48
} }
spacing: elementSpacing spacing: page.elementSpacing
populate: Transition { populate: Transition {
NumberAnimation { properties: "x,y"; from: 200; duration: 100; easing.type: Easing.OutBounce } NumberAnimation { properties: "x,y"; from: 200; duration: 100; easing.type: Easing.OutBounce }
@ -77,32 +77,32 @@ Item {
NumberAnimation { properties: "y"; easing.type: Easing.OutBounce } NumberAnimation { properties: "y"; easing.type: Easing.OutBounce }
} }
Rectangle { color: "#80c342"; width: bigSize; height: smallSize } Rectangle { color: "#80c342"; width: page.bigSize; height: page.smallSize }
Rectangle { Rectangle {
id: greenV1 id: greenV1
visible: opacity != 0 visible: opacity != 0
width: bigSize; height: smallSize width: page.bigSize; height: page.smallSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } 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 { Rectangle {
id: greenV2 id: greenV2
visible: opacity != 0 visible: opacity != 0
width: bigSize; height: smallSize width: page.bigSize; height: page.smallSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } Behavior on opacity { NumberAnimation {} }
opacity: effectiveOpacity opacity: page.effectiveOpacity
} }
Rectangle { color: "#6400aa"; width: bigSize; height: smallSize } Rectangle { color: "#6400aa"; width: page.bigSize; height: page.smallSize }
Rectangle { color: "#80c342"; width: bigSize; height: smallSize } Rectangle { color: "#80c342"; width: page.bigSize; height: page.smallSize }
} }
Row { Row {
@ -112,7 +112,7 @@ Item {
bottom: page.bottom bottom: page.bottom
bottomMargin: page.height / 48 bottomMargin: page.height / 48
} }
spacing: elementSpacing spacing: page.elementSpacing
populate: Transition { populate: Transition {
NumberAnimation { properties: "x,y"; from: 200; duration: 100; easing.type: Easing.OutBounce } NumberAnimation { properties: "x,y"; from: 200; duration: 100; easing.type: Easing.OutBounce }
@ -124,40 +124,40 @@ Item {
NumberAnimation { properties: "x"; easing.type: Easing.OutBounce } NumberAnimation { properties: "x"; easing.type: Easing.OutBounce }
} }
Rectangle { color: "#80c342"; width: smallSize; height: bigSize } Rectangle { color: "#80c342"; width: page.smallSize; height: page.bigSize }
Rectangle { Rectangle {
id: blueH1 id: blueH1
visible: opacity != 0 visible: opacity != 0
width: smallSize; height: bigSize width: page.smallSize; height: page.bigSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } 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 { Rectangle {
id: greenH2 id: greenH2
visible: opacity != 0 visible: opacity != 0
width: smallSize; height: bigSize width: page.smallSize; height: page.bigSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } Behavior on opacity { NumberAnimation {} }
opacity: effectiveOpacity opacity: page.effectiveOpacity
} }
Rectangle { color: "#6400aa"; width: smallSize; height: bigSize } Rectangle { color: "#6400aa"; width: page.smallSize; height: page.bigSize }
Rectangle { color: "#80c342"; width: smallSize; height: bigSize } Rectangle { color: "#80c342"; width: page.smallSize; height: page.bigSize }
} }
Grid { Grid {
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: page.height / 48 anchors.topMargin: page.height / 48
anchors.left: flow.left anchors.left: flowItem.left
columns: 3 columns: 3
spacing: elementSpacing spacing: page.elementSpacing
populate: Transition { populate: Transition {
NumberAnimation { properties: "x,y"; from: 200; duration: 100; easing.type: Easing.OutBounce } 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 } 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 { Rectangle {
id: greenG1 id: greenG1
visible: opacity != 0 visible: opacity != 0
width: smallSize; height: smallSize width: page.smallSize; height: page.smallSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } 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 { Rectangle {
id: greenG2 id: greenG2
visible: opacity != 0 visible: opacity != 0
width: smallSize; height: smallSize width: page.smallSize; height:page. smallSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } 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 { Rectangle {
id: greenG3 id: greenG3
visible: opacity != 0 visible: opacity != 0
width: smallSize; height: smallSize width: page.smallSize; height: page.smallSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } Behavior on opacity { NumberAnimation {} }
opacity: effectiveOpacity opacity: page.effectiveOpacity
} }
Rectangle { color: "#80c342"; width: smallSize; height: smallSize } Rectangle { color: "#80c342"; width:page. smallSize; height: page.smallSize }
Rectangle { color: "#14aaff"; width: smallSize; height: smallSize } Rectangle { color: "#14aaff"; width: smallSize; height: page.smallSize }
Rectangle { color: "#6400aa"; width: smallSize; height: smallSize } Rectangle { color: "#6400aa"; width: page.page.smallSize; height: page.smallSize }
} }
Flow { Flow {
id: flow id: flowItem
anchors.right: page.right anchors.right: page.right
anchors.rightMargin: page.width / 32 anchors.rightMargin: page.width / 32
y: 2 * bigSize y: 2 * page.bigSize
width: 1.8 * bigSize width: 1.8 * page.bigSize
spacing: elementSpacing spacing: page.elementSpacing
//! [move] //! [move]
move: Transition { move: Transition {
@ -237,42 +237,42 @@ Item {
} }
//! [populate] //! [populate]
Rectangle { color: "#80c342"; width: smallSize; height: smallSize } Rectangle { color: "#80c342"; width: page.smallSize; height: page.smallSize }
Rectangle { Rectangle {
id: greenF1 id: greenF1
visible: opacity != 0 visible: opacity != 0
width: 0.6 * bigSize; height: smallSize width: 0.6 * page.bigSize; height: page.smallSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } 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 { Rectangle {
id: greenF2 id: greenF2
visible: opacity != 0 visible: opacity != 0
width: 0.6 * bigSize; height: smallSize width: 0.6 * page.bigSize; height: page.smallSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } 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 { Rectangle {
id: greenF3 id: greenF3
visible: opacity != 0 visible: opacity != 0
width: 0.4 * bigSize; height: smallSize width: 0.4 * page.bigSize; height: page.smallSize
color: "#006325" color: "#006325"
border.color: "transparent" border.color: "transparent"
Behavior on opacity { NumberAnimation {} } 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 }
} }
} }