Converted connections, listview and mouse.

3 files changed, 180 insertions, 114 deletions

diff --git a/examples/declarative/connections/connections.qml b/examples/declarative/connections/connections.qml
index 45c0e99..e66875a 100644
--- a/examples/declarative/connections/connections.qml
+++ b/examples/declarative/connections/connections.qml
@@ -1,9 +1,29 @@
-<Rect id="rect" color="blue" width="40" height="30">
-    <Rect id="dot" color="red" width="3" height="3" x="{rect.width/2}" y="{rect.height/2}"/>
-    <MouseRegion id="mr" anchors.fill="{rect}"/>
-    <Connection sender="{mr}" signal="clicked(mouse)">
-        color="green";
-        dot.x = mouse.x-1;
-        dot.y = mouse.y-1;
-    </Connection>
-</Rect>
+Rect {
+    id: rect
+    color: "blue"
+    width: 40
+    height: 30
+    Rect {
+        id: dot
+        color: "red"
+        width: 3
+        height: 3
+        x: rect.width/2
+        y: rect.height/2
+    }
+    MouseRegion {
+        id: mr
+        anchors.fill: rect
+    }
+    Connection {
+        sender: mr
+        signal: "clicked(mouse)"
+        script: { 
+        
+                color="green";
+                dot.x = mouse.x-1;
+                dot.y = mouse.y-1;
+            
+        }
+    }
+}
diff --git a/examples/declarative/listview/listview.qml b/examples/declarative/listview/listview.qml
index 6cacdd1..b71ed4e 100644
--- a/examples/declarative/listview/listview.qml
+++ b/examples/declarative/listview/listview.qml
@@ -1,81 +1,103 @@
-<Rect width="600" height="300" color="white">
-
-    <!--
-    MyPets model is defined in dummydata/MyPetsModel.qml
-    The viewer automatically loads files in dummydata/* to assist
-    development without a real data source.
-    This one contains my pets.
-    -->
-
-    <!--
-    Define a delegate component.  A component will be
-    instantiated for each visible item in the list.
-    -->
-    <Component id="PetDelegate">
-        <Item id="Wrapper" width="200" height="50">
-            <VerticalLayout>
-                <Text text="{'Name: ' + name}"/>
-                <Text text="{'Type: ' + type}"/>
-                <Text text="{'Age: ' + age}"/>
-            </VerticalLayout>
-        </Item>
-    </Component>
-
-    <!--
-    Define a highlight component.  Just one of these will be instantiated
-    by each ListView and placed behind the current item.
-    -->
-    <Component id="PetHighlight">
-        <Rect color="#FFFF88"/>
-    </Component>
-
-    <!--
-    Show the model in three lists, with different currentItemPositioning.
-    currentItemPositioning determines how the list behaves when the
-    current item changes.  Note that the second and third ListView
-    set their currentIndex to be the same as the first, and that
-    the first ListView is given keyboard focus.
-
-    The default mode, Free, allows the currentItem to move freely
-    within the visible area.  If it would move outside the visible
-    area, the view is scrolled to keep it visible.
-
-    Snap currentItemPositioning attempts to keep the current item
-    aligned with the snapPosition by scrolling the view, however the
-    items will not scroll beyond the beginning or end of the view.
-
-    SnapAuto currentItemPositioning always keeps the current item on
-    the snapPosition by scrolling the view.  It also automatically
-    sets the current item as is scrolled with the mouse.  Note
-    that the first ListView sets its currentIndex to be equal to
-    the third ListView's currentIndex.  By flicking List3 with
-    the mouse, the current index of List1 will be changed.
-    -->
-
-    <ListView id="List1" width="200" height="{parent.height}" model="{MyPetsModel}"
-              delegate="{PetDelegate}" highlight="{PetHighlight}"
-              currentIndex="{List3.currentIndex}" focus="true"/>
-
-    <ListView id="List2" x="200" width="200" height="{parent.height}" model="{MyPetsModel}"
-              delegate="{PetDelegate}" highlight="{PetHighlight}"
-              currentItemPositioning="Snap" snapPosition="125"
-              currentIndex="{List1.currentIndex}"/>
-
-    <ListView id="List3" x="400" width="200" height="{parent.height}" model="{MyPetsModel}"
-              delegate="{PetDelegate}"
-              currentItemPositioning="SnapAuto" snapPosition="125"
-              currentIndex="{List1.currentIndex}">
-        <children>
-            <!--
-            Position a static highlight rather than a normal highlight so that
-            when the view is flicked, the highlight does not move.
-            By positioning the highlight at the same position as the snapPosition
-            the item under the highlight will always be the current item.
-            Note that we specify the 'children' property.  This is because
-            the default property of a ListView is 'delegate'.
-            -->
-            <Rect y="125" width="200" height="50" color="#FFFF88" z="-1"/>
-        </children>
-    </ListView>
-
-</Rect>
+Rect {
+    width: 600
+    height: 300
+    color: "white"
+    // MyPets model is defined in dummydata/MyPetsModel.qml
+    // The viewer automatically loads files in dummydata/* to assist
+    // development without a real data source.
+    // This one contains my pets.
+    // Define a delegate component.  A component will be
+    // instantiated for each visible item in the list.
+    Component {
+        id: PetDelegate
+        Item {
+            id: Wrapper
+            width: 200
+            height: 50
+            VerticalLayout {
+                Text {
+                    text: 'Name: ' + name
+                }
+                Text {
+                    text: 'Type: ' + type
+                }
+                Text {
+                    text: 'Age: ' + age
+                }
+            }
+        }
+    }
+    // Define a highlight component.  Just one of these will be instantiated
+    // by each ListView and placed behind the current item.
+    Component {
+        id: PetHighlight
+        Rect {
+            color: "#FFFF88"
+        }
+    }
+    // Show the model in three lists, with different currentItemPositioning.
+    // currentItemPositioning determines how the list behaves when the
+    // current item changes.  Note that the second and third ListView
+    // set their currentIndex to be the same as the first, and that
+    // the first ListView is given keyboard focus.
+    // The default mode, Free, allows the currentItem to move freely
+    // within the visible area.  If it would move outside the visible
+    // area, the view is scrolled to keep it visible.
+    // Snap currentItemPositioning attempts to keep the current item
+    // aligned with the snapPosition by scrolling the view, however the
+    // items will not scroll beyond the beginning or end of the view.
+    // SnapAuto currentItemPositioning always keeps the current item on
+    // the snapPosition by scrolling the view.  It also automatically
+    // sets the current item as is scrolled with the mouse.  Note
+    // that the first ListView sets its currentIndex to be equal to
+    // the third ListView's currentIndex.  By flicking List3 with
+    // the mouse, the current index of List1 will be changed.
+    ListView {
+        id: List1
+        width: 200
+        height: parent.height
+        model: MyPetsModel
+        delegate: PetDelegate
+        highlight: PetHighlight
+        currentIndex: List3.currentIndex
+        focus: true
+    }
+    ListView {
+        id: List2
+        x: 200
+        width: 200
+        height: parent.height
+        model: MyPetsModel
+        delegate: PetDelegate
+        highlight: PetHighlight
+        currentItemPositioning: "Snap"
+        snapPosition: 125
+        currentIndex: List1.currentIndex
+    }
+    ListView {
+        id: List3
+        x: 400
+        width: 200
+        height: parent.height
+        model: MyPetsModel
+        delegate: PetDelegate
+        currentItemPositioning: "SnapAuto"
+        snapPosition: 125
+        currentIndex: List1.currentIndex
+        children: [
+            // Position a static highlight rather than a normal highlight so that
+            // when the view is flicked, the highlight does not move.
+            // By positioning the highlight at the same position as the snapPosition
+            // the item under the highlight will always be the current item.
+            // Note that we specify the 'children' property.  This is because
+            // the default property of a ListView is 'delegate'.
+            Rect {
+                y: 125
+                width: 200
+                height: 50
+                color: "#FFFF88"
+                z: -1
+            }
+        ]
+    }
+}
diff --git a/examples/declarative/mouseregion/mouse.qml b/examples/declarative/mouseregion/mouse.qml
index 9581da2..070543c 100644
--- a/examples/declarative/mouseregion/mouse.qml
+++ b/examples/declarative/mouseregion/mouse.qml
@@ -1,24 +1,48 @@
-<Rect color="white" width="200" height="200">
-    <Rect width="50" height="50" color="red">
-        <Text text="Click" anchors.centeredIn="{parent}"/>
-        <MouseRegion onPressed="print('press (x: ' + mouse.x + ' y: ' + mouse.y + ')')"
-                     onReleased="print('release (x: ' + mouse.x + ' y: ' + mouse.y + ' isClick: ' + mouse.isClick + ' wasHeld: ' + mouse.wasHeld + ')')"
-                     onClicked="print('click (x: ' + mouse.x + ' y: ' + mouse.y + ' wasHeld: ' + mouse.wasHeld + ')')"
-                     onDoubleClicked="print('double click (x: ' + mouse.x + ' y: ' + mouse.y + ')')"
-                     onPressAndHold="print('press and hold')"
-                     onExitedWhilePressed="print('exiting while pressed')"
-                     onReenteredWhilePressed="print('reentering while pressed')" anchors.fill="{parent}"/>
-    </Rect>
-    <Rect y="100" width="50" height="50" color="blue">
-        <Text text="Drag" anchors.centeredIn="{parent}"/>
-        <MouseRegion drag.target="{parent}"
-                     drag.axis="x" drag.xmin="0" drag.xmax="150"
-                     onPressed="print('press')"
-                     onReleased="print('release (isClick: ' + mouse.isClick + ') (wasHeld: ' + mouse.wasHeld + ')')"
-                     onClicked="print('click' + '(wasHeld: ' + mouse.wasHeld + ')')"
-                     onDoubleClicked="print('double click')"
-                     onPressAndHold="print('press and hold')"
-                     onExitedWhilePressed="print('exiting while pressed')"
-                     onReenteredWhilePressed="print('reentering while pressed')" anchors.fill="{parent}"/>
-    </Rect>
-</Rect>
+Rect {
+    color: "white"
+    width: 200
+    height: 200
+    Rect {
+        width: 50
+        height: 50
+        color: "red"
+        Text {
+            text: "Click"
+            anchors.centeredIn: parent
+        }
+        MouseRegion {
+            onPressed: { print('press (x: ' + mouse.x + ' y: ' + mouse.y + ')') }
+            onReleased: { print('release (x: ' + mouse.x + ' y: ' + mouse.y + ' isClick: ' + mouse.isClick + ' wasHeld: ' + mouse.wasHeld + ')') }
+            onClicked: { print('click (x: ' + mouse.x + ' y: ' + mouse.y + ' wasHeld: ' + mouse.wasHeld + ')') }
+            onDoubleClicked: { print('double click (x: ' + mouse.x + ' y: ' + mouse.y + ')') }
+            onPressAndHold: { print('press and hold') }
+            onExitedWhilePressed: { print('exiting while pressed') }
+            onReenteredWhilePressed: { print('reentering while pressed') }
+            anchors.fill: parent
+        }
+    }
+    Rect {
+        y: 100
+        width: 50
+        height: 50
+        color: "blue"
+        Text {
+            text: "Drag"
+            anchors.centeredIn: parent
+        }
+        MouseRegion {
+            drag.target: parent
+            drag.axis: "x"
+            drag.xmin: 0
+            drag.xmax: 150
+            onPressed: { print('press') }
+            onReleased: { print('release (isClick: ' + mouse.isClick + ') (wasHeld: ' + mouse.wasHeld + ')') }
+            onClicked: { print('click' + '(wasHeld: ' + mouse.wasHeld + ')') }
+            onDoubleClicked: { print('double click') }
+            onPressAndHold: { print('press and hold') }
+            onExitedWhilePressed: { print('exiting while pressed') }
+            onReenteredWhilePressed: { print('reentering while pressed') }
+            anchors.fill: parent
+        }
+    }
+}