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>

31 files changed, 255 insertions, 161 deletions

diff --git a/examples/qml/dynamicscene/dynamicscene.qml b/examples/qml/dynamicscene/dynamicscene.qml
index 0775d7593e..6b127da1db 100644
--- a/examples/qml/dynamicscene/dynamicscene.qml
+++ b/examples/qml/dynamicscene/dynamicscene.qml
@@ -268,9 +268,11 @@ Item {
         name: "Day"
         when: window.activeSuns > 0
 
-        PropertyChanges { target: gradientStopA; color: "DeepSkyBlue" }
-        PropertyChanges { target: gradientStopB; color: "SkyBlue" }
-        PropertyChanges { target: stars; opacity: 0 }
+        PropertyChanges {
+            gradientStopA.color: "DeepSkyBlue"
+            gradientStopB.color: "SkyBlue"
+            stars.opacity: 0
+        }
     }
 
     //! [top-level transitions]
diff --git a/examples/quick/animation/easing/easing.qml b/examples/quick/animation/easing/easing.qml
index 44c078b9a2..e9256ea51f 100644
--- a/examples/quick/animation/easing/easing.qml
+++ b/examples/quick/animation/easing/easing.qml
@@ -145,9 +145,10 @@ Rectangle {
                 states : State {
                     name: "right"
                     PropertyChanges {
-                        target: rect;
-                        x: window.width - 76;
-                        color: delegateInstance.ballColor
+                        rect {
+                            x: window.width - 76;
+                            color: delegateInstance.ballColor
+                        }
                     }
                 }
 
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
+                }
+            }
         }
     ]
 
