Convert all examples and demos from XML format

11 files changed, 1062 insertions, 668 deletions

diff --git a/examples/declarative/contacts/dummydata/contactModel.qml b/examples/declarative/contacts/dummydata/contactModel.qml
index 341b7a6..48b2fd9 100644
--- a/examples/declarative/contacts/dummydata/contactModel.qml
+++ b/examples/declarative/contacts/dummydata/contactModel.qml
@@ -1,103 +1,103 @@
-<ListModel>
-    <Contact>
-        <firstName>Aaron</firstName>
-        <lastName>Kennedy</lastName>
-        <portrait>contact.png</portrait>
-        <emails>
-            <Email address="akennedy@trolltech.com"/>
-            <Email address="aaron.kennedy@trolltech.com"/>
-        </emails>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>1</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>2</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>3</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>4</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>5</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>6</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>7</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>8</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Contact</firstName>
-        <lastName>9</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Alan</firstName>
-        <lastName>Alpert</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Betty</firstName>
-        <lastName>Boo</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Foo</firstName>
-        <lastName>Bar</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Marius</firstName>
-        <lastName>Bugge Monsen</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Martin</firstName>
-        <lastName>Jones</lastName>
-        <portrait>contact.png</portrait>
-        <emails>
-            <Email address="mjones@trolltech.com"/>
-            <Email address="martin.jones@trolltech.com"/>
-        </emails>
-    </Contact>
-    <Contact>
-        <firstName>Michael</firstName>
-        <lastName>Brasser</lastName>
-        <portrait>contact.png</portrait>
-        <emails>
-            <Email address="mbrasser@trolltech.com"/>
-        </emails>
-    </Contact>
-    <Contact>
-        <firstName>Yann</firstName>
-        <lastName>Bodson</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-    <Contact>
-        <firstName>Yogi</firstName>
-        <lastName>Bear</lastName>
-        <portrait>contact.png</portrait>
-    </Contact>
-</ListModel>
+ListModel2 {
+    ListElement {
+        firstName: "Aaron"
+        lastName: "Kennedy"
+        portrait: "contact.png"
+        emails: [ 
+            ListElement { address: "akennedy@trolltech.com" },
+            ListElement { address: "aaron.kennedy@trolltech.com" }
+        ]
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 1
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 2
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 3
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 4
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 5
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 6
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 7
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 8
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "ListElement"
+        lastName: 9
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "Alan"
+        lastName: "Alpert"
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "Betty"
+        lastName: "Boo"
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "Foo"
+        lastName: "Bar"
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "Marius"
+        lastName: "Bugge Monsen"
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "Martin"
+        lastName: "Jones"
+        portrait: "contact.png"
+        emails: [
+            ListElement { address: "mjones@trolltech.com" },
+            ListElement { address: "martin.jones@trolltech.com" }
+        ]
+    }
+    ListElement {
+        firstName: "Michael"
+        lastName: "Brasser"
+        portrait: "contact.png"
+        emails: ListElement {
+            address: "mbrasser@trolltech.com"
+        }
+    }
+    ListElement {
+        firstName: "Yann"
+        lastName: "Bodson"
+        portrait: "contact.png"
+    }
+    ListElement {
+        firstName: "Yogi"
+        lastName: "Bear"
+        portrait: "contact.png"
+    }
+}
diff --git a/examples/declarative/easing/easing.qml b/examples/declarative/easing/easing.qml
index f95d8c6..32c1b9b 100644
--- a/examples/declarative/easing/easing.qml
+++ b/examples/declarative/easing/easing.qml
@@ -1,67 +1,92 @@
-<Rect id="Window" width="640" height="{Layout.height}" color="white">
+Rect {
+    id: Window
+    width: 640
+    height: Layout.height
+    color: "white"
 
-    <resources>
-        <ListModel id="EasingTypes">
-            <ListItem><type>easeLinear</type></ListItem>
-            <ListItem><type>easeInQuad</type></ListItem>
-            <ListItem><type>easeOutQuad</type></ListItem>
-            <ListItem><type>easeInOutQuad</type></ListItem>
-            <ListItem><type>easeOutInQuad</type></ListItem>
-            <ListItem><type>easeInCubic</type></ListItem>
-            <ListItem><type>easeOutCubic</type></ListItem>
-            <ListItem><type>easeInOutCubic</type></ListItem>
-            <ListItem><type>easeOutInCubic</type></ListItem>
-            <ListItem><type>easeInQuart</type></ListItem>
-            <ListItem><type>easeOutQuart</type></ListItem>
-            <ListItem><type>easeInOutQuart</type></ListItem>
-            <ListItem><type>easeOutInQuart</type></ListItem>
-            <ListItem><type>easeInQuint</type></ListItem>
-            <ListItem><type>easeOutQuint</type></ListItem>
-            <ListItem><type>easeInOutQuint</type></ListItem>
-            <ListItem><type>easeOutInQuint</type></ListItem>
-            <ListItem><type>easeInSine</type></ListItem>
-            <ListItem><type>easeOutSine</type></ListItem>
-            <ListItem><type>easeInOutSine</type></ListItem>
-            <ListItem><type>easeOutInSine</type></ListItem>
-            <ListItem><type>easeInExpo</type></ListItem>
-            <ListItem><type>easeOutExpo</type></ListItem>
-            <ListItem><type>easeInOutExpo</type></ListItem>
-            <ListItem><type>easeOutInExpo</type></ListItem>
-            <ListItem><type>easeInCirc</type></ListItem>
-            <ListItem><type>easeOutCirc</type></ListItem>
-            <ListItem><type>easeInOutCirc</type></ListItem>
-            <ListItem><type>easeOutInCirc</type></ListItem>
-            <ListItem><type>easeInElastic</type></ListItem>
-            <ListItem><type>easeOutElastic</type></ListItem>
-            <ListItem><type>easeInOutElastic</type></ListItem>
-            <ListItem><type>easeOutInElastic</type></ListItem>
-            <ListItem><type>easeInBack</type></ListItem>
-            <ListItem><type>easeOutBack</type></ListItem>
-            <ListItem><type>easeInOutBack</type></ListItem>
-            <ListItem><type>easeOutInBack</type></ListItem>
-            <ListItem><type>easeOutBounce</type></ListItem>
-            <ListItem><type>easeInBounce</type></ListItem>
-            <ListItem><type>easeInOutBounce</type></ListItem>
-            <ListItem><type>easeOutInBounce</type></ListItem>
-        </ListModel>
-    </resources>
-
-    <VerticalLayout id="Layout" anchors.left="{Window.left}" anchors.right="{Window.right}">
-        <Repeater dataSource="{EasingTypes}">
-            <Component>
-                <Text id="Text" text="{type}" height="18" font.italic="true">
-                    <x>
-                        <SequentialAnimation id="Anim">
-                            <NumericAnimation from="0" to="{Window.width / 2}" easing="{type}" duration="1000"/>
-                            <PauseAnimation duration="300"/>
-                            <NumericAnimation to="0" from="{Window.width / 2}" easing="{type}" duration="1000"/>
-                        </SequentialAnimation>
-                    </x>
-                    <children>
-                        <MouseRegion onClicked="Anim.running=true" anchors.fill="{parent}"/>
-                    </children>
-                </Text>
-            </Component>
-        </Repeater>
-    </VerticalLayout>
-</Rect>
+    ListModel2 {
+        id: EasingTypes
+        ListElement { type: "easeLinear" }
+        ListElement { type: "easeInQuad" }
+        ListElement { type: "easeOutQuad" }
+        ListElement { type: "easeInOutQuad" }
+        ListElement { type: "easeOutInQuad" }
+        ListElement { type: "easeInCubic" }
+        ListElement { type: "easeOutCubic" }
+        ListElement { type: "easeInOutCubic" }
+        ListElement { type: "easeOutInCubic" }
+        ListElement { type: "easeInQuart" }
+        ListElement { type: "easeOutQuart" }
+        ListElement { type: "easeInOutQuart" }
+        ListElement { type: "easeOutInQuart" }
+        ListElement { type: "easeInQuint" }
+        ListElement { type: "easeOutQuint" }
+        ListElement { type: "easeInOutQuint" }
+        ListElement { type: "easeOutInQuint" }
+        ListElement { type: "easeInSine" }
+        ListElement { type: "easeOutSine" }
+        ListElement { type: "easeInOutSine" }
+        ListElement { type: "easeOutInSine" }
+        ListElement { type: "easeInExpo" }
+        ListElement { type: "easeOutExpo" }
+        ListElement { type: "easeInOutExpo" }
+        ListElement { type: "easeOutInExpo" }
+        ListElement { type: "easeInCirc" }
+        ListElement { type: "easeOutCirc" }
+        ListElement { type: "easeInOutCirc" }
+        ListElement { type: "easeOutInCirc" }
+        ListElement { type: "easeInElastic" }
+        ListElement { type: "easeOutElastic" }
+        ListElement { type: "easeInOutElastic" }
+        ListElement { type: "easeOutInElastic" }
+        ListElement { type: "easeInBack" }
+        ListElement { type: "easeOutBack" }
+        ListElement { type: "easeInOutBack" }
+        ListElement { type: "easeOutInBack" }
+        ListElement { type: "easeOutBounce" }
+        ListElement { type: "easeInBounce" }
+        ListElement { type: "easeInOutBounce" }
+        ListElement { type: "easeOutInBounce" }
+    }
+    
+    VerticalLayout {
+        id: Layout
+        anchors.left: Window.left
+        anchors.right: Window.right
+        Repeater {
+            dataSource: EasingTypes
+            Component {
+                Text {
+                    id: Text
+                    text: type
+                    height: 18
+                    font.italic: true
+                    x: SequentialAnimation {
+                        id: Anim
+                        NumericAnimation {
+                            from: 0
+                            to: Window.width / 2
+                            easing: type
+                            duration: 1000
+                        }
+                        PauseAnimation {
+                            duration: 300
+                        }
+                        NumericAnimation {
+                            to: 0
+                            from: Window.width / 2
+                            easing: type
+                            duration: 1000
+                        }
+                    }
+                    children: [
+                        MouseRegion {
+                            onClicked: { Anim.running=true }
+                            anchors.fill: parent
+                        }
+                    ]
+                }
+            }
+        }
+    }
+}
diff --git a/examples/declarative/follow/pong.qml b/examples/declarative/follow/pong.qml
index 4fbf323..ed4a652 100644
--- a/examples/declarative/follow/pong.qml
+++ b/examples/declarative/follow/pong.qml
@@ -1,55 +1,120 @@
-<Rect id="Page" width="640" height="480" color="#000000">
-    <!-- Make a ball to bounce -->
-    <Rect id="Ball" x="20" width="20" height="20" color="#00ee00" z="1">
-        <properties>
-            <!-- Add a property for the target y coordinate -->
-            <Property name="targetY" value="{Page.height-10}"/>
-            <Property name="direction" value="right"/>
-        </properties>
-        <x>
-            <!-- Move the ball to the right and back to the left repeatedly -->
-            <SequentialAnimation running="true" repeat="true">
-                <NumericAnimation to="{Page.width-40}" duration="2000"/>
-                <SetPropertyAction target="{Ball}" property="direction" value="left"/>
-                <NumericAnimation to="20" duration="2000"/>
-                <SetPropertyAction target="{Ball}" property="direction" value="right"/>
-            </SequentialAnimation>
-        </x>
-        <y>
-            <!-- Make y follow the target y coordinate, with a velocity of 200 -->
-            <Follow source="{Ball.targetY}" velocity="200"/>
-        </y>
-        <onTopChanged>
-            <!-- Detect the ball hitting the top or bottom of the view and bounce it -->
-            if (y &lt;= 0)
+Rect {
+    id: Page
+    width: 640
+    height: 480
+    color: "#000000"
+    // Make a ball to bounce
+    Rect {
+        id: Ball
+        x: 20
+        width: 20
+        height: 20
+        color: "#00ee00"
+        z: 1
+        // Add a property for the target y coordinate
+        properties: Property {
+            name: "targetY"
+            value: Page.height-10
+        }
+        properties: Property {
+            name: "direction"
+            value: "right"
+        }
+        // Move the ball to the right and back to the left repeatedly
+        x: SequentialAnimation {
+            running: true
+            repeat: true
+            NumericAnimation {
+                to: Page.width-40
+                duration: 2000
+            }
+            SetPropertyAction {
+                target: Ball
+                property: "direction"
+                value: "left"
+            }
+            NumericAnimation {
+                to: 20
+                duration: 2000
+            }
+            SetPropertyAction {
+                target: Ball
+                property: "direction"
+                value: "right"
+            }
+        }
+        // Make y follow the target y coordinate, with a velocity of 200
+        y: Follow {
+            source: Ball.targetY
+            velocity: 200
+        }
+        // Detect the ball hitting the top or bottom of the view and bounce it
+        onTopChanged: { if (y <= 0)
                 targetY = Page.height-20;
-            else if (y &gt;= Page.height-20)
-                targetY = 0;
-        </onTopChanged>
-    </Rect>
-    <!--
-    Place bats to the left and right of the view, following the y
-    coordinates of the ball.
-    -->
-    <Rect id="LeftBat" color="#00ee00" x="2" width="20" height="90">
-        <y>
-            <Follow source="{Ball.y-45}" velocity="300" enabled="{Ball.direction == 'left'}"/>
-        </y>
-    </Rect>
-    <Rect id="RightBat" x="{Page.width-22}" color="#00ee00" width="20" height="90">
-        <y>
-            <Follow source="{Ball.y-45}" velocity="300" enabled="{Ball.direction == 'right'}"/>
-        </y>
-    </Rect>
-
-    <!--
-    The rest, to make it look realistic, if neither ever scores...
-    -->
-    <Rect color="#00ee00" width="40" height="60" x="{320-80}"/>
-    <Rect color="#000000" width="20" height="40"  x="{320-70}" y="10"/>
-    <Rect color="#00ee00" width="40" height="60" x="{320+40}"/>
-    <Rect color="#000000" width="20" height="40"  x="{320+50}" y="10"/>
-    <Repeater dataSource="{24}">
-        <Rect color="#00ee00" width="10" height="10" x="{320-5}" y="{index*20}"/>
-    </Repeater>
-</Rect>
+            else if (y >= Page.height-20)
+                targetY = 0; }
+    }
+    // Place bats to the left and right of the view, following the y
+    // coordinates of the ball.
+    Rect {
+        id: LeftBat
+        color: "#00ee00"
+        x: 2
+        width: 20
+        height: 90
+        y: Follow {
+            source: Ball.y-45
+            velocity: 300
+            enabled: Ball.direction == 'left'
+        }
+    }
+    Rect {
+        id: RightBat
+        x: Page.width-22
+        color: "#00ee00"
+        width: 20
+        height: 90
+        y: Follow {
+            source: Ball.y-45
+            velocity: 300
+            enabled: Ball.direction == 'right'
+        }
+    }
+    // The rest, to make it look realistic, if neither ever scores...
+    Rect {
+        color: "#00ee00"
+        width: 40
+        height: 60
+        x: 320-80
+    }
+    Rect {
+        color: "#000000"
+        width: 20
+        height: 40
+        x: 320-70
+        y: 10
+    }
+    Rect {
+        color: "#00ee00"
+        width: 40
+        height: 60
+        x: 320+40
+    }
+    Rect {
+        color: "#000000"
+        width: 20
+        height: 40
+        x: 320+50
+        y: 10
+    }
+    Repeater {
+        dataSource: 24
+        Rect {
+            color: "#00ee00"
+            width: 10
+            height: 10
+            x: 320-5
+            y: index*20
+        }
+    }
+}
diff --git a/examples/declarative/listview/dummydata/MyPetsModel.qml b/examples/declarative/listview/dummydata/MyPetsModel.qml
index 5af7fbf..def8cf3 100644
--- a/examples/declarative/listview/dummydata/MyPetsModel.qml
+++ b/examples/declarative/listview/dummydata/MyPetsModel.qml
@@ -1,51 +1,50 @@
-<!--
-ListModel allows free form list models to be defined and populated.
-Be sure to name the file the same as the id.
--->
-<ListModel id="MyPetsModel">
-    <Pet>
-        <name>Rover</name>
-        <type>Dog</type>
-        <age>5</age>
-    </Pet>
-    <Pet>
-        <name>Whiskers</name>
-        <type>Cat</type>
-        <age>2</age>
-    </Pet>
-    <Pet>
-        <name>Warren</name>
-        <type>Rabbit</type>
-        <age>2</age>
-    </Pet>
-    <Pet>
-        <name>Polly</name>
-        <type>Parrot</type>
-        <age>12</age>
-    </Pet>
-    <Pet>
-        <name>Spot</name>
-        <type>Dog</type>
-        <age>9</age>
-    </Pet>
-    <Pet>
-        <name>Tiny</name>
-        <type>Elephant</type>
-        <age>15</age>
-    </Pet>
-    <Pet>
-        <name>Penny</name>
-        <type>Turtle</type>
-        <age>4</age>
-    </Pet>
-    <Pet>
-        <name>Joey</name>
-        <type>Kangaroo</type>
-        <age>1</age>
-    </Pet>
-    <Pet>
-        <name>Kimba</name>
-        <type>Bunny</type>
-        <age>65</age>
-    </Pet>
-</ListModel>
+// ListModel allows free form list models to be defined and populated.
+// Be sure to name the file the same as the id.
+ListModel2 {
+    id: MyPetsModel
+    ListElement {
+        name: "Rover"
+        type: "Dog"
+        age: 5
+    }
+    ListElement {
+        name: "Whiskers"
+        type: "Cat"
+        age: 2
+    }
+    ListElement {
+        name: "Warren"
+        type: "Rabbit"
+        age: 2
+    }
+    ListElement {
+        name: "Polly"
+        type: "Parrot"
+        age: 12
+    }
+    ListElement {
+        name: "Spot"
+        type: "Dog"
+        age: 9
+    }
+    ListElement {
+        name: "Tiny"
+        type: "Elephant"
+        age: 15
+    }
+    ListElement {
+        name: "Penny"
+        type: "Turtle"
+        age: 4
+    }
+    ListElement {
+        name: "Joey"
+        type: "Kangaroo"
+        age: 1
+    }
+    ListElement {
+        name: "Kimba"
+        type: "Bunny"
+        age: 65
+    }
+}
diff --git a/examples/declarative/listview/dummydata/Recipies.qml b/examples/declarative/listview/dummydata/Recipies.qml
index 49bc610..6b20409 100644
--- a/examples/declarative/listview/dummydata/Recipies.qml
+++ b/examples/declarative/listview/dummydata/Recipies.qml
@@ -1,112 +1,87 @@
-<ListModel id="Recipies">
-    <Recipe title="Pancakes" picture="content/pics/pancakes.jpg">
-        <ingredients>
-            <![CDATA[
-            <html>
-                <ul>
-                    <li> 1 cup (150g) self-raising flour
-                    <li> 1 tbs caster sugar
-                    <li> 3/4 cup (185ml) milk
-                    <li> 1 egg
-                </ul>
-            </html>
-            ]]>
-        </ingredients>
-        <method>
-            <![CDATA[
-            <html>
-                <ol>
-                    <li> Sift flour and sugar together into a bowl. Add a pinch of salt.
-                    <li> Beat milk and egg together, then add to dry ingredients. Beat until smooth.
-                    <li> Pour mixture into a pan on medium heat and cook until bubbles appear on the surface.
-                    <li> Turn over and cook other side until golden. 
-                </ol>
-            ]]>
-        </method>
-    </Recipe>
-    <Recipe title="Fruit Salad" picture="content/pics/fruit-salad.jpg">
-        <ingredients>
-        * Seasonal Fruit
-        </ingredients>
-        <method>
-        * Chop fruit and place in a bowl.
-        </method>
-    </Recipe>
-    <Recipe title="Vegetable Soup" picture="content/pics/vegetable-soup.jpg">
-        <ingredients>
-            <![CDATA[
-            <html>
-                <ul>
-                    <li> 1 onion
-                    <li> 1 turnip
-                    <li> 1 potato
-                    <li> 1 carrot
-                    <li> 1 head of celery
-                    <li> 1 1/2 litres of water
-                </ul>
-            </html>
-            ]]>
-        </ingredients>
-        <method>
-            <![CDATA[
-            <html>
-                <ol>
-                    <li> Chop vegetables.
-                    <li> Boil in water until vegetables soften.
-                    <li> Season with salt and pepper to taste.
-                </ol>
-            </html>
-            ]]>
-        </method>
-    </Recipe>
-    <Recipe title="Hamburger" picture="content/pics/hamburger.jpg">
-        <ingredients>
-            <![CDATA[
-            <html>
-                <ul>
-                    <li> 500g minced beef
-                    <li> Seasoning
-                    <li> lettuce, tomato, onion, cheese
-                    <li> 1 hamburger bun for each burger
-                </ul>
-            </html>
-            ]]>
-        </ingredients>
-        <method>
-            <![CDATA[
-            <html>
-                <ol>
-                    <li> Mix the beef, together with seasoning, in a food processor.
-                    <li> Shape the beef into burgers.
-                    <li> Grill the burgers for about 5 mins on each side (until cooked through)
-                    <li> Serve each burger on a bun with ketchup, cheese, lettuce, tomato and onion.
-                </ol>
-            </html>
-            ]]>
-        </method>
-    </Recipe>
-    <Recipe title="Lemonade" picture="content/pics/lemonade.jpg">
-        <ingredients>
-            <![CDATA[
-            <html>
-                <ul>
-                    <li> 1 cup Lemon Juice
-                    <li> 1 cup Sugar
-                    <li> 6 Cups of Water (2 cups warm water, 4 cups cold water)
-                </ul>
-            </html>
-            ]]>
-        </ingredients>
-        <method>
-            <![CDATA[
-            <html>
-                <ol>
-                    <li> Pour 2 cups of warm water into a pitcher and stir in sugar until it dissolves.
-                    <li> Pour in lemon juice, stir again, and add 4 cups of cold water.
-                    <li> Chill or serve over ice cubes.
-                </ol>
-            </html>
-            ]]>
-        </method>
-    </Recipe>
-</ListModel>
+ListModel2 {
+    id: Recipies
+    ListElement {
+        title: "Pancakes"
+        picture: "content/pics/pancakes.jpg"
+        ingredients: "<html> \
+                <ul> \
+                    <li> 1 cup (150g) self-raising flour \
+                    <li> 1 tbs caster sugar \
+                    <li> 3/4 cup (185ml) milk \
+                    <li> 1 egg \
+                </ul> \
+            </html>"
+        method: "<html> \
+                <ol> \
+                    <li> Sift flour and sugar together into a bowl. Add a pinch of salt. \
+                    <li> Beat milk and egg together, then add to dry ingredients. Beat until smooth. \
+                    <li> Pour mixture into a pan on medium heat and cook until bubbles appear on the surface. \
+                    <li> Turn over and cook other side until golden.  \
+                </ol>"
+    }
+    ListElement {
+        title: "Fruit Salad"
+        picture: "content/pics/fruit-salad.jpg"
+        ingredients: "* Seasonal Fruit"
+        method: "* Chop fruit and place in a bowl."
+    }
+    ListElement {
+        title: "Vegetable Soup"
+        picture: "content/pics/vegetable-soup.jpg"
+        ingredients: "<html> \
+                <ul> \
+                    <li> 1 onion \
+                    <li> 1 turnip \
+                    <li> 1 potato \
+                    <li> 1 carrot \
+                    <li> 1 head of celery \
+                    <li> 1 1/2 litres of water \
+                </ul> \
+            </html>"
+        method: "<html> \
+                <ol> \
+                    <li> Chop vegetables. \
+                    <li> Boil in water until vegetables soften. \
+                    <li> Season with salt and pepper to taste. \
+                </ol> \
+            </html>"
+    }
+    ListElement {
+        title: "Hamburger"
+        picture: "content/pics/hamburger.jpg"
+        ingredients: "<html> \
+                <ul> \
+                    <li> 500g minced beef \
+                    <li> Seasoning \
+                    <li> lettuce, tomato, onion, cheese \
+                    <li> 1 hamburger bun for each burger \
+                </ul> \
+            </html>"
+        method: "<html> \
+                <ol> \
+                    <li> Mix the beef, together with seasoning, in a food processor. \
+                    <li> Shape the beef into burgers. \
+                    <li> Grill the burgers for about 5 mins on each side (until cooked through) \
+                    <li> Serve each burger on a bun with ketchup, cheese, lettuce, tomato and onion. \
+                </ol> \
+            </html>"
+    }
+    ListElement {
+        title: "Lemonade"
+        picture: "content/pics/lemonade.jpg"
+        ingredients: "<html> \
+                <ul> \
+                    <li> 1 cup Lemon Juice \
+                    <li> 1 cup Sugar \
+                    <li> 6 Cups of Water (2 cups warm water, 4 cups cold water) \
+                </ul> \
+            </html>"
+        method: "<html> \
+                <ol> \
+                    <li> Pour 2 cups of warm water into a pitcher and stir in sugar until it dissolves. \
+                    <li> Pour in lemon juice, stir again, and add 4 cups of cold water. \
+                    <li> Chill or serve over ice cubes. \
+                </ol> \
+            </html>"
+    }
+}
diff --git a/examples/declarative/minehunt/minehunt.qml b/examples/declarative/minehunt/minehunt.qml
index fb65fa3..cde2612 100644
--- a/examples/declarative/minehunt/minehunt.qml
+++ b/examples/declarative/minehunt/minehunt.qml
@@ -1,73 +1,166 @@
-<Item id="field" width="370" height="480">
-    <properties>
-        <Property name="clickx" type="Int" value="0"/>
-        <Property name="clicky" type="Int" value="0"/>
-    </properties>
-    <resources>
-        <Component id="tile">
-            <Flipable id="flipable" width="40" height="40">
-                <axis>
-                    <Axis startX="20" startY="20" endX="20" endY="0" />
-                </axis>
-                <front>
-                    <Image source="pics/front.png" width="40" height="40">
-                        <Image anchors.horizontalCenter="{parent.horizontalCenter}"
-                               anchors.verticalCenter="{parent.verticalCenter}"
-                                source="pics/flag.png" opacity="{modelData.hasFlag}">
-                                <opacity>
-                                    <Behaviour>
-                                        <NumericAnimation property="opacity" duration="250"/>
-                                    </Behaviour>
-                                </opacity>
-                        </Image>
-                    </Image>
-                </front>
-                <back>
-                    <Image source="pics/back.png" width="40" height="40">
-                        <Text anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" 
-                              text="{modelData.hint}" color="white" font.bold="true" 
-                              opacity="{modelData.hasMine == false &amp;&amp; modelData.hint > 0}"/>
-                        <Image anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" 
-                                source="pics/bomb.png" opacity="{modelData.hasMine}"/>
-                        <Explosion anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" explode="{modelData.hasMine==true &amp;&amp; modelData.flipped==true}"/>
-                    </Image>
-                </back>
-                <states>
-                    <State name="back" when="{modelData.flipped == true}">
-                        <SetProperty target="{flipable}" property="rotation" value="180" />
-                    </State>
-                </states>
-                <transitions>
-                    <Transition>
-                        <SequentialAnimation>
-                            <PauseAnimation duration="{var ret = Math.abs(flipable.parent.x-field.clickx) + Math.abs(flipable.parent.y-field.clicky); if (ret > 0) {if(modelData.hasMine==true &amp;&amp; modelData.flipped==true){ret*3;}else{ret;}} else {0}}"/>
-                            <NumericAnimation easing="easeInOutQuad" properties="rotation"/>
-                        </SequentialAnimation>
-                    </Transition>
-                </transitions>
-                <MouseRegion anchors.fill="{parent}"
-                             onClicked="field.clickx = flipable.parent.x; field.clicky = flipable.parent.y; row = Math.floor(index/9); col = index - (Math.floor(index/9) * 9); if(mouse.button==undefined || mouse.button==Qt.RightButton){flag(row,col);}else{flip(row,col);}" />
-            </Flipable>
-        </Component>
-    </resources>
-    <Image source="pics/No-Ones-Laughing-3.jpg" tile="true"/>
-    <Description text="Use the 'minehunt' executable to run this demo!" width="300" opacity="{tiles?0:1}" anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}"/>
-    <Repeater dataSource="{tiles}" x="1" y="1">
-        <Component>
-            <ComponentInstance component="{tile}" 
-                           x="{(index - (Math.floor(index/9) * 9)) * 41}"
-                           y="{Math.floor(index/9) * 41}"/>
-        </Component>
-    </Repeater>
-    <Item id="gamedata" width="370" height="100" y="380">
-        <Text color="white" font.size="18" x="20" y="20">In play:</Text>
-        <Image x="100" y="20" source="pics/bomb-color.png"/>
-        <Text x="100" y="60" color="white" text="{numMines}"/>
-        <Image x="140" y="20" source="pics/flag-color.png"/>
-        <Text x="140" y="60" color="white" text="{numFlags}"/>
-
-        <Image x="240" y="0" source="{if(isPlaying==true){'pics/smile.png'}else{if(hasWon==true){'pics/glee.png'}else{'pics/frown.png'}}}">
-            <MouseRegion anchors.fill="{parent}" onClicked="reset()"/>
-        </Image>
-    </Item>
-</Item>
+Item {
+    id: field
+    width: 370
+    height: 480
+    properties: Property {
+        name: "clickx"
+        type: "Int"
+        value: 0
+    }
+    properties: Property {
+        name: "clicky"
+        type: "Int"
+        value: 0
+    }
+    resources: [
+        Component {
+            id: tile
+            Flipable {
+                id: flipable
+                width: 40
+                height: 40
+                axis: Axis {
+                    startX: 20
+                    startY: 20
+                    endX: 20
+                    endY: 0
+                }
+                front: Image {
+                    source: "pics/front.png"
+                    width: 40
+                    height: 40
+                    Image {
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        anchors.verticalCenter: parent.verticalCenter
+                        source: "pics/flag.png"
+                        opacity: modelData.hasFlag
+                        opacity: Behaviour {
+                            NumericAnimation {
+                                property: "opacity"
+                                duration: 250
+                            }
+                        }
+                    }
+                }
+                back: Image {
+                    source: "pics/back.png"
+                    width: 40
+                    height: 40
+                    Text {
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        anchors.verticalCenter: parent.verticalCenter
+                        text: modelData.hint
+                        color: "white"
+                        font.bold: true
+                        opacity: modelData.hasMine == false && modelData.hint > 0
+                    }
+                    Image {
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        anchors.verticalCenter: parent.verticalCenter
+                        source: "pics/bomb.png"
+                        opacity: modelData.hasMine
+                    }
+                    Explosion {
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        anchors.verticalCenter: parent.verticalCenter
+                        explode: modelData.hasMine==true && modelData.flipped==true
+                    }
+                }
+                states: [
+                    State {
+                        name: "back"
+                        when: modelData.flipped == true
+                        SetProperty {
+                            target: flipable
+                            property: "rotation"
+                            value: 180
+                        }
+                    }
+                ]
+                transitions: [
+                    Transition {
+                        SequentialAnimation {
+                            PauseAnimation {
+                                duration: {var ret = Math.abs(flipable.parent.x-field.clickx) + Math.abs(flipable.parent.y-field.clicky); if (ret > 0) {if(modelData.hasMine==true && modelData.flipped==true){ret*3;}else{ret;}} else {0}}
+                            }
+                            NumericAnimation {
+                                easing: "easeInOutQuad"
+                                properties: "rotation"
+                            }
+                        }
+                    }
+                ]
+                MouseRegion {
+                    anchors.fill: parent
+                    onClicked: { field.clickx = flipable.parent.x; field.clicky = flipable.parent.y; row = Math.floor(index/9); col = index - (Math.floor(index/9) * 9); if(mouse.button==undefined || mouse.button==Qt.RightButton){flag(row,col);}else{flip(row,col);} }
+                }
+            }
+        }
+    ]
+    Image {
+        source: "pics/No-Ones-Laughing-3.jpg"
+        tile: true
+    }
+    Description {
+        text: "Use the 'minehunt' executable to run this demo!"
+        width: 300
+        opacity: tiles?0:1
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.verticalCenter: parent.verticalCenter
+    }
+    Repeater {
+        dataSource: tiles
+        x: 1
+        y: 1
+        Component {
+            ComponentInstance {
+                component: tile
+                x: (index - (Math.floor(index/9) * 9)) * 41
+                y: Math.floor(index/9) * 41
+            }
+        }
+    }
+    Item {
+        id: gamedata
+        width: 370
+        height: 100
+        y: 380
+        Text {
+            color: "white"
+            font.size: 18
+            x: 20
+            y: 20
+        }
+        Image {
+            x: 100
+            y: 20
+            source: "pics/bomb-color.png"
+        }
+        Text {
+            x: 100
+            y: 60
+            color: "white"
+            text: numMines
+        }
+        Image {
+            x: 140
+            y: 20
+            source: "pics/flag-color.png"
+        }
+        Text {
+            x: 140
+            y: 60
+            color: "white"
+            text: numFlags
+        }
+        Image {
+            x: 240
+            y: 0
+            source: if(isPlaying==true){'pics/smile.png'}else{if(hasWon==true){'pics/glee.png'}else{'pics/frown.png'}}
+            MouseRegion {
+                anchors.fill: parent
+                onClicked: { reset() }
+            }
+        }
+    }
+}
diff --git a/examples/declarative/mouseregion/mouse.qml b/examples/declarative/mouseregion/mouse.qml
index 7aaf51a..6d10425 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 + ' button: ' + (mouse.button == Qt.RightButton ? 'right' : 'left') + ' Shift: ' + (mouse.modifiers &amp; Qt.ShiftModifier ? 'true' : 'false') + ')')"
-                     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 + ' button: ' + (mouse.button == Qt.RightButton ? 'right' : 'left') + ' Shift: ' + (mouse.modifiers & Qt.ShiftModifier ? 'true' : 'false') + ')') }
+            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
+        }
+    }
+}
diff --git a/examples/declarative/velocity/Day.qml b/examples/declarative/velocity/Day.qml
index b65f2bc..7d26e88 100644
--- a/examples/declarative/velocity/Day.qml
+++ b/examples/declarative/velocity/Day.qml
@@ -1,41 +1,115 @@
-<Rect width="400" height="500" radius="7" pen.color="black" id="Page">
-    <properties>
-        <Property name="day" type="string" />
-        <Property name="stickies" />
-    </properties>
-
-    <Image x="10" y="10" source="cork.jpg" opaque="true"/>
-    <Text x="20" y="20" height="40" font.size="14" font.bold="true" width="370" text="{day}" style="Outline" styleColor="#dedede"/>
-
-    <Repeater dataSource="{Page.stickies}">
-        <Item x="{Math.random() * 200 + 100}" y="{Math.random() * 300 + 50}" id="StickyPage">
-            <rotation>
-                <Follow source="{-Flick.xVelocity / 100}" spring="2.0" damping="0.1"/>
-            </rotation>
-            <Item id="Sticky" scale="0.5">
-                <Image id="StickyImage" source="sticky.png" smooth="true" y="-20" x="{8 + -width * 0.6 / 2}" scale="0.6" />
-                <TextEdit id="MyText" smooth="true" font.size="28" readOnly="false" x="-104" y="36" wrap="true" rotation="-8" text="{noteText}" width="195" height="172" />
-                <Item y="-20" x="{StickyImage.x}" width="{StickyImage.width * StickyImage.scale}" height="{StickyImage.height * StickyImage.scale}" >
-                    <MouseRegion id="Mouse" onClicked="MyText.focus = true" anchors.fill="{parent}" drag.target="{StickyPage}" drag.axis="xy" drag.ymin="0" drag.ymax="500" drag.xmin="0" drag.xmax="400"/>
-                </Item>
-            </Item>
-            <Image source="tack.png" x="{-width / 2}" y="{-height * 0.7 / 2}" scale="0.7" />
-
-            <states>
-                <State name="pressed" when="{Mouse.pressed}">
-                    <SetProperties target="{Sticky}" rotation="8" scale="1"/>
-                    <SetProperties target="{Page}" z="8"/>
-                </State>
-            </states>
-            <transitions>
-                <Transition>
-                    <NumericAnimation properties="rotation,scale" duration="200"/>
-                </Transition>
-            </transitions>
-        </Item>
-    </Repeater>
-
-
-
-
-</Rect>
+Rect {
+    width: 400
+    height: 500
+    radius: 7
+    pen.color: "black"
+    id: Page
+    properties: Property {
+        name: "day"
+        type: "string"
+    }
+    properties: Property {
+        name: "stickies"
+    }
+    Image {
+        x: 10
+        y: 10
+        source: "cork.jpg"
+        opaque: true
+    }
+    Text {
+        x: 20
+        y: 20
+        height: 40
+        font.size: 14
+        font.bold: true
+        width: 370
+        text: day
+        style: Outline
+        styleColor: "#dedede"
+    }
+    Repeater {
+        dataSource: Page.stickies
+        Item {
+            x: Math.random() * 200 + 100
+            y: Math.random() * 300 + 50
+            id: StickyPage
+            rotation: Follow {
+                source: -Flick.xVelocity / 100
+                spring: 2.0
+                damping: 0.1
+            }
+            Item {
+                id: Sticky
+                scale: 0.5
+                Image {
+                    id: StickyImage
+                    source: "sticky.png"
+                    smooth: true
+                    y: -20
+                    x: 8 + -width * 0.6 / 2
+                    scale: 0.6
+                }
+                TextEdit {
+                    id: MyText
+                    smooth: true
+                    font.size: 28
+                    readOnly: false
+                    x: -104
+                    y: 36
+                    wrap: true
+                    rotation: -8
+                    text: noteText
+                    width: 195
+                    height: 172
+                }
+                Item {
+                    y: -20
+                    x: StickyImage.x
+                    width: StickyImage.width * StickyImage.scale
+                    height: StickyImage.height * StickyImage.scale
+                    MouseRegion {
+                        id: Mouse
+                        onClicked: { MyText.focus = true }
+                        anchors.fill: parent
+                        drag.target: StickyPage
+                        drag.axis: "xy"
+                        drag.ymin: 0
+                        drag.ymax: 500
+                        drag.xmin: 0
+                        drag.xmax: 400
+                    }
+                }
+            }
+            Image {
+                source: "tack.png"
+                x: -width / 2
+                y: -height * 0.7 / 2
+                scale: 0.7
+            }
+            states: [
+                State {
+                    name: "pressed"
+                    when: Mouse.pressed
+                    SetProperties {
+                        target: Sticky
+                        rotation: 8
+                        scale: 1
+                    }
+                    SetProperties {
+                        target: Page
+                        z: 8
+                    }
+                }
+            ]
+            transitions: [
+                Transition {
+                    NumericAnimation {
+                        properties: "rotation,scale"
+                        duration: 200
+                    }
+                }
+            ]
+        }
+    }
+}
diff --git a/examples/declarative/velocity/velocity.qml b/examples/declarative/velocity/velocity.qml
index 0215d37..ff95527 100644
--- a/examples/declarative/velocity/velocity.qml
+++ b/examples/declarative/velocity/velocity.qml
@@ -1,81 +1,113 @@
-<Rect color="lightSteelBlue" width="800" height="600">
-    <ListModel id="List">
-        <Day>
-            <name>Sunday</name>
-            <dayColor>#808080</dayColor>
-            <notes>
-                <Note noteText="Lunch" />
-                <Note noteText="Party" />
-            </notes>
-        </Day>
-        <Day>
-            <name>Monday</name>
-            <dayColor>blue</dayColor>
-            <notes>
-                <Note noteText="Pickup kids" />
-                <Note noteText="Checkout kinetic" />
-                <Note noteText="Read email" />
-            </notes>
-        </Day>
-        <Day>
-            <name>Tuesday</name>
-            <dayColor>yellow</dayColor>
-            <notes>
-                <Note noteText="Walk dog" />
-                <Note noteText="Buy newspaper" />
-            </notes>
-        </Day>
-        <Day>
-            <name>Wednesday</name>
-            <dayColor>purple</dayColor>
-            <notes>
-                <Note noteText="Cook dinner" />
-                <Note noteText="Eat dinner" />
-            </notes>
-        </Day>
-        <Day>
-            <name>Thursday</name>
-            <dayColor>blue</dayColor>
-            <notes>
-                <Note noteText="5:30pm Meeting" />
-                <Note noteText="Weed garden" />
-            </notes>
-        </Day>
-        <Day>
-            <name>Friday</name>
-            <dayColor>green</dayColor>
-            <notes>
-                <Note noteText="Still work" />
-                <Note noteText="Drink" />
-            </notes>
-        </Day>
-        <Day>
-            <name>Saturday</name>
-            <dayColor>orange</dayColor>
-            <notes>
-                <Note noteText="Drink" />
-                <Note noteText="Drink" />
-            </notes>
-        </Day>
-    </ListModel>
-
-    <Flickable id="Flick" anchors.fill="{parent}" viewportWidth="{Lay.width}">
-        <HorizontalLayout id="Lay">
-            <Repeater dataSource="{List}">
-                <Component>
-                    <Day day="{name}" color="{dayColor}" stickies="{notes}"/>
-                </Component>
-            </Repeater>
-            <!--
-            <Day color="#808080" day="Sunday" />
-            <Day color="blue" day="Monday"/>
-            <Day color="yellow" day="Tuesday"/>
-            <Day color="purple" day="Wednesday"/>
-            <Day color="blue" day="Thursday"/>
-            <Day color="green" day="Friday"/>
-            <Day color="orange" day="Saturday"/>
-            -->
-        </HorizontalLayout>
-    </Flickable>
-
-</Rect>
+Rect {
+    color: "lightSteelBlue"
+    width: 800
+    height: 600
+    ListModel2 {
+        id: List
+        ListElement {
+            name: "Sunday"
+            dayColor: "#808080"
+            notes: [
+                ListElement {
+                    noteText: "Lunch"
+                },
+                ListElement {
+                    noteText: "Party"
+                }
+            ]
+        }
+        ListElement {
+            name: "Monday"
+            dayColor: "blue"
+            notes: [
+                ListElement {
+                    noteText: "Pickup kids"
+                },
+                ListElement {
+                    noteText: "Checkout kinetic"
+                },
+                ListElement {
+                    noteText: "Read email"
+                }
+            ]
+        }
+        ListElement {
+            name: "Tuesday"
+            dayColor: "yellow"
+            notes: [
+                ListElement {
+                    noteText: "Walk dog"
+                },
+                ListElement {
+                    noteText: "Buy newspaper"
+                }
+            ]
+        }
+        ListElement {
+            name: "Wednesday"
+            dayColor: "purple"
+            notes: [
+                ListElement {
+                    noteText: "Cook dinner"
+                },
+                ListElement {
+                    noteText: "Eat dinner"
+                }
+            ]
+        }
+        ListElement {
+            name: "Thursday"
+            dayColor: "blue"
+            notes: [
+                ListElement {
+                    noteText: "5:30pm Meeting"
+                },
+                ListElement {
+                    noteText: "Weed garden"
+                }
+            ]
+        }
+        ListElement {
+            name: "Friday"
+            dayColor: "green"
+            notes: [
+                ListElement {
+                    noteText: "Still work"
+                },
+                ListElement {
+                    noteText: "Drink"
+                }
+            ]
+        }
+        ListElement {
+            name: "Saturday"
+            dayColor: "orange"
+            notes: [
+                ListElement {
+                    noteText: "Drink"
+                },
+                ListElement {
+                    noteText: "Drink"
+                }
+            ]
+        }
+    }
+    Flickable {
+        id: Flick
+        anchors.fill: parent
+        viewportWidth: Lay.width
+        HorizontalLayout {
+            id: Lay
+            Repeater {
+                dataSource: List
+                Component {
+                    Day {
+                        day: name
+                        color: dayColor
+                        stickies: notes
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/examples/declarative/xmldata/daringfireball.qml b/examples/declarative/xmldata/daringfireball.qml
index 5e98d1b..3877adf 100644
--- a/examples/declarative/xmldata/daringfireball.qml
+++ b/examples/declarative/xmldata/daringfireball.qml
@@ -1,25 +1,59 @@
-<Rect color="white" width="600" height="600">
-  <resources>
-        <XmlListModel id="feedModel" source="http://daringfireball.net/index.xml"
-                                     query="doc($src)/feed/entry">
-            <namespaceDeclarations>
-                declare default element namespace 'http://www.w3.org/2005/Atom';
-            </namespaceDeclarations>
-            <Role name="title" query="title/string()"/>
-            <Role name="tagline" query="author/name/string()"/>
-            <Role name="content" query="content/string()" isCData="true"/>
-        </XmlListModel>
-        <Component id="feedDelegate">
-            <Item height="{contents.height + 20}">
-                <Text x="10" id="TitleText" text="{title}" font.bold="true"/>
-                <Text text="{'by ' + tagline}" anchors.left="{TitleText.right}" anchors.leftMargin="10" font.italic="true"/>
-                <Text x="10" text="{content}" anchors.top="{TitleText.bottom}" width="580" wrap="true">
-                    <onLinkActivated>print('link clicked: ' + link)</onLinkActivated>
-                </Text>
-            </Item>
-        </Component>
-    </resources>
-
-    <ListView id="list" anchors.fill="{parent}" clip="true"
-              model="{feedModel}" delegate="{feedDelegate}"/>
-</Rect>
+Rect {
+    color: "white"
+    width: 600
+    height: 600
+    resources: [
+        XmlListModel {
+            id: feedModel
+            source: "http://daringfireball.net/index.xml"
+            query: "doc($src)/feed/entry"
+            namespaceDeclarations: "declare default element namespace 'http://www.w3.org/2005/Atom';"
+            Role {
+                name: "title"
+                query: "title/string()"
+            }
+            Role {
+                name: "tagline"
+                query: "author/name/string()"
+            }
+            Role {
+                name: "content"
+                query: "content/string()"
+                isCData: true
+            }
+        },
+        Component {
+            id: feedDelegate
+            Item {
+                height: contents.height + 20
+                Text {
+                    x: 10
+                    id: TitleText
+                    text: title
+                    font.bold: true
+                }
+                Text {
+                    text: 'by ' + tagline
+                    anchors.left: TitleText.right
+                    anchors.leftMargin: 10
+                    font.italic: true
+                }
+                Text {
+                    x: 10
+                    text: content
+                    anchors.top: TitleText.bottom
+                    width: 580
+                    wrap: true
+                    onLinkActivated: { print('link clicked: ' + link) }
+                }
+            }
+        }
+    ]
+    ListView {
+        id: list
+        anchors.fill: parent
+        clip: true
+        model: feedModel
+        delegate: feedDelegate
+    }
+}
diff --git a/examples/declarative/xmldata/yahoonews.qml b/examples/declarative/xmldata/yahoonews.qml
index 32a706e..a465cdd 100644
--- a/examples/declarative/xmldata/yahoonews.qml
+++ b/examples/declarative/xmldata/yahoonews.qml
@@ -1,38 +1,111 @@
-<Rect color="black" gradientColor="#AAAAAA" width="600" height="600">
-  <resources>
-        <XmlListModel id="feedModel" source="http://rss.news.yahoo.com/rss/oceania" query="doc($src)/rss/channel/item">
-            <Role name="title" query="title/string()"/>
-            <Role name="link" query="link/string()"/>
-            <Role name="description" query="description/string()" isCData="true"/>
-        </XmlListModel>
-        <Component id="feedDelegate">
-            <Item id="Delegate" height="{Wrapper.height + 10}">
-                <MouseRegion anchors.fill="{Wrapper}" onPressed="Delegate.ListView.list.currentIndex = index;"
-                             onClicked="if (Wrapper.state == 'Details') { Wrapper.state = '';} else {Wrapper.state = 'Details';}"/>
-                <Rect id="Wrapper" y="5" height="{TitleText.height + 10}" width="580" color="#F0F0F0" radius="5">
-                    <Text x="10" y="5" id="TitleText" text="{'&lt;a href=\'' + link + '\'&gt;' + title + '&lt;/a&gt;'}" font.bold="true" font.family="Helvetica" font.size="14" onLinkActivated="print('link clicked: ' + link)"/>
-                    <Text x="10" id="Description" text="{description}" width="560" wrap="true" font.family="Helvetica"
-                          anchors.top="{TitleText.bottom}" anchors.topMargin="5" opacity="0"/>
-
-                    <states>
-                        <State name="Details">
-                            <SetProperty target="{Wrapper}" property="height" binding="contents.height + 10"/>
-                            <SetProperty target="{Description}" property="opacity" value="1"/>
-                        </State>
-                    </states>
-                    <transitions>
-                        <Transition fromState="*" toState="Details" reversible="true">
-                            <SequentialAnimation>
-                                <NumericAnimation duration="200" properties="height" easing="easeOutQuad"/>
-                                <NumericAnimation duration="200" properties="opacity"/>
-                            </SequentialAnimation>
-                        </Transition>
-                    </transitions>
-                </Rect>
-            </Item>
-        </Component>
-    </resources>
-
-    <ListView id="list" x="10" y="10" width="{parent.width - 20}" height="{parent.height - 20}" clip="true"
-              model="{feedModel}" delegate="{feedDelegate}" currentItemPositioning="Snap"/>
-</Rect>
+Rect {
+    color: "black"
+    gradientColor: "#AAAAAA"
+    width: 600
+    height: 600
+    resources: [
+        XmlListModel {
+            id: feedModel
+            source: "http://rss.news.yahoo.com/rss/oceania"
+            query: "doc($src)/rss/channel/item"
+            Role {
+                name: "title"
+                query: "title/string()"
+            }
+            Role {
+                name: "link"
+                query: "link/string()"
+            }
+            Role {
+                name: "description"
+                query: "description/string()"
+                isCData: true
+            }
+        },
+        Component {
+            id: feedDelegate
+            Item {
+                id: Delegate
+                height: Wrapper.height + 10
+                MouseRegion {
+                    anchors.fill: Wrapper
+                    onPressed: { Delegate.ListView.list.currentIndex = index; }
+                    onClicked: { if (Wrapper.state == 'Details') { Wrapper.state = '';} else {Wrapper.state = 'Details';} }
+                }
+                Rect {
+                    id: Wrapper
+                    y: 5
+                    height: TitleText.height + 10
+                    width: 580
+                    color: "#F0F0F0"
+                    radius: 5
+                    Text {
+                        x: 10
+                        y: 5
+                        id: TitleText
+                        text: '<a href=\'' + link + '\'>' + title + '</a>'
+                        font.bold: true
+                        font.family: "Helvetica"
+                        font.size: 14
+                        onLinkActivated: { print('link clicked: ' + link) }
+                    }
+                    Text {
+                        x: 10
+                        id: Description
+                        text: description
+                        width: 560
+                        wrap: true
+                        font.family: "Helvetica"
+                        anchors.top: TitleText.bottom
+                        anchors.topMargin: 5
+                        opacity: 0
+                    }
+                    states: [
+                        State {
+                            name: "Details"
+                            SetProperty {
+                                target: Wrapper
+                                property: "height"
+                                binding: "contents.height + 10"
+                            }
+                            SetProperty {
+                                target: Description
+                                property: "opacity"
+                                value: 1
+                            }
+                        }
+                    ]
+                    transitions: [
+                        Transition {
+                            fromState: "*"
+                            toState: "Details"
+                            reversible: true
+                            SequentialAnimation {
+                                NumericAnimation {
+                                    duration: 200
+                                    properties: "height"
+                                    easing: "easeOutQuad"
+                                }
+                                NumericAnimation {
+                                    duration: 200
+                                    properties: "opacity"
+                                }
+                            }
+                        }
+                    ]
+                }
+            }
+        }
+    ]
+    ListView {
+        id: list
+        x: 10
+        y: 10
+        width: parent.width - 20
+        height: parent.height - 20
+        clip: true
+        model: feedModel
+        delegate: feedDelegate
+        currentItemPositioning: "Snap"
+    }
+}