Update examples to use new PropertyChanges

Also, prefer the multi-line syntax over ';'-separated bindings for
readability.

Change-Id: I3d6eb854e514ee257ca83773a11e6e9e10770bff
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>

2 files changed, 24 insertions, 4 deletions

diff --git a/examples/quick/animation/states/states.qml b/examples/quick/animation/states/states.qml
index 5ff8e5318c..1b90cacb82 100644
--- a/examples/quick/animation/states/states.qml
+++ b/examples/quick/animation/states/states.qml
@@ -101,13 +101,23 @@ Rectangle {
         // In state 'middleRight', move the image to middleRightRect
         State {
             name: "middleRight"
-            PropertyChanges { target: userIcon; x: middleRightRect.x; y: middleRightRect.y }
+            PropertyChanges {
+                userIcon {
+                    x: middleRightRect.x
+                    y: middleRightRect.y
+                }
+            }
         },
 
         // In state 'bottomLeft', move the image to bottomLeftRect
         State {
             name: "bottomLeft"
-            PropertyChanges { target: userIcon; x: bottomLeftRect.x; y: bottomLeftRect.y  }
+            PropertyChanges {
+                userIcon {
+                    x: bottomLeftRect.x
+                    y: bottomLeftRect.y
+                }
+            }
         }
         // ![0]
     ]
diff --git a/examples/quick/animation/states/transitions.qml b/examples/quick/animation/states/transitions.qml
index 1cfdfec18a..a4e0f218c7 100644
--- a/examples/quick/animation/states/transitions.qml
+++ b/examples/quick/animation/states/transitions.qml
@@ -105,13 +105,23 @@ Rectangle {
         // In state 'middleRight', move the image to middleRightRect
         State {
             name: "middleRight"
-            PropertyChanges { target: userIcon; x: middleRightRect.x; y: middleRightRect.y }
+            PropertyChanges {
+                userIcon {
+                    x: middleRightRect.x
+                    y: middleRightRect.y
+                }
+            }
         },
 
         // In state 'bottomLeft', move the image to bottomLeftRect
         State {
             name: "bottomLeft"
-            PropertyChanges { target: userIcon; x: bottomLeftRect.x; y: bottomLeftRect.y  }
+            PropertyChanges {
+                userIcon {
+                    x: bottomLeftRect.x
+                    y: bottomLeftRect.y
+                }
+            }
         }
     ]