diff --git a/examples/quick/customitems/flipable/Card.qml b/examples/quick/customitems/flipable/Card.qml
index bc50bbe473..3ecf017d6c 100644
--- a/examples/quick/customitems/flipable/Card.qml
+++ b/examples/quick/customitems/flipable/Card.qml
@@ -75,7 +75,7 @@ Flipable {
 
     states: State {
         name: "back"; when: container.flipped
-        PropertyChanges { target: rotation; angle: container.angle }
+        PropertyChanges { rotation.angle: container.angle }
     }
 
     transitions: Transition {
diff --git a/examples/quick/customitems/scrollbar/main.qml b/examples/quick/customitems/scrollbar/main.qml
index 9248e44a42..f0a2cff50a 100644
--- a/examples/quick/customitems/scrollbar/main.qml
+++ b/examples/quick/customitems/scrollbar/main.qml
@@ -71,8 +71,10 @@ Rectangle {
         states: State {
             name: "ShowBars"
             when: view.movingVertically || view.movingHorizontally
-            PropertyChanges { target: verticalScrollBar; opacity: 1 }
-            PropertyChanges { target: horizontalScrollBar; opacity: 1 }
+            PropertyChanges {
+                verticalScrollBar.opacity: 1
+                horizontalScrollBar.opacity: 1
+            }
         }
 
         transitions: Transition {
diff --git a/examples/quick/customitems/searchbox/SearchBox.qml b/examples/quick/customitems/searchbox/SearchBox.qml
index 13927e0d6f..99eff06529 100644
--- a/examples/quick/customitems/searchbox/SearchBox.qml
+++ b/examples/quick/customitems/searchbox/SearchBox.qml
@@ -102,8 +102,10 @@ FocusScope {
 
     states: State {
         name: "hasText"; when: textInput.text != ''
-        PropertyChanges { target: typeSomething; opacity: 0 }
-        PropertyChanges { target: clear; opacity: 1 }
+        PropertyChanges {
+            typeSomething.opacity: 0
+            clear.opacity: 1
+        }
     }
 
     transitions: [
diff --git a/examples/quick/customitems/slideswitch/content/Switch.qml b/examples/quick/customitems/slideswitch/content/Switch.qml
index 72eb13e1e3..43c06f2105 100644
--- a/examples/quick/customitems/slideswitch/content/Switch.qml
+++ b/examples/quick/customitems/slideswitch/content/Switch.qml
@@ -107,13 +107,17 @@ Item {
     states: [
         State {
             name: "on"
-            PropertyChanges { target: knob; x: 78 }
-            PropertyChanges { target: toggleswitch; on: true }
+            PropertyChanges {
+                knob.x: 78
+                toggleswitch.on: true
+            }
         },
         State {
             name: "off"
-            PropertyChanges { target: knob; x: 1 }
-            PropertyChanges { target: toggleswitch; on: false }
+            PropertyChanges {
+                knob.x: 1
+                toggleswitch.on: false
+            }
         }
     ]
 //![6]
diff --git a/examples/quick/draganddrop/tiles/DropTile.qml b/examples/quick/draganddrop/tiles/DropTile.qml
index bf7101f0f6..b9cf683686 100644
--- a/examples/quick/draganddrop/tiles/DropTile.qml
+++ b/examples/quick/draganddrop/tiles/DropTile.qml
@@ -70,8 +70,7 @@ DropArea {
             State {
                 when: dragTarget.containsDrag
                 PropertyChanges {
-                    target: dropRectangle
-                    color: "grey"
+                    dropRectangle.color: "grey"
                 }
             }
         ]
diff --git a/examples/quick/keyinteraction/focus/Core/GridMenu.qml b/examples/quick/keyinteraction/focus/Core/GridMenu.qml
index 78d6654957..46b903457c 100644
--- a/examples/quick/keyinteraction/focus/Core/GridMenu.qml
+++ b/examples/quick/keyinteraction/focus/Core/GridMenu.qml
@@ -105,7 +105,12 @@ FocusScope {
 
                 states: State {
                     name: "active"; when: container.activeFocus
-                    PropertyChanges { target: content; color: "#FCFFF5"; scale: 1.1 }
+                    PropertyChanges {
+                        content {
+                            color: "#FCFFF5"
+                            scale: 1.1
+                        }
+                    }
                 }
 
                 transitions: Transition {
diff --git a/examples/quick/keyinteraction/focus/Core/ListViewDelegate.qml b/examples/quick/keyinteraction/focus/Core/ListViewDelegate.qml
index 5a2957eab0..971e39cff1 100644
--- a/examples/quick/keyinteraction/focus/Core/ListViewDelegate.qml
+++ b/examples/quick/keyinteraction/focus/Core/ListViewDelegate.qml
@@ -87,8 +87,13 @@ Item {
 
     states: State {
         name: "active"; when: container.activeFocus
-        PropertyChanges { target: content; color: "#FCFFF5"; scale: 1.1 }
-        PropertyChanges { target: label; font.pixelSize: 16 }
+        PropertyChanges {
+            content {
+                color: "#FCFFF5"
+                scale: 1.1
+            }
+            label.font.pixelSize: 16
+        }
     }
 
     transitions: Transition {
diff --git a/examples/quick/keyinteraction/focus/Core/TabMenu.qml b/examples/quick/keyinteraction/focus/Core/TabMenu.qml
index 11b3d005c3..9feb46afbc 100644
--- a/examples/quick/keyinteraction/focus/Core/TabMenu.qml
+++ b/examples/quick/keyinteraction/focus/Core/TabMenu.qml
@@ -100,7 +100,12 @@ FocusScope {
 
                     states: State {
                         name: "active"; when: container.activeFocus
-                        PropertyChanges { target: content; color: "#FCFFF5"; scale: 1.1 }
+                        PropertyChanges {
+                            content {
+                                color: "#FCFFF5"
+                                scale: 1.1
+                            }
+                        }
                     }
 
                     transitions: Transition {
diff --git a/examples/quick/keyinteraction/focus/focus.qml b/examples/quick/keyinteraction/focus/focus.qml
index 9db9ab48bc..b3c79d7ead 100644
--- a/examples/quick/keyinteraction/focus/focus.qml
+++ b/examples/quick/keyinteraction/focus/focus.qml
@@ -119,23 +119,29 @@ Rectangle {
         states:  [
             State {
                 name: "showTabViews"
-                PropertyChanges { target: tabMenu; y:  160 }
-                PropertyChanges { target: gridMenu; y: 320 }
-                PropertyChanges { target: listMenu; y: 640 }
+                PropertyChanges {
+                    tabMenu.y:  160
+                    gridMenu.y: 320
+                    listMenu.y: 640
+                }
             },
 
             State {
                 name: "showGridViews"
-                PropertyChanges { target: tabMenu; y:    0 }
-                PropertyChanges { target: gridMenu; y: 160 }
-                PropertyChanges { target: listMenu; y: 480 }
+                PropertyChanges {
+                    tabMenu.y:    0
+                    gridMenu.y: 160
+                    listMenu.y: 480
+                }
             },
 
             State {
                 name: "showListViews"
-                PropertyChanges { target: tabMenu; y: -160 }
-                PropertyChanges { target: gridMenu; y: 0 }
-                PropertyChanges { target: listMenu; y: 320 }
+                PropertyChanges {
+                    tabMenu.y: -160
+                    gridMenu.y: 0
+                    listMenu.y: 320
+                }
             }
         ]
 
@@ -166,9 +172,14 @@ Rectangle {
     states: State {
         name: "contextMenuOpen"
         when: !mainView.activeFocus
-        PropertyChanges { target: contextMenu; x: 0; open: true }
-        PropertyChanges { target: mainView; x: 130 }
-        PropertyChanges { target: shade; opacity: 0.25 }
+        PropertyChanges {
+            contextMenu {
+                x: 0
+                open: true
+            }
+            mainView.x: 130
+            shade.opacity: 0.25
+        }
     }
 
     transitions: Transition {
diff --git a/examples/quick/particles/imageparticle/content/sharing.qml b/examples/quick/particles/imageparticle/content/sharing.qml
index 13b0dadf85..13ca1aa2d1 100644
--- a/examples/quick/particles/imageparticle/content/sharing.qml
+++ b/examples/quick/particles/imageparticle/content/sharing.qml
@@ -87,7 +87,7 @@ Rectangle {
         states: State {
             name: "Current"
             when: pet.ListView.isCurrentItem
-            PropertyChanges { target: pet; x: 20 }
+            PropertyChanges { pet.x: 20 }
         }
         transitions: Transition {
             NumberAnimation { properties: "x"; duration: 200 }
diff --git a/examples/quick/particles/itemparticle/content/Delegate2.qml b/examples/quick/particles/itemparticle/content/Delegate2.qml
index 03465609d9..7d8cbff2fe 100644
--- a/examples/quick/particles/itemparticle/content/Delegate2.qml
+++ b/examples/quick/particles/itemparticle/content/Delegate2.qml
@@ -66,8 +66,7 @@ Package {
                 name: "gridded"
                 when: root.inGrid
                 PropertyChanges {
-                    target: wrapper
-                    rotation: 0
+                    wrapper.rotation: 0
                 }
                 ParentChange {
                     target: wrapper
diff --git a/examples/quick/particles/itemparticle/content/ExpandingDelegate.qml b/examples/quick/particles/itemparticle/content/ExpandingDelegate.qml
index 9ffbc7f350..b81de6797f 100644
--- a/examples/quick/particles/itemparticle/content/ExpandingDelegate.qml
+++ b/examples/quick/particles/itemparticle/content/ExpandingDelegate.qml
@@ -182,16 +182,37 @@ import "../../../modelviews/listview/content"
             states: State {
                 name: "Details"
 
-                PropertyChanges { target: background; color: "white" }
-                PropertyChanges { target: recipeImage; width: 130; height: 130 } // Make picture bigger
-                PropertyChanges { target: recipe; detailsOpacity: 1; x: 0; opacity: 1 } // Make details visible
-                PropertyChanges { target: recipe; height: root.height; width: root.height; x:0; y:0; z:100} // Fill the entire list area with the detailed view
-
-                // Move the list so that this item is at the top.
-                //PropertyChanges { target: recipe.ListView.view; explicit: true; contentY: recipe.y }
+                PropertyChanges {
+                    background.color: "white"
+                    recipeImage {
+                        // Make picture bigger
+                        width: 130
+                        height: 130
+                    }
+                    recipe {
+                        // Make details visible
+                        detailsOpacity: 1
+                        x: 0
+                        opacity: 1
+
+                        // Fill the entire list area with the detailed view
+                        height: root.height
+                        width: root.height
+                        x:0
+                        y:0
+                        z:100
+                    }
+                }
 
-                // Disallow flicking while we're in detailed view
-                //PropertyChanges { target: recipe.ListView.view; interactive: false }
+                // Move the list so that this item is at the top and
+                // disallow flicking while we're in detailed view
+                // PropertyChanges {
+                //     recipe.ListView.view {
+                //         explicit: true
+                //         contentY: recipe.y
+                //         interactive: false
+                //     }
+                // }
             }
 
             transitions: Transition {
diff --git a/examples/quick/particles/itemparticle/particleview.qml b/examples/quick/particles/itemparticle/particleview.qml
index 8eb18dc283..9b7fb17da1 100644
--- a/examples/quick/particles/itemparticle/particleview.qml
+++ b/examples/quick/particles/itemparticle/particleview.qml
@@ -281,16 +281,17 @@ Item {
                     parent: root
                 }
                 PropertyChanges {
-                    target: image
-                    source: image.media
-                    x: 0
-                    y: 0
-                    width: root.width
-                    height: root.height
-                    z: 101
-                    opacity: 1
-                    rotation: 0
-                    darken: 0
+                    image {
+                        source: image.media
+                        x: 0
+                        y: 0
+                        width: root.width
+                        height: root.height
+                        z: 101
+                        opacity: 1
+                        rotation: 0
+                        darken: 0
+                    }
                 }
             }
             transitions: Transition {
diff --git a/examples/quick/pointerhandlers/components/ScrollBar.qml b/examples/quick/pointerhandlers/components/ScrollBar.qml
index 0ed720eca0..cd1efe2e12 100644
--- a/examples/quick/pointerhandlers/components/ScrollBar.qml
+++ b/examples/quick/pointerhandlers/components/ScrollBar.qml
@@ -115,47 +115,41 @@ Rectangle {
             State {
                 name: "horizontal"
                 PropertyChanges {
-                    target: knob
-                    max: root.width - knob.width
-                    scrolledX: Math.min(max, Math.max(0, max * flick.contentX / (flick.width - flick.contentWidth)))
-                    scrolledY: 1
-                    scrollDistance: flick.width - flick.contentWidth
-                    width: flick.width * (flick.width / flick.contentWidth) - (height - anchors.margins) * 2
-                    height: root.height - 2
-                }
-                PropertyChanges {
-                    target: drag
-                    xAxis.minimum: 0
-                    xAxis.maximum: knob.max
-                    yAxis.minimum: 1
-                    yAxis.maximum: 1
-                }
-                PropertyChanges {
-                    target: root
-                    position: knob.x / drag.xAxis.maximum
+                    knob {
+                        max: root.width - knob.width
+                        scrolledX: Math.min(max, Math.max(0, max * flick.contentX / (flick.width - flick.contentWidth)))
+                        scrolledY: 1
+                        scrollDistance: flick.width - flick.contentWidth
+                        width: flick.width * (flick.width / flick.contentWidth) - (height - anchors.margins) * 2
+                        height: root.height - 2
+                    }
+                    drag {
+                        xAxis.minimum: 0
+                        xAxis.maximum: knob.max
+                        yAxis.minimum: 1
+                        yAxis.maximum: 1
+                    }
+                    root.position: knob.x / drag.xAxis.maximum
                 }
             },
             State {
                 name: "vertical"
                 PropertyChanges {
-                    target: knob
-                    max: root.height - knob.height
-                    scrolledX: 1
-                    scrolledY: Math.min(max, Math.max(0, max * flick.contentY / (flick.height - flick.contentHeight)))
-                    scrollDistance: flick.height - flick.contentHeight
-                    width: root.width - 2
-                    height: root.width - 2
-                }
-                PropertyChanges {
-                    target: drag
-                    xAxis.minimum: 1
-                    xAxis.maximum: 1
-                    yAxis.minimum: 0
-                    yAxis.maximum: knob.max
-                }
-                PropertyChanges {
-                    target: root
-                    position: knob.y / drag.yAxis.maximum
+                    knob {
+                        max: root.height - knob.height
+                        scrolledX: 1
+                        scrolledY: Math.min(max, Math.max(0, max * flick.contentY / (flick.height - flick.contentHeight)))
+                        scrollDistance: flick.height - flick.contentHeight
+                        width: root.width - 2
+                        height: root.width - 2
+                    }
+                    drag {
+                        xAxis.minimum: 1
+                        xAxis.maximum: 1
+                        yAxis.minimum: 0
+                        yAxis.maximum: knob.max
+                    }
+                    root.position: knob.y / drag.yAxis.maximum
                 }
             }
         ]
diff --git a/examples/quick/text/textselection/textselection.qml b/examples/quick/text/textselection/textselection.qml
index 0e979c28a4..7dcd2c962a 100644
--- a/examples/quick/text/textselection/textselection.qml
+++ b/examples/quick/text/textselection/textselection.qml
@@ -208,14 +208,18 @@ Rectangle {
     states: [
         State {
             name: "selection"
-            PropertyChanges { target: startHandle; opacity: 1.0 }
-            PropertyChanges { target: endHandle; opacity: 1.0 }
+            PropertyChanges {
+                startHandle.opacity: 1.0
+                endHandle.opacity: 1.0
+            }
         },
         State {
             name: "menu"
-            PropertyChanges { target: startHandle; opacity: 0.5 }
-            PropertyChanges { target: endHandle; opacity: 0.5 }
-            PropertyChanges { target: menu; opacity: 1.0 }
+            PropertyChanges {
+                startHandle.opacity: 0.5
+                endHandle.opacity: 0.5
+                menu.opacity: 1.0
+            }
         }
     ]
 }
diff --git a/examples/quick/touchinteraction/flickable/Panel.qml b/examples/quick/touchinteraction/flickable/Panel.qml
index 0aae0635b2..7ffb7f1e77 100644
--- a/examples/quick/touchinteraction/flickable/Panel.qml
+++ b/examples/quick/touchinteraction/flickable/Panel.qml
@@ -143,8 +143,13 @@ Item {
             states: State {
                 name: "pressed"
                 when: mouse.pressed
-                PropertyChanges { target: sticky; rotation: 8; scale: 1 }
-                PropertyChanges { target: page; z: 8 }
+                PropertyChanges {
+                    sticky {
+                        rotation: 8
+                        scale: 1
+                    }
+                    page.z: 8
+                }
             }
 
             transitions: Transition {
diff --git a/examples/quick/tutorials/helloworld/tutorial3.qml b/examples/quick/tutorials/helloworld/tutorial3.qml
index 8c40b40e1a..0ce941378b 100644
--- a/examples/quick/tutorials/helloworld/tutorial3.qml
+++ b/examples/quick/tutorials/helloworld/tutorial3.qml
@@ -70,7 +70,13 @@ Rectangle {
 //![2]
         states: State {
             name: "down"; when: mouseArea.pressed == true
-            PropertyChanges { target: helloText; y: 160; rotation: 180; color: "red" }
+            PropertyChanges {
+                helloText {
+                    y: 160
+                    rotation: 180
+                    color: "red"
+                }
+            }
         }
 //![2]
 
diff --git a/examples/quick/tutorials/samegame/samegame4/BoomBlock.qml b/examples/quick/tutorials/samegame/samegame4/BoomBlock.qml
index 8353437542..1a0062c0d2 100644
--- a/examples/quick/tutorials/samegame/samegame4/BoomBlock.qml
+++ b/examples/quick/tutorials/samegame/samegame4/BoomBlock.qml
@@ -124,14 +124,14 @@ Item {
         State {
             name: "AliveState"
             when: block.spawned == true && block.dying == false
-            PropertyChanges { target: img; opacity: 1 }
+            PropertyChanges { img.opacity: 1 }
         },
 
         State {
             name: "DeathState"
             when: block.dying == true
             StateChangeScript { script: particles.burst(50); }
-            PropertyChanges { target: img; opacity: 0 }
+            PropertyChanges { img.opacity: 0 }
             StateChangeScript { script: block.destroy(1000); }
         }
     ]
diff --git a/examples/quick/views/delegatemodel/dragselection.qml b/examples/quick/views/delegatemodel/dragselection.qml
index f9a0d37311..69dc0136e5 100644
--- a/examples/quick/views/delegatemodel/dragselection.qml
+++ b/examples/quick/views/delegatemodel/dragselection.qml
@@ -91,7 +91,7 @@ Item {
                         when: visibleContainer.drag.active
                         AnchorChanges { target:  draggable; anchors { horizontalCenter: undefined; verticalCenter: undefined} }
                         ParentChange { target: selectionView; parent: draggable; x: 0; y: 0 }
-                        PropertyChanges { target: root; dragging: true }
+                        PropertyChanges { root.dragging: true }
                         ParentChange { target: draggable; parent: root }
                     }
                 }
@@ -156,15 +156,17 @@ Item {
                     State {
                         name: "selected"
                         ParentChange { target: content; parent: selectionContainer; x: 3; y: 3 }
-                        PropertyChanges { target: packageRoot; DelegateModel.inItems: visibleContainer.drag.active }
-                        PropertyChanges { target: gradientStart; color: "#017423" }
-                        PropertyChanges { target: gradientStart; color: "#007423" }
+                        PropertyChanges {
+                            packageRoot.DelegateModel.inItems: visibleContainer.drag.active
+                            gradientStart.color: "#017423"
+                        }
+                        PropertyChanges { gradientStart.color: "#007423" }
                     }, State {
                         name: "visible"
-                        PropertyChanges { target: packageRoot; DelegateModel.inItems: true }
+                        PropertyChanges { packageRoot.DelegateModel.inItems: true }
                         ParentChange { target: content; parent: visibleContainer; x: 3; y: 3 }
-                        PropertyChanges { target: gradientStart; color: "#8AC953" }
-                        PropertyChanges { target: gradientStart; color: "#8BC953" }
+                        PropertyChanges { gradientStart.color: "#8AC953" }
+                        PropertyChanges { gradientStart.color: "#8BC953" }
                     }
                 ]
                 transitions: Transition {
diff --git a/examples/quick/views/delegatemodel/slideshow.qml b/examples/quick/views/delegatemodel/slideshow.qml
index f11feb61bc..e3f9267c89 100644
--- a/examples/quick/views/delegatemodel/slideshow.qml
+++ b/examples/quick/views/delegatemodel/slideshow.qml
@@ -104,15 +104,19 @@ Rectangle {
                         when: root.displayItem === delegateItem
                         name: "inDisplay";
                         ParentChange { target: image; parent: imageContainer; x: 75; y: 75; width: 150; height: 150 }
-                        PropertyChanges { target: image; z: 2 }
-                        PropertyChanges { target: delegateItem; DelegateModel.inItems: false }
+                        PropertyChanges {
+                            image.z: 2
+                            delegateItem.DelegateModel.inItems: false
+                        }
                     },
                     State {
                         when: root.displayItem !== delegateItem
                         name: "inList";
                         ParentChange { target: image; parent: delegateItem; x: 2; y: 2; width: 75; height: 75 }
-                        PropertyChanges { target: image; z: 1 }
-                        PropertyChanges { target: delegateItem; DelegateModel.inItems: true }
+                        PropertyChanges {
+                            image.z: 1
+                            delegateItem.DelegateModel.inItems: true
+                        }
                     }
                 ]
 
diff --git a/examples/quick/views/listview/content/TextButton.qml b/examples/quick/views/listview/content/TextButton.qml
index ed95112d47..734601d48b 100644
--- a/examples/quick/views/listview/content/TextButton.qml
+++ b/examples/quick/views/listview/content/TextButton.qml
@@ -80,7 +80,7 @@ Rectangle {
     states: State {
         name: "pressed"
         when: mouseArea.pressed
-        PropertyChanges { target: gradientStop; color: "#333333" }
+        PropertyChanges { gradientStop.color: "#333333" }
     }
 }
 
diff --git a/examples/quick/views/listview/expandingdelegates.qml b/examples/quick/views/listview/expandingdelegates.qml
index 6ed1d8c341..6516d0b7ce 100644
--- a/examples/quick/views/listview/expandingdelegates.qml
+++ b/examples/quick/views/listview/expandingdelegates.qml
@@ -195,16 +195,33 @@ Rectangle {
             states: State {
                 name: "Details"
 
-                PropertyChanges { target: background; color: "white" }
-                PropertyChanges { target: recipeImage; width: 130; height: 130 } // Make picture bigger
-                PropertyChanges { target: recipe; detailsOpacity: 1; x: 0 } // Make details visible
-                PropertyChanges { target: recipe; height: listView.height } // Fill the entire list area with the detailed view
+                PropertyChanges {
+                    background.color: "white"
+                    recipeImage {
+                         // Make picture bigger
+                        width: 130
+                        height: 130
+                    }
+                    recipe {
+                        // Make details visible
+                        detailsOpacity: 1
+                        x: 0
+
+                        // Fill the entire list area with the detailed view
+                        height: listView.height
+                    }
+                }
 
                 // Move the list so that this item is at the top.
-                PropertyChanges { target: recipe.ListView.view; explicit: true; contentY: recipe.y }
+                PropertyChanges {
+                    recipe.ListView.view.contentY: recipe.y
+                    explicit: true;
+                }
 
                 // Disallow flicking while we're in detailed view
-                PropertyChanges { target: recipe.ListView.view; interactive: false }
+                PropertyChanges {
+                    recipe.ListView.view.interactive: false
+                }
             }
 
             transitions: Transition {
diff --git a/examples/quick/views/listview/highlight.qml b/examples/quick/views/listview/highlight.qml
index 092b4d59bd..b1b7acb89c 100644
--- a/examples/quick/views/listview/highlight.qml
+++ b/examples/quick/views/listview/highlight.qml
@@ -78,7 +78,7 @@ Rectangle {
         states: State {
             name: "Current"
             when: pet.ListView.isCurrentItem
-            PropertyChanges { target: pet; x: 20 }
+            PropertyChanges { pet.x: 20 }
         }
         transitions: Transition {
             NumberAnimation { properties: "x"; duration: 200 }
diff --git a/examples/quickcontrols2/contactlist/ContactDelegate.ui.qml b/examples/quickcontrols2/contactlist/ContactDelegate.ui.qml
index dde9a4f425..a1abfe1060 100644
--- a/examples/quickcontrols2/contactlist/ContactDelegate.ui.qml
+++ b/examples/quickcontrols2/contactlist/ContactDelegate.ui.qml
@@ -119,6 +119,8 @@ ItemDelegate {
             when: delegate.checked
 
             PropertyChanges {
+                // TODO: When Qt Design Studio supports generalized grouped properties, change to:
+                //       grid.visible: true
                 target: grid
                 visible: true
             }
diff --git a/examples/quickcontrols2/flatstyle/imports/Flat/Button.qml b/examples/quickcontrols2/flatstyle/imports/Flat/Button.qml
index f072038a1d..78d113c49a 100644
--- a/examples/quickcontrols2/flatstyle/imports/Flat/Button.qml
+++ b/examples/quickcontrols2/flatstyle/imports/Flat/Button.qml
@@ -77,16 +77,12 @@ T.Button {
             State {
                 name: "normal"
                 when: !control.down
-                PropertyChanges {
-                    target: buttonBackground
-                }
             },
             State {
                 name: "down"
                 when: control.down
                 PropertyChanges {
-                    target: buttonBackground
-                    border.color: Theme.mainColorDarker
+                    buttonBackground.border.color: Theme.mainColorDarker
                 }
             }
         ]
@@ -112,8 +108,7 @@ T.Button {
                 name: "down"
                 when: control.down
                 PropertyChanges {
-                    target: textItem
-                    color: Theme.mainColorDarker
+                    textItem.color: Theme.mainColorDarker
                 }
             }
         ]
diff --git a/examples/quickcontrols2/flatstyle/imports/Flat/CheckBox.qml b/examples/quickcontrols2/flatstyle/imports/Flat/CheckBox.qml
index 014160330e..45b0dc588e 100644
--- a/examples/quickcontrols2/flatstyle/imports/Flat/CheckBox.qml
+++ b/examples/quickcontrols2/flatstyle/imports/Flat/CheckBox.qml
@@ -93,8 +93,7 @@ T.CheckBox {
                 when: control.checked && !control.down
 
                 PropertyChanges {
-                    target: rectangle
-                    visible: true
+                    rectangle.visible: true
                 }
             },
             State {
@@ -102,13 +101,8 @@ T.CheckBox {
                 when: !control.checked && control.down
 
                 PropertyChanges {
-                    target: rectangle
-                    color: Theme.mainColorDarker
-                }
-
-                PropertyChanges {
-                    target: checkboxHandle
-                    border.color: Theme.mainColorDarker
+                    rectangle.color: Theme.mainColorDarker
+                    checkboxHandle.border.color: Theme.mainColorDarker
                 }
             },
             State {
@@ -117,8 +111,7 @@ T.CheckBox {
                 when: control.checked && control.down
 
                 PropertyChanges {
-                    target: rectangle
-                    visible: true
+                    rectangle.visible: true
                 }
             }
         ]
diff --git a/examples/quickcontrols2/flatstyle/imports/Flat/Switch.qml b/examples/quickcontrols2/flatstyle/imports/Flat/Switch.qml
index 1f3bd3251e..783fae3abc 100644
--- a/examples/quickcontrols2/flatstyle/imports/Flat/Switch.qml
+++ b/examples/quickcontrols2/flatstyle/imports/Flat/Switch.qml
@@ -97,14 +97,11 @@ T.Switch {
                 when: control.checked && !control.down
 
                 PropertyChanges {
-                    target: switchHandle
-                    color: Theme.mainColor
-                    border.color: Theme.mainColor
-                }
-
-                PropertyChanges {
-                    target: rectangle
-                    x: parent.width - width
+                    switchHandle {
+                        color: Theme.mainColor
+                        border.color: Theme.mainColor
+                    }
+                    rectangle.x: parent.width - width
 
                 }
             },
@@ -113,8 +110,7 @@ T.Switch {
                 when: !control.checked && control.down
 
                 PropertyChanges {
-                    target: rectangle
-                    color: Theme.light
+                    rectangle.color: Theme.light
                 }
 
             },
@@ -124,15 +120,14 @@ T.Switch {
                 when: control.checked && control.down
 
                 PropertyChanges {
-                    target: rectangle
-                    x: parent.width - width
-                    color: Theme.light
-                }
-
-                PropertyChanges {
-                    target: switchHandle
-                    color: Theme.mainColorDarker
-                    border.color: Theme.mainColorDarker
+                    rectangle {
+                        x: parent.width - width
+                        color: Theme.light
+                    }
+                    switchHandle {
+                        color: Theme.mainColorDarker
+                        border.color: Theme.mainColorDarker
+                    }
                 }
             }
         ]