Merge branch '4.7' of scm.dev.nokia.troll.no:qt/qt-qml into 4.7

30 files changed, 66 insertions, 325 deletions

diff --git a/examples/declarative/animations/color-animation.qml b/examples/declarative/animations/color-animation.qml
index 7171a69..6740522 100644
--- a/examples/declarative/animations/color-animation.qml
+++ b/examples/declarative/animations/color-animation.qml
@@ -10,7 +10,7 @@ Item {
         gradient: Gradient {
             GradientStop {
                 position: 0.0
-                color: SequentialAnimation {
+                SequentialAnimation on color {
                     repeat: true
                     ColorAnimation { from: "DeepSkyBlue"; to: "#0E1533"; duration: 5000 }
                     ColorAnimation { from: "#0E1533"; to: "DeepSkyBlue"; duration: 5000 }
@@ -18,7 +18,7 @@ Item {
             }
             GradientStop {
                 position: 1.0
-                color: SequentialAnimation {
+                SequentialAnimation on color {
                     repeat: true
                     ColorAnimation { from: "SkyBlue"; to: "#437284"; duration: 5000 }
                     ColorAnimation { from: "#437284"; to: "SkyBlue"; duration: 5000 }
@@ -31,7 +31,7 @@ Item {
     Item {
         width: parent.width; height: 2 * parent.height
         transformOrigin: Item.Center
-        rotation: NumberAnimation { from: 0; to: 360; duration: 10000; repeat: true }
+        NumberAnimation on rotation { from: 0; to: 360; duration: 10000; repeat: true }
         Image {
             source: "images/sun.png"; y: 10; anchors.horizontalCenter: parent.horizontalCenter
             transformOrigin: Item.Center; rotation: -3 * parent.rotation
@@ -44,7 +44,7 @@ Item {
             x: 0; y: parent.height/2; width: parent.width; height: parent.height/2
             source: "images/star.png"; angleDeviation: 360; velocity: 0
             velocityDeviation: 0; count: parent.width / 10; fadeInDuration: 2800
-            opacity: SequentialAnimation {
+            SequentialAnimation on opacity {
                 repeat: true
                 NumberAnimation { from: 0; to: 1; duration: 5000 }
                 NumberAnimation { from: 1; to: 0; duration: 5000 }
@@ -58,7 +58,7 @@ Item {
         gradient: Gradient {
             GradientStop {
                 position: 0.0
-                color: SequentialAnimation {
+                SequentialAnimation on color {
                     repeat: true
                     ColorAnimation { from: "ForestGreen"; to: "#001600"; duration: 5000 }
                     ColorAnimation { from: "#001600"; to: "ForestGreen"; duration: 5000 }
diff --git a/examples/declarative/animations/property-animation.qml b/examples/declarative/animations/property-animation.qml
index 537ee26..4428f34 100644
--- a/examples/declarative/animations/property-animation.qml
+++ b/examples/declarative/animations/property-animation.qml
@@ -42,7 +42,7 @@ Item {
 
         // Animate the y property. Setting repeat to true makes the
         // animation repeat indefinitely, otherwise it would only run once.
-        y: SequentialAnimation {
+        SequentialAnimation on y {
             repeat: true
 
             // Move from minHeight to maxHeight in 300ms, using the OutExpo easing function
diff --git a/examples/declarative/aspectratio/face_fit_animated.qml b/examples/declarative/aspectratio/face_fit_animated.qml
index 90ea516..79e99e9 100644
--- a/examples/declarative/aspectratio/face_fit_animated.qml
+++ b/examples/declarative/aspectratio/face_fit_animated.qml
@@ -18,7 +18,7 @@ Rectangle {
         source: "pics/face.png"
         x: (parent.width-width*scale)/2
         y: (parent.height-height*scale)/2
-        scale: SpringFollow {
+        SpringFollow on scale {
             source: Math.max(Math.min(face.parent.width/face.width*1.333,face.parent.height/face.height),
                         Math.min(face.parent.width/face.width,face.parent.height/face.height*1.333))
             spring: 1
diff --git a/examples/declarative/behaviours/behavior.qml b/examples/declarative/behaviours/behavior.qml
index 2732c0a..c84bf62 100644
--- a/examples/declarative/behaviours/behavior.qml
+++ b/examples/declarative/behaviours/behavior.qml
@@ -50,12 +50,12 @@ Rectangle {
             radius: 5
             border.width: 10; border.color: "white";
             x: 100-37; y: 100-25
-            x: Behavior { NumberAnimation { duration: 300 } }
-            y: Behavior { NumberAnimation { duration: 300 } }
+            Behavior on x { NumberAnimation { duration: 300 } }
+            Behavior on y { NumberAnimation { duration: 300 } }
             Text {
                 id: focusText
                 text: focusRect.text;
-                text: Behavior {
+                Behavior on text {
                     SequentialAnimation {
                         NumberAnimation { target: focusText; property: "opacity"; to: 0; duration: 150 }
                         PropertyAction {}
diff --git a/examples/declarative/behaviours/test.qml b/examples/declarative/behaviours/test.qml
deleted file mode 100644
index 8fffd59..0000000
--- a/examples/declarative/behaviours/test.qml
+++ /dev/null
@@ -1,102 +0,0 @@
-import Qt 4.6
-
-Rectangle {
-    color: "lightsteelblue"
-    width: 800
-    height: 600
-    id: page
-    MouseArea {
-        anchors.fill: parent
-        onClicked: { bluerect.parent = page; console.log(mouseX); bluerect.x = mouseX; }
-    }
-    MyRect {
-        color: "green"
-        x: 200
-        y: 200
-    }
-    MyRect {
-        color: "red"
-        x: 400
-        y: 200
-    }
-    MyRect {
-        color: "yellow"
-        x: 400
-        y: 400
-    }
-    MyRect {
-        color: "orange"
-        x: 400
-        y: 500
-    }
-    MyRect {
-        color: "pink"
-        x: 400
-        y: 0
-    }
-    MyRect {
-        color: "lightsteelblue"
-        x: 100
-        y: 500
-    }
-    MyRect {
-        color: "black"
-        x: 0
-        y: 200
-    }
-    MyRect {
-        color: "white"
-        x: 400
-        y: 0
-    }
-    Rectangle {
-        color: "blue"
-        x: 0
-        y: 0
-        width: 100
-        height: 100
-        id: bluerect
-        x: Behavior {
-            ParallelAnimation {
-                SequentialAnimation {
-                    NumberAnimation {
-                        target: bluerect
-                        property: "y"
-                        from: 0
-                        to: 10
-                        easing.type: "OutBounce"
-                        easing.amplitude: 30
-                        duration: 250
-                    }
-                    NumberAnimation {
-                        target: bluerect
-                        property: "y"
-                        from: 10
-                        to: 0
-                        easing.type: "OutBounce"
-                        easing.amplitude: 30
-                        duration: 250
-                    }
-                }
-                NumberAnimation { duration: 500 }
-            }
-        }
-        parent: Behavior {
-            SequentialAnimation {
-                NumberAnimation {
-                    target: bluerect
-                    property: "opacity"
-                    to: 0
-                    duration: 150
-                }
-                PropertyAction {}
-                NumberAnimation {
-                    target: bluerect
-                    property: "opacity"
-                    to: 1
-                    duration: 150
-                }
-            }
-        }
-    }
-}
diff --git a/examples/declarative/border-image/content/MyBorderImage.qml b/examples/declarative/border-image/content/MyBorderImage.qml
index ca886e9..5621e18 100644
--- a/examples/declarative/border-image/content/MyBorderImage.qml
+++ b/examples/declarative/border-image/content/MyBorderImage.qml
@@ -17,13 +17,13 @@ Item {
     BorderImage {
         id: image; x: container.width / 2 - width / 2; y: container.height / 2 - height / 2
 
-        width: SequentialAnimation {
+        SequentialAnimation on width {
             repeat: true
             NumberAnimation { from: container.minWidth; to: container.maxWidth; duration: 2000; easing.type: "InOutQuad"}
             NumberAnimation { from: container.maxWidth; to: container.minWidth; duration: 2000; easing.type: "InOutQuad" }
         }
 
-        height: SequentialAnimation {
+        SequentialAnimation on height {
             repeat: true
             NumberAnimation { from: container.minHeight; to: container.maxHeight; duration: 2000; easing.type: "InOutQuad"}
             NumberAnimation { from: container.maxHeight; to: container.minHeight; duration: 2000; easing.type: "InOutQuad" }
diff --git a/examples/declarative/clocks/content/Clock.qml b/examples/declarative/clocks/content/Clock.qml
index 0c6836f..75a1cf5 100644
--- a/examples/declarative/clocks/content/Clock.qml
+++ b/examples/declarative/clocks/content/Clock.qml
@@ -34,7 +34,7 @@ Item {
         transform: Rotation {
             id: hourRotation
             origin.x: 7.5; origin.y: 73; angle: 0
-            angle: SpringFollow {
+            SpringFollow on angle {
                 spring: 2; damping: 0.2; modulus: 360
                 source: (clock.hours * 30) + (clock.minutes * 0.5)
             }
@@ -48,7 +48,7 @@ Item {
         transform: Rotation {
             id: minuteRotation
             origin.x: 6.5; origin.y: 83; angle: 0
-            angle: SpringFollow {
+            SpringFollow on angle {
                 spring: 2; damping: 0.2; modulus: 360
                 source: clock.minutes * 6
             }
@@ -62,7 +62,7 @@ Item {
         transform: Rotation {
             id: secondRotation
             origin.x: 2.5; origin.y: 80; angle: 0
-            angle: SpringFollow {
+            SpringFollow on angle {
                 spring: 5; damping: 0.25; modulus: 360
                 source: clock.seconds * 6
             }
diff --git a/examples/declarative/connections/connections.qml b/examples/declarative/connections/connections.qml
index 4692343..c35bda5 100644
--- a/examples/declarative/connections/connections.qml
+++ b/examples/declarative/connections/connections.qml
@@ -10,7 +10,7 @@ Rectangle {
     Image {
         id: image; source: "content/bg1.jpg"; anchors.centerIn: parent; transformOrigin: Item.Center
 	rotation: window.angle
-        rotation: Behavior { NumberAnimation { easing.type: "OutCubic"; duration: 300 } }
+        Behavior on rotation { NumberAnimation { easing.type: "OutCubic"; duration: 300 } }
     }
 
     Button {
diff --git a/examples/declarative/dial/content/Dial.qml b/examples/declarative/dial/content/Dial.qml
index 6fd0f39..ad4717a 100644
--- a/examples/declarative/dial/content/Dial.qml
+++ b/examples/declarative/dial/content/Dial.qml
@@ -26,7 +26,7 @@ Item {
             id: needleRotation
             origin.x: 7; origin.y: 65
             angle: -130
-            angle: SpringFollow {
+            SpringFollow on angle {
                 spring: 1.4
                 damping: .15
                 source: Math.min(Math.max(-130, root.value*2.6 - 130), 133)
diff --git a/examples/declarative/effects/effects.qml b/examples/declarative/effects/effects.qml
index 0674433..997d7de 100644
--- a/examples/declarative/effects/effects.qml
+++ b/examples/declarative/effects/effects.qml
@@ -11,7 +11,7 @@ Rectangle {
         source: "pic.png"
 
         effect: Blur {
-            blurRadius: NumberAnimation {
+            NumberAnimation on blurRadius {
                 id: blurEffect
                 running: false
                 from: 0; to: 10
@@ -33,7 +33,7 @@ Rectangle {
         effect: DropShadow {
             blurRadius: 3
             offset.x: 3
-            offset.y: NumberAnimation { id: dropShadowEffect; from: 0; to: 10; duration: 1000; running: false; repeat: true; }
+            NumberAnimation on offset.y { id: dropShadowEffect; from: 0; to: 10; duration: 1000; running: false; repeat: true; }
         }
 
         MouseArea { anchors.fill: parent; onClicked: dropShadowEffect.running = !dropShadowEffect.running }
diff --git a/examples/declarative/fillmode/fillmode.qml b/examples/declarative/fillmode/fillmode.qml
index ec3717f..ab0f81c 100644
--- a/examples/declarative/fillmode/fillmode.qml
+++ b/examples/declarative/fillmode/fillmode.qml
@@ -4,7 +4,7 @@ Image {
     width: 400
     height: 250
     source: "face.png"
-    fillMode: SequentialAnimation {
+    SequentialAnimation on fillMode {
         repeat: true
         PropertyAction { value: Image.Stretch }
         PropertyAction { target: label; property: "text"; value: "Stretch" }
diff --git a/examples/declarative/fonts/banner.qml b/examples/declarative/fonts/banner.qml
index 00b8660..7989f80 100644
--- a/examples/declarative/fonts/banner.qml
+++ b/examples/declarative/fonts/banner.qml
@@ -10,7 +10,7 @@ Rectangle {
 
     Row {
         y: -screen.height / 4.5
-        x: NumberAnimation { from: 0; to: -text.width; duration: 6000; repeat: true }
+        NumberAnimation on x { from: 0; to: -text.width; duration: 6000; repeat: true }
         Text { id: text; font.pixelSize: screen.pixelSize; color: screen.textColor; text: screen.text }
         Text { font.pixelSize: screen.pixelSize; color: screen.textColor; text: screen.text }
         Text { font.pixelSize: screen.pixelSize; color: screen.textColor; text: screen.text }
diff --git a/examples/declarative/fonts/hello.qml b/examples/declarative/fonts/hello.qml
index fcc9580..334409e 100644
--- a/examples/declarative/fonts/hello.qml
+++ b/examples/declarative/fonts/hello.qml
@@ -9,7 +9,7 @@ Rectangle {
             id: text; color: "white"; anchors.centerIn: parent
             text: "Hello world!"; font.pixelSize: 60
 
-            font.letterSpacing: SequentialAnimation {
+            SequentialAnimation on font.letterSpacing {
                 repeat: true;
                 NumberAnimation { from: 100; to: 300; easing.type: "InQuad"; duration: 3000 }
                 ScriptAction { script: {
@@ -17,7 +17,7 @@ Rectangle {
                     container.x = (screen.width / 4) + (Math.random() * screen.width / 2)
                 } }
             }
-            opacity: SequentialAnimation {
+            SequentialAnimation on opacity {
                 repeat: true;
                 NumberAnimation { from: 1; to: 0; duration: 2600 }
                 PauseAnimation { duration: 400 }
diff --git a/examples/declarative/layouts/positioners.qml b/examples/declarative/layouts/positioners.qml
index 7146702..bce53bd 100644
--- a/examples/declarative/layouts/positioners.qml
+++ b/examples/declarative/layouts/positioners.qml
@@ -21,11 +21,11 @@ Rectangle {
         }
         Rectangle { color: "red"; width: 100; height: 50; border.color: "black"; radius: 15 }
         Rectangle { id: blueV1; color: "lightsteelblue"; width: 100; height: 50; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "green"; width: 100; height: 50; border.color: "black"; radius: 15 }
         Rectangle { id: blueV2; color: "lightsteelblue"; width: 100; height: 50; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "orange"; width: 100; height: 50; border.color: "black"; radius: 15 }
     }
@@ -45,11 +45,11 @@ Rectangle {
         }
         Rectangle { color: "red"; width: 50; height: 100; border.color: "black"; radius: 15 }
         Rectangle { id: blueH1; color: "lightsteelblue"; width: 50; height: 100; border.color: "black"; radius: 15
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "green"; width: 50; height: 100; border.color: "black"; radius: 15 }
         Rectangle { id: blueH2; color: "lightsteelblue"; width: 50; height: 100; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "orange"; width: 50; height: 100; border.color: "black"; radius: 15 }
     }
@@ -113,15 +113,15 @@ Rectangle {
 
         Rectangle { color: "red"; width: 50; height: 50; border.color: "black"; radius: 15 }
         Rectangle { id: blueG1; color: "lightsteelblue"; width: 50; height: 50; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "green"; width: 50; height: 50; border.color: "black"; radius: 15 }
         Rectangle { id: blueG2; color: "lightsteelblue"; width: 50; height: 50; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "orange"; width: 50; height: 50; border.color: "black"; radius: 15 }
         Rectangle { id: blueG3; color: "lightsteelblue"; width: 50; height: 50; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "red"; width: 50; height: 50; border.color: "black"; radius: 15 }
         Rectangle { color: "green"; width: 50; height: 50; border.color: "black"; radius: 15 }
@@ -147,15 +147,15 @@ Rectangle {
         }
         Rectangle { color: "red"; width: 50; height: 50; border.color: "black"; radius: 15 }
         Rectangle { id: blueF1; color: "lightsteelblue"; width: 60; height: 50; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "green"; width: 30; height: 50; border.color: "black"; radius: 15 }
         Rectangle { id: blueF2; color: "lightsteelblue"; width: 60; height: 50; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "orange"; width: 50; height: 50; border.color: "black"; radius: 15 }
         Rectangle { id: blueF3; color: "lightsteelblue"; width: 40; height: 50; border.color: "black"; radius: 15 
-            opacity: Behavior{NumberAnimation{}}
+            Behavior on opacity {NumberAnimation{}}
         }
         Rectangle { color: "red"; width: 80; height: 50; border.color: "black"; radius: 15 }
     }
diff --git a/examples/declarative/listview/content/ClickAutoRepeating.qml b/examples/declarative/listview/content/ClickAutoRepeating.qml
index 0850f4e..5240e65 100644
--- a/examples/declarative/listview/content/ClickAutoRepeating.qml
+++ b/examples/declarative/listview/content/ClickAutoRepeating.qml
@@ -10,7 +10,7 @@ Item {
     signal released
     signal clicked
 
-    isPressed: SequentialAnimation {
+    SequentialAnimation on isPressed {
         running: false
         id: autoRepeat
         PropertyAction { target: page; property: "isPressed"; value: true }
diff --git a/examples/declarative/listview/highlight.qml b/examples/declarative/listview/highlight.qml
index be1f62d..5e4911d 100644
--- a/examples/declarative/listview/highlight.qml
+++ b/examples/declarative/listview/highlight.qml
@@ -44,7 +44,7 @@ Rectangle {
         id: petHighlight
         Rectangle {
             width: 200; height: 50; color: "#FFFF88"
-            y: SpringFollow { source: list1.currentItem.y; spring: 3; damping: 0.1 }
+            SpringFollow on y { source: list1.currentItem.y; spring: 3; damping: 0.1 }
         }
     }
     ListView {
diff --git a/examples/declarative/package/Delegate.qml b/examples/declarative/package/Delegate.qml
index 4109633..62198d0 100644
--- a/examples/declarative/package/Delegate.qml
+++ b/examples/declarative/package/Delegate.qml
@@ -2,24 +2,26 @@ import Qt 4.6
 
 //![0]
 Package {
-    Text { id: listDelegate; width: 200; height: 25; text: "Empty"; Package.name: "list" }
-    Text { id: gridDelegate; width: 100; height: 50; text: "Empty"; Package.name: "grid" }
+    Text { id: listDelegate; width: 200; height: 25; text: 'Empty'; Package.name: 'list' }
+    Text { id: gridDelegate; width: 100; height: 50; text: 'Empty'; Package.name: 'grid' }
 
     Rectangle {
         id: wrapper
         width: 200; height: 25
-        color: "lightsteelblue"
+        color: 'lightsteelblue'
+
         Text { text: display; anchors.centerIn: parent }
         MouseRegion {
             anchors.fill: parent
             onClicked: {
-                if (wrapper.state == "inList")
-                    wrapper.state = "inGrid";
+                if (wrapper.state == 'inList')
+                    wrapper.state = 'inGrid';
                 else
-                    wrapper.state = "inList";
+                    wrapper.state = 'inList';
             }
         }
-        state: "inList"
+
+        state: 'inList'
         states: [
             State {
                 name: 'inList'
@@ -27,15 +29,17 @@ Package {
             },
             State {
                 name: 'inGrid'
-                ParentChange { target: wrapper; parent: gridDelegate }
-                PropertyChanges { target: wrapper; x: 0; y: 0; width: gridDelegate.width; height: gridDelegate.height }
+                ParentChange {
+                    target: wrapper; parent: gridDelegate
+                    x: 0; y: 0; width: gridDelegate.width; height: gridDelegate.height
+                }
             }
         ]
+
         transitions: [
             Transition {
-                SequentialAnimation {
-                    ParentAction { target: wrapper }
-                    NumberAnimation { targets: wrapper; properties: 'x,y,width,height'; duration: 300 }
+                ParentAnimation {
+                    NumberAnimation { properties: 'x,y,width,height'; duration: 300 }
                 }
             }
         ]
diff --git a/examples/declarative/parallax/qml/Smiley.qml b/examples/declarative/parallax/qml/Smiley.qml
index 81eadda..4442d5e 100644
--- a/examples/declarative/parallax/qml/Smiley.qml
+++ b/examples/declarative/parallax/qml/Smiley.qml
@@ -24,7 +24,7 @@ Item {
 
         // Animate the y property. Setting repeat to true makes the
         // animation repeat indefinitely, otherwise it would only run once.
-        y: SequentialAnimation {
+        SequentialAnimation  on y {
             repeat: true
 
             // Move from minHeight to maxHeight in 300ms, using the OutExpo easing function
diff --git a/examples/declarative/progressbar/content/ProgressBar.qml b/examples/declarative/progressbar/content/ProgressBar.qml
index bfc801c..65c80b2 100644
--- a/examples/declarative/progressbar/content/ProgressBar.qml
+++ b/examples/declarative/progressbar/content/ProgressBar.qml
@@ -21,7 +21,7 @@ Item {
         id: highlight; radius: 1
         anchors.left: parent.left; anchors.top: parent.top; anchors.bottom: parent.bottom
         anchors.leftMargin: 3; anchors.topMargin: 3; anchors.bottomMargin: 3
-        width: EaseFollow { source: highlight.widthDest; velocity: 1200 }
+        EaseFollow on width { source: highlight.widthDest; velocity: 1200 }
         gradient: Gradient {
             GradientStop { id: g1; position: 0.0 }
             GradientStop { id: g2; position: 1.0 }
diff --git a/examples/declarative/progressbar/progressbars.qml b/examples/declarative/progressbar/progressbars.qml
index 6530c3d..a66d544 100644
--- a/examples/declarative/progressbar/progressbars.qml
+++ b/examples/declarative/progressbar/progressbars.qml
@@ -14,9 +14,9 @@ Rectangle {
                 ProgressBar {
                     property int r: Math.floor(Math.random() * 5000 + 1000)
                     width: main.width - 20
-                    value: NumberAnimation { duration: r; from: 0; to: 100; repeat: true }
-                    color: ColorAnimation { duration: r; from: "lightsteelblue"; to: "thistle"; repeat: true }
-                    secondColor: ColorAnimation { duration: r; from: "steelblue"; to: "#CD96CD"; repeat: true }
+                    NumberAnimation on value { duration: r; from: 0; to: 100; repeat: true }
+                    ColorAnimation on color { duration: r; from: "lightsteelblue"; to: "thistle"; repeat: true }
+                    ColorAnimation on secondColor { duration: r; from: "steelblue"; to: "#CD96CD"; repeat: true }
                 }
             }
         }
diff --git a/examples/declarative/snow/ImageBatch.qml b/examples/declarative/snow/ImageBatch.qml
deleted file mode 100644
index c2a2674..0000000
--- a/examples/declarative/snow/ImageBatch.qml
+++ /dev/null
@@ -1,72 +0,0 @@
-import Qt 4.6
-
-GridView {
-    id: grid
-    property int offset: 0
-    property var ref
-    property bool isSelected: ref.selectedItemColumn >= offset && ref.selectedItemColumn < offset + 5
-
-    currentIndex: (ref.selectedItemColumn  - offset) + ref.selectedItemRow * 5
-
-    property int imageWidth: ref.imageWidth
-    property int imageHeight: ref.imageHeight
-
-    width: 5 * imageWidth
-    height: 4 * imageHeight
-    cellWidth: imageWidth
-    cellHeight: imageHeight
-
-    states: State {
-        name: "selected"; when: grid.isSelected
-        PropertyChanges { target: grid; z: 150 }
-    }
-    transitions: Transition {
-        SequentialAnimation {
-            PauseAnimation { duration: 150 }
-            PropertyAction { properties: "z" }
-        }
-    }
-    model: XmlListModel {
-        property string tags : ""
-        source: "http://api.flickr.com/services/feeds/photos_public.gne?"+(tags ? "tags="+tags+"&" : "")+"format=rss2"
-        query: "/rss/channel/item"
-        namespaceDeclarations: "declare namespace media=\"http://search.yahoo.com/mrss/\";"
-
-        XmlRole { name: "url"; query: "media:content/@url/string()" }
-    }
-
-    delegate: Item {
-        id: root
-        property bool isSelected: GridView.isCurrentItem && grid.isSelected
-        transformOrigin: Item.Center
-        width: grid.imageWidth; height: grid.imageHeight;
-
-        Image { id: flickrImage; source: url; fillMode: Image.PreserveAspectFit; smooth: true; anchors.fill: parent;
-                opacity: (status == Image.Ready)?1:0; opacity: Behavior { NumberAnimation { } } }
-        Loading { anchors.centerIn: parent; visible: flickrImage.status!=1 }
-
-        states: State {
-            name: "selected"
-            when: root.isSelected
-            PropertyChanges { target: root; scale: 3; z: 100 }
-        }
-        transitions: [
-            Transition {
-                to: "selected"
-                SequentialAnimation {
-                    PauseAnimation { duration: 150 }
-                    PropertyAction { properties: "z" }
-                    NumberAnimation { properties: "scale"; duration: 150; }
-                }
-            },
-            Transition {
-                from: "selected"
-                SequentialAnimation {
-                    NumberAnimation { properties: "scale"; duration: 150 }
-                    PropertyAction { properties: "z" }
-                }
-            }
-        ]
-    }
-}
-
diff --git a/examples/declarative/snow/Loading.qml b/examples/declarative/snow/Loading.qml
deleted file mode 100644
index 238d9c7..0000000
--- a/examples/declarative/snow/Loading.qml
+++ /dev/null
@@ -1,8 +0,0 @@
-import Qt 4.6
-
-Image {
-    id: loading; source: "pics/loading.png"; transformOrigin: Item.Center
-    rotation: NumberAnimation {
-        id: rotationAnimation; from: 0; to: 360; running: loading.visible == true; repeat: true; duration: 900
-    }
-}
diff --git a/examples/declarative/snow/create.js b/examples/declarative/snow/create.js
deleted file mode 100644
index 2bdae4a..0000000
--- a/examples/declarative/snow/create.js
+++ /dev/null
@@ -1,12 +0,0 @@
-var myComponent = null;
-
-function createNewBlock() {
-    if (myComponent == null)
-        myComponent = createComponent("ImageBatch.qml");
-
-    var obj = myComponent.createObject();
-    obj.parent = layout;
-    obj.offset = maximumColumn + 1;
-    obj.ref = imagePanel;
-    maximumColumn += 5;
-}
diff --git a/examples/declarative/snow/pics/loading.png b/examples/declarative/snow/pics/loading.png
deleted file mode 100644
index 0296cfe..0000000
--- a/examples/declarative/snow/pics/loading.png
+++ /dev/null
diff --git a/examples/declarative/snow/snow.qml b/examples/declarative/snow/snow.qml
deleted file mode 100644
index 39c9c43..0000000
--- a/examples/declarative/snow/snow.qml
+++ /dev/null
@@ -1,69 +0,0 @@
-import Qt 4.6
-
-Rectangle {
-    id: imagePanel
-    width: 1024
-    height: 768
-    color: "black"
-
-    property int maximumColumn: 4
-    property int selectedItemRow: 0
-    property int selectedItemColumn: 0
-
-    Script { source: "create.js" }
-
-    onSelectedItemColumnChanged: if (selectedItemColumn == maximumColumn) createNewBlock();
-
-    property int imageWidth: 200
-    property int imageHeight: 200
-
-    property int selectedX: selectedItemColumn * imageWidth
-    property int selectedY: selectedItemRow * imageHeight
-
-    Item {
-        anchors.centerIn: parent
-        Row {
-            id: layout
-            property real targetX: -(selectedX + imageWidth / 2)
-
-            property real targetDeform: 0
-            property bool slowDeform: true
-
-            property real deform: 0
-            deform: SpringFollow {
-                id: deformFollow; source: layout.targetDeform; velocity: layout.slowDeform?0.1:2
-                onSyncChanged: if(inSync) { layout.slowDeform = true; layout.targetDeform = 0; }
-            }
-
-            ImageBatch { offset: 0; ref: imagePanel }
-
-            x: SpringFollow { source: layout.targetX; velocity: 1000 }
-            y: SpringFollow { source: -(selectedY + imageHeight / 2); velocity: 500 }
-        }
-
-        transform: Rotation {
-            axis.y: 1; axis.z: 0
-            angle: layout.deform * -100
-        }
-    }
-
-    Script {
-        function left() {
-            if (selectedItemColumn <= 0) return;
-            selectedItemColumn -= 1;
-            layout.slowDeform = false;
-            layout.targetDeform = Math.max(Math.min(layout.deform - 0.1, -0.1), -0.4);
-        }
-        function right() {
-            selectedItemColumn += 1;
-            layout.slowDeform = false;
-            layout.targetDeform = Math.min(Math.max(layout.deform + 0.1, 0.1), 0.4);
-        }
-    }
-
-    focus: true
-    Keys.onLeftPressed: "left()"
-    Keys.onRightPressed: "right()"
-    Keys.onUpPressed: "if (selectedItemRow > 0) selectedItemRow = selectedItemRow - 1"
-    Keys.onDownPressed: "if (selectedItemRow < 3) selectedItemRow = selectedItemRow + 1"
-}
diff --git a/examples/declarative/tutorials/samegame/samegame3/Dialog.qml b/examples/declarative/tutorials/samegame/samegame3/Dialog.qml
index 9d35832..36178ec 100644
--- a/examples/declarative/tutorials/samegame/samegame3/Dialog.qml
+++ b/examples/declarative/tutorials/samegame/samegame3/Dialog.qml
@@ -14,7 +14,7 @@ Rectangle {
     signal closed();
     color: "white"; border.width: 1; width: myText.width + 20; height: 60;
     opacity: 0
-    opacity: Behavior { 
+    Behavior on opacity { 
         NumberAnimation { duration: 1000 }
     }
     Text { id: myText; anchors.centerIn: parent; text: "Hello World!" }
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/BoomBlock.qml b/examples/declarative/tutorials/samegame/samegame4/content/BoomBlock.qml
index 85c2c93..9ef455a 100644
--- a/examples/declarative/tutorials/samegame/samegame4/content/BoomBlock.qml
+++ b/examples/declarative/tutorials/samegame/samegame4/content/BoomBlock.qml
@@ -8,8 +8,8 @@ Item { id:block
     property int targetX: 0
     property int targetY: 0
 
-    x: SpringFollow { enabled: spawned; source: targetX; spring: 2; damping: 0.2 }
-    y: SpringFollow { source: targetY; spring: 2; damping: 0.2 }
+    SpringFollow on x { enabled: spawned; source: targetX; spring: 2; damping: 0.2 }
+    SpringFollow on y { source: targetY; spring: 2; damping: 0.2 }
     //![1]
 
     //![2]
@@ -24,7 +24,7 @@ Item { id:block
             }
         }
         opacity: 0
-        opacity: Behavior { NumberAnimation { properties:"opacity"; duration: 200 } }
+        Behavior on opacity { NumberAnimation { properties:"opacity"; duration: 200 } }
         anchors.fill: parent
     }
     //![2]
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml b/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml
index ed9fd32..831c03b 100644
--- a/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml
+++ b/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml
@@ -13,7 +13,7 @@ Rectangle {
     signal closed();
     color: "white"; border.width: 1; width: myText.width + 20; height: 60;
     opacity: 0
-    opacity: Behavior { 
+    Behavior on opacity { 
         NumberAnimation { duration: 1000 }
     }
     Text { id: myText; anchors.centerIn: parent; text: "Hello World!" }
diff --git a/examples/declarative/tvtennis/tvtennis.qml b/examples/declarative/tvtennis/tvtennis.qml
index 4bd5319..1585c7b 100644
--- a/examples/declarative/tvtennis/tvtennis.qml
+++ b/examples/declarative/tvtennis/tvtennis.qml
@@ -16,7 +16,7 @@ Rectangle {
         x: 20; width: 20; height: 20; z: 1
 
         // Move the ball to the right and back to the left repeatedly
-        x: SequentialAnimation {
+        SequentialAnimation on x {
             repeat: true
             NumberAnimation { to: page.width - 40; duration: 2000 }
             ScriptAction { script: Qt.playSound('paddle.wav') }
@@ -27,7 +27,7 @@ Rectangle {
         }
 
         // Make y follow the target y coordinate, with a velocity of 200
-        y: SpringFollow { source: ball.targetY; velocity: 200 }
+        SpringFollow on y { source: ball.targetY; velocity: 200 }
 
         // Detect the ball hitting the top or bottom of the view and bounce it
         onYChanged: {
@@ -47,7 +47,7 @@ Rectangle {
         id: leftBat
         color: "Lime"
         x: 2; width: 20; height: 90
-        y: SpringFollow {
+        SpringFollow on y {
             source: ball.y - 45; velocity: 300
             enabled: ball.direction == 'left'
         }
@@ -56,7 +56,7 @@ Rectangle {
         id: rightBat
         color: "Lime"
         x: page.width - 22; width: 20; height: 90
-        y: SpringFollow {
+        SpringFollow on y {
             source: ball.y-45; velocity: 300
             enabled: ball.direction == 'right'
         }
diff --git a/examples/declarative/velocity/Day.qml b/examples/declarative/velocity/Day.qml
index c39f99b..7424f60 100644
--- a/examples/declarative/velocity/Day.qml
+++ b/examples/declarative/velocity/Day.qml
@@ -24,7 +24,7 @@ Rectangle {
             id: stickyPage
             x: Math.random() * 200 + 100
             y: Math.random() * 300 + 50
-            rotation: SpringFollow {
+            SpringFollow on rotation {
                 source: -flickable.horizontalVelocity / 100
                 spring: 2.0; damping: 0.1
             }