Examples: Moved example documentation.

-inline \example pages into separate .qdoc files
-fixed broken links to paths
-moved ui-components under examples/quick

Change-Id: I6e009b9213be3e1f4bed51bdbeb76a7a2142c80b
Reviewed-by: Martin Smith <martin.smith@digia.com>

92 files changed, 3511 insertions, 720 deletions

diff --git a/examples/demos/calqlatr/calqlatr.qdoc b/examples/demos/calqlatr/doc/src/calqlatr.qdoc
index 3e0e1f1eb0..3e0e1f1eb0 100644
--- a/examples/demos/calqlatr/calqlatr.qdoc
+++ b/examples/demos/calqlatr/doc/src/calqlatr.qdoc
diff --git a/examples/demos/clocks/clocks.qdoc b/examples/localstorage/doc/src/localstorage.qdoc
index 54479bae17..3fdf233931 100644
--- a/examples/demos/clocks/clocks.qdoc
+++ b/examples/localstorage/doc/src/localstorage.qdoc
@@ -24,14 +24,15 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-
 /*!
-    \title QML Demo - Clocks
-    \example demos/clocks
-    \brief This example demonstrates creating components and using them multiple times.
-    \image qml-clocks-example.png
+    \title QtQuick Examples - Local Storage
+    \example localstorage
+    \brief This is a collection of QML local storage examples
+    \image qml-localstorage-example.png
+
+    This is a collection of small QML examples relating to local storage functionality.
 
-    This demo give a simple world clock application, containing multiple clocks from around the world.
+    Hello World demos creating a simple SQL table and how to do inserting/selecting operations.
 
-    In doing this, it reuses a signle Clock component with some slight changes to the parameters.
 */
+
diff --git a/examples/localstorage/localstorage.qml b/examples/localstorage/localstorage.qml
new file mode 100644
index 0000000000..a4d6d85376
--- /dev/null
+++ b/examples/localstorage/localstorage.qml
@@ -0,0 +1,54 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import "../shared" as Examples
+
+Item {
+    height: 480
+    width: 320
+    Examples.LauncherList {
+        id: ll
+        anchors.fill: parent
+        Component.onCompleted: {
+            addExample("Hello World", "Simple SQL operations with local storage API",  Qt.resolvedUrl("hello.qml"));
+        }
+    }
+}
diff --git a/examples/localstorage/localstorage/localstorage.qml b/examples/localstorage/localstorage/localstorage.qml
index f492b65e0b..f8ef50a776 100644
--- a/examples/localstorage/localstorage/localstorage.qml
+++ b/examples/localstorage/localstorage/localstorage.qml
@@ -1,4 +1,4 @@
-/****************************************************************************
+ /****************************************************************************
 **
 ** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
 ** Contact: http://www.qt-project.org/
@@ -41,18 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - Local Storage
-    \example localstorage
-    \brief This is a collection of QML local storage examples
-    \image qml-localstorage-example.png
-
-    This is a collection of small QML examples relating to local storage functionality.
-
-    Hello World demos creating a simple SQL table and how to do inserting/selecting operations.
-
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/particles/affectors/affectors.qml b/examples/particles/affectors/affectors.qml
index 08f1dfe1a0..5e031dd971 100644
--- a/examples/particles/affectors/affectors.qml
+++ b/examples/particles/affectors/affectors.qml
@@ -41,92 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick.Particles Examples - Affectors
-    \example particles/affectors
-    \brief This is a collection of examples using Affectors in the QML particle system.
-    \image qml-affectors-example.png
-
-    This is a collection of small QML examples relating to using Affectors in the particle system.
-    Each example is a small QML file emphasizing a particular element or feature.
-
-    Age demonstrates using an Age affector to prematurely end the lives of particles.
-    \snippet examples/particles/affectors/content/age.qml 0
-
-    As you move the affector around the screen, the particles inside it
-    (which haven't already been affected) jump to a period near the end
-    of their life. This gives them a short period to finish fading out,
-    but changing lifeLeft to 0 (the default), would cause them to reach
-    the end of their life instantly.
-
-    Attractor demonstrates using an Attractor affector to simulate a black hole
-    \snippet examples/particles/affectors/content/attractor.qml 0
-
-    All particles in the scene, including the rocket ship's exhaust and pellets, are pulled
-    towards the black hole. This effect is stronger closer to the black hole, so the
-    asteroids near the top of the screen are barely affected at all, while the ones
-    towards the middle sometimes curve drastically. To complete the effect, an Age
-    affector covers the black hole to destroy particles which come in contact with it.
-
-    Custom Affector manipulates the properties of the particles directly in javascript.
-    One Affector is used to make the leaves rock back and forth as they fall, looking more
-    leaf-like than just spinning in circles:
-    \snippet examples/particles/affectors/content/customaffector.qml 0
-    Another is used to provide a slightly varying friction to the leaves as they 'land',
-    to look more natural:
-    \snippet examples/particles/affectors/content/customaffector.qml 1
-
-    Friction is similar to the falling leaves in the custom affector, except that it uses a
-    flat friction the whole way down instead of custom affectors.
-    \snippet examples/particles/affectors/content/friction.qml 0
-
-    Gravity is a convenience affector for applying a constant acceleration to particles inside it
-    \snippet examples/particles/affectors/content/gravity.qml 0
-
-    GroupGoal sets up two particle groups for flaming and non-flaming balls, and gives you various
-    ways to transition between them.
-    \snippet examples/particles/affectors/content/groupgoal.qml unlit
-    The non-flaming balls have a one in a hundred chance of lighting on their own each second, but they also
-    have a GroupGoal set on the whole group. This affector affects all particles of the unlit group, when colliding
-    with particles in the lit group, and cause them to move to the lighting group.
-    \snippet examples/particles/affectors/content/groupgoal.qml lighting
-    lighting is an intermediate group so that the glow builds up and the transition is less jarring. So it automatically
-    moves into the lit group after 100ms.
-    \snippet examples/particles/affectors/content/groupgoal.qml lit
-    The lit group also has TrailEmitters on it for additional fire and smoke, but does not transition anywhere.
-    There are two more GroupGoal elements that allow particles in the unlit group to transition to the lighting group
-    (and then to the lit group).
-    \snippet examples/particles/affectors/content/groupgoal.qml groupgoal-pilot
-    The first is just an area bound to the location of an image of a pilot flame. When unlit balls pass through the flame,
-    they go straight to lit because the pilot flame is so hot.
-    \snippet examples/particles/affectors/content/groupgoal.qml groupgoal-ma
-    The second is bound to the location of the last pointer interaction, so that touching or clicking on unlit balls (which
-    is hard due to their constant movement) causes them to move to the lighting group.
-
-    Move shows some simple effects you can get by altering trajectory midway.
-    The red particles have an affector that affects their position, jumping them forwards by 120px.
-    \snippet examples/particles/affectors/content/move.qml A
-    The green particles have an affector that affects their velocity, but with some angle variation. By adding some random direction
-    velocity to their existing forwards velocity, they begin to spray off in a cone.
-    \snippet examples/particles/affectors/content/move.qml B
-    The blue particles have an affector that affects their acceleration, and because it sets relative to false this resets the acceleration instead of
-    adding to it. Once the blue particles reach the affector, their horizontal velocity stops increasing as their vertical velocity decreases.
-    \snippet examples/particles/affectors/content/move.qml C
-
-    SpriteGoal has an affector which interacts with the sprite engine of particles, if they are being drawn as sprites by ImageParticle.
-    \snippet examples/particles/affectors/content/spritegoal.qml 0
-    The SpriteGoal follows the image of the rocket ship on screen, and when it interacts with particles drawn by ImageParticle as sprites,
-    it instructs them to move immediately to the "explode" state, which in this case is the animation of the asteroid breaking into many pieces.
-
-    Turbulence has a flame with smoke, and both sets of particles being affected by a Turbulence affector. This gives a faint wind effect.
-    \snippet examples/particles/affectors/content/turbulence.qml 0
-    To make the wind change direction, subsitute a black and white noise image in the noiseSource parameter (it currently uses a default noise source).
-
-    Wander uses a Wander affector to add some horizontal drift to snowflakes as they fall down.
-    \snippet examples/particles/affectors/content/wander.qml 0
-    There are different movements given by applying the Wander to different attributes of the trajectory, so the example makes it easy to play around and see the difference.
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/particles/affectors/doc/src/affectors.qdoc b/examples/particles/affectors/doc/src/affectors.qdoc
new file mode 100644
index 0000000000..9f653fc1f1
--- /dev/null
+++ b/examples/particles/affectors/doc/src/affectors.qdoc
@@ -0,0 +1,113 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title QtQuick.Particles Examples - Affectors
+    \example particles/affectors
+    \brief This is a collection of examples using Affectors in the QML particle system.
+    \image qml-affectors-example.png
+
+    This is a collection of small QML examples relating to using Affectors in the particle system.
+    Each example is a small QML file emphasizing a particular element or feature.
+
+    Age demonstrates using an Age affector to prematurely end the lives of particles.
+    \snippet examples/particles/affectors/content/age.qml 0
+
+    As you move the affector around the screen, the particles inside it
+    (which haven't already been affected) jump to a period near the end
+    of their life. This gives them a short period to finish fading out,
+    but changing lifeLeft to 0 (the default), would cause them to reach
+    the end of their life instantly.
+
+    Attractor demonstrates using an Attractor affector to simulate a black hole
+    \snippet examples/particles/affectors/content/attractor.qml 0
+
+    All particles in the scene, including the rocket ship's exhaust and pellets, are pulled
+    towards the black hole. This effect is stronger closer to the black hole, so the
+    asteroids near the top of the screen are barely affected at all, while the ones
+    towards the middle sometimes curve drastically. To complete the effect, an Age
+    affector covers the black hole to destroy particles which come in contact with it.
+
+    Custom Affector manipulates the properties of the particles directly in javascript.
+    One Affector is used to make the leaves rock back and forth as they fall, looking more
+    leaf-like than just spinning in circles:
+    \snippet examples/particles/affectors/content/customaffector.qml 0
+    Another is used to provide a slightly varying friction to the leaves as they 'land',
+    to look more natural:
+    \snippet examples/particles/affectors/content/customaffector.qml 1
+
+    Friction is similar to the falling leaves in the custom affector, except that it uses a
+    flat friction the whole way down instead of custom affectors.
+    \snippet examples/particles/affectors/content/friction.qml 0
+
+    Gravity is a convenience affector for applying a constant acceleration to particles inside it
+    \snippet examples/particles/affectors/content/gravity.qml 0
+
+    GroupGoal sets up two particle groups for flaming and non-flaming balls, and gives you various
+    ways to transition between them.
+    \snippet examples/particles/affectors/content/groupgoal.qml unlit
+    The non-flaming balls have a one in a hundred chance of lighting on their own each second, but they also
+    have a GroupGoal set on the whole group. This affector affects all particles of the unlit group, when colliding
+    with particles in the lit group, and cause them to move to the lighting group.
+    \snippet examples/particles/affectors/content/groupgoal.qml lighting
+    lighting is an intermediate group so that the glow builds up and the transition is less jarring. So it automatically
+    moves into the lit group after 100ms.
+    \snippet examples/particles/affectors/content/groupgoal.qml lit
+    The lit group also has TrailEmitters on it for additional fire and smoke, but does not transition anywhere.
+    There are two more GroupGoal elements that allow particles in the unlit group to transition to the lighting group
+    (and then to the lit group).
+    \snippet examples/particles/affectors/content/groupgoal.qml groupgoal-pilot
+    The first is just an area bound to the location of an image of a pilot flame. When unlit balls pass through the flame,
+    they go straight to lit because the pilot flame is so hot.
+    \snippet examples/particles/affectors/content/groupgoal.qml groupgoal-ma
+    The second is bound to the location of the last pointer interaction, so that touching or clicking on unlit balls (which
+    is hard due to their constant movement) causes them to move to the lighting group.
+
+    Move shows some simple effects you can get by altering trajectory midway.
+    The red particles have an affector that affects their position, jumping them forwards by 120px.
+    \snippet examples/particles/affectors/content/move.qml A
+    The green particles have an affector that affects their velocity, but with some angle variation. By adding some random direction
+    velocity to their existing forwards velocity, they begin to spray off in a cone.
+    \snippet examples/particles/affectors/content/move.qml B
+    The blue particles have an affector that affects their acceleration, and because it sets relative to false this resets the acceleration instead of
+    adding to it. Once the blue particles reach the affector, their horizontal velocity stops increasing as their vertical velocity decreases.
+    \snippet examples/particles/affectors/content/move.qml C
+
+    SpriteGoal has an affector which interacts with the sprite engine of particles, if they are being drawn as sprites by ImageParticle.
+    \snippet examples/particles/affectors/content/spritegoal.qml 0
+    The SpriteGoal follows the image of the rocket ship on screen, and when it interacts with particles drawn by ImageParticle as sprites,
+    it instructs them to move immediately to the "explode" state, which in this case is the animation of the asteroid breaking into many pieces.
+
+    Turbulence has a flame with smoke, and both sets of particles being affected by a Turbulence affector. This gives a faint wind effect.
+    \snippet examples/particles/affectors/content/turbulence.qml 0
+    To make the wind change direction, subsitute a black and white noise image in the noiseSource parameter (it currently uses a default noise source).
+
+    Wander uses a Wander affector to add some horizontal drift to snowflakes as they fall down.
+    \snippet examples/particles/affectors/content/wander.qml 0
+    There are different movements given by applying the Wander to different attributes of the trajectory, so the example makes it easy to play around and see the difference.
+*/
+
diff --git a/examples/particles/customparticle/customparticle.qml b/examples/particles/customparticle/customparticle.qml
index eb4f772e97..694dfb0fc6 100644
--- a/examples/particles/customparticle/customparticle.qml
+++ b/examples/particles/customparticle/customparticle.qml
@@ -41,34 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick.Particles Examples - CustomParticle
-    \example particles/customparticle
-    \brief This is a collection of examples using CustomParticle in the QML particle system.
-    \image qml-customparticle-example.png
-
-    This is a collection of small QML examples relating to using CustomParticle in the particle system.
-    Each example is a small QML file emphasizing a different way to use CustomParticle.
-
-    Blur Particles adds a blur effect to the particles, which increases over the particle's life time.
-    It uses a custom vertex shader:
-    \snippet examples/particles/customparticle/content/blurparticles.qml vertex
-    to propagate life time simulation to a custom fragment shader:
-    \snippet examples/particles/customparticle/content/blurparticles.qml fragment
-    which has access to both the normal image sampler and a blurred sampler, the image plus a ShaderEffect.
-
-    Fragment Shader just uses the particle system as a vertex delivery system.
-    \snippet examples/particles/customparticle/content/fragmentshader.qml 0
-
-    Image Colors uses CustomParticle to assign colors to particles based on their location in a picture.
-    The vertex shader,
-    \snippet examples/particles/customparticle/content/imagecolors.qml vertex
-    passes along the starting position for each vertex to the fragment shader,
-    \snippet examples/particles/customparticle/content/imagecolors.qml fragment
-    which uses it to determine the color for that particle.
-
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/particles/customparticle/doc/src/customparticle.qdoc b/examples/particles/customparticle/doc/src/customparticle.qdoc
new file mode 100644
index 0000000000..8faaf4b8c7
--- /dev/null
+++ b/examples/particles/customparticle/doc/src/customparticle.qdoc
@@ -0,0 +1,54 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title QtQuick.Particles Examples - CustomParticle
+    \example particles/customparticle
+    \brief This is a collection of examples using CustomParticle in the QML particle system.
+    \image qml-customparticle-example.png
+
+    This is a collection of small QML examples relating to using CustomParticle in the particle system.
+    Each example is a small QML file emphasizing a different way to use CustomParticle.
+
+    Blur Particles adds a blur effect to the particles, which increases over the particle's life time.
+    It uses a custom vertex shader:
+    \snippet examples/particles/customparticle/content/blurparticles.qml vertex
+    to propagate life time simulation to a custom fragement shader:
+    \snippet examples/particles/customparticle/content/blurparticles.qml fragment
+    which has access to both the normal image sampler and a blurred sampler, the image plus a ShaderEffect.
+
+    Fragment Shader just uses the particle system as a vertex delivery system.
+    \snippet examples/particles/customparticle/content/fragmentshader.qml 0
+
+    Image Colors uses CustomParticle to assign colors to particles based on their location in a picture.
+    The vertex shader,
+    \snippet examples/particles/customparticle/content/imagecolors.qml vertex
+    passes along the starting position for each vertex to the fragment shader,
+    \snippet examples/particles/customparticle/content/imagecolors.qml fragment
+    which uses it to determine the color for that particle.
+
+*/
diff --git a/examples/particles/emitters/doc/src/emitters.qdoc b/examples/particles/emitters/doc/src/emitters.qdoc
new file mode 100644
index 0000000000..f6a9fd3db4
--- /dev/null
+++ b/examples/particles/emitters/doc/src/emitters.qdoc
@@ -0,0 +1,60 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QtQuick.Particles Examples - Emitters
+    \example particles/emitters
+    \brief This is a collection of examples using Emitters in the QML particle system.
+    \image qml-emitters-example.png
+
+    This is a collection of small QML examples relating to using Emitters in the particle system.
+    Each example is a small QML file emphasizing a particular element or feature.
+
+    Velocity from motion gives the effect of strong particle motion through primarily moving the emitters:
+    \snippet examples/particles/emitters/content/velocityfrommotion.qml 0
+
+    Burst and pulse calls the burst and pulse methods on two idential emitters.
+    \snippet examples/particles/emitters/content/burstandpulse.qml 0
+    Note how burst takes an argument of number of particles to emit, and pulse takes an argument of number of milliseconds to emit for.
+    This gives a slightly different behaviour, which is easy to see in this example.
+
+    Custom Emitter connects to the emitParticles signal to set arbitrary values on particle data as they're emitted;
+    \snippet examples/particles/emitters/content/customemitter.qml 0
+    This is used to emit curving particles in six rotating spokes.
+
+    Emit mask sets an image mask on the Emitter, to emit out of an arbitrary shape.
+    \snippet examples/particles/emitters/content/emitmask.qml 0
+
+    Maximum emitted emits no more than a certain number of particles at a time. This example makes it easy to see what happens when the limit is reached.
+
+    Shape and Direction emits particles out of an unfilled Ellipse shape, using a TargetDirection
+    \snippet examples/particles/emitters/content/shapeanddirection.qml 0
+    This sends the particles towards the center of the ellipse with proportional speed, keeping the ellipse outline as they move to the center.
+
+    TrailEmitter uses that element to add smoke particles to trail the fire particles in the scene.
+    \snippet examples/particles/emitters/content/trailemitter.qml 0
+
+*/
diff --git a/examples/particles/emitters/emitters.qml b/examples/particles/emitters/emitters.qml
index d6537569cf..75e77e5d4f 100644
--- a/examples/particles/emitters/emitters.qml
+++ b/examples/particles/emitters/emitters.qml
@@ -41,41 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick.Particles Examples - Emitters
-    \example particles/emitters
-    \brief This is a collection of examples using Emitters in the QML particle system.
-    \image qml-emitters-example.png
-
-    This is a collection of small QML examples relating to using Emitters in the particle system.
-    Each example is a small QML file emphasizing a particular element or feature.
-
-    Velocity from motion gives the effect of strong particle motion through primarily moving the emitters:
-    \snippet examples/particles/emitters/content/velocityfrommotion.qml 0
-
-    Burst and pulse calls the burst and pulse methods on two idential emitters.
-    \snippet examples/particles/emitters/content/burstandpulse.qml 0
-    Note how burst takes an argument of number of particles to emit, and pulse takes an argument of number of milliseconds to emit for.
-    This gives a slightly different behaviour, which is easy to see in this example.
-
-    Custom Emitter connects to the emitParticles signal to set arbitrary values on particle data as they're emitted;
-    \snippet examples/particles/emitters/content/customemitter.qml 0
-    This is used to emit curving particles in six rotating spokes.
-
-    Emit mask sets an image mask on the Emitter, to emit out of an arbitrary shape.
-    \snippet examples/particles/emitters/content/emitmask.qml 0
-
-    Maximum emitted emits no more than a certain number of particles at a time. This example makes it easy to see what happens when the limit is reached.
-
-    Shape and Direction emits particles out of an unfilled Ellipse shape, using a TargetDirection
-    \snippet examples/particles/emitters/content/shapeanddirection.qml 0
-    This sends the particles towards the center of the ellipse with proportional speed, keeping the ellipse outline as they move to the center.
-
-    TrailEmitter uses that element to add smoke particles to trail the fire particles in the scene.
-    \snippet examples/particles/emitters/content/trailemitter.qml 0
-
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/particles/imageparticle/doc/src/imageparticle.qdoc b/examples/particles/imageparticle/doc/src/imageparticle.qdoc
new file mode 100644
index 0000000000..d74db05e5f
--- /dev/null
+++ b/examples/particles/imageparticle/doc/src/imageparticle.qdoc
@@ -0,0 +1,62 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title QtQuick.Particles Examples - Affectors
+    \example particles/imageparticle
+    \brief This is a collection of examples using Affectors in the QML particle system.
+    \image qml-imageparticle-example.png
+
+    This is a collection of small QML examples relating to using Affectors in the particle system.
+    Each example is a small QML file emphasizing a particular element or feature.
+
+    All at once shows off several of the features of ImageParticle at the same time.
+    \snippet examples/particles/imageparticle/content/allatonce.qml 0
+
+    Colored shows a simple ImageParticle with some color variation.
+    \snippet examples/particles/imageparticle/content/colored.qml 0
+
+    Color Table sets the color over life on the particles to provide a fixed rainbow effect.
+    \snippet examples/particles/imageparticle/content/colortable.qml 0
+
+    Deformation spins and squishes a starfish particle.
+    \snippet examples/particles/imageparticle/content/colortable.qml spin
+    \snippet examples/particles/imageparticle/content/colortable.qml deform
+
+    Rotation demonstrates the autoRotate property, so that particles rotate in the direction that they travel.
+
+    Sharing demonstrates what happens when multiple ImageParticles try to render the same particle.
+    The following ImageParticle renders the particles inside the ListView:
+    \snippet examples/particles/imageparticle/content/sharing.qml 0
+    The following ImageParticle is placed inside the list highlight, and renders the particles above the other ImageParticle.
+    \snippet examples/particles/imageparticle/content/sharing.qml 1
+    Note that because it sets the color and alpha in this ImageParticle, it renders the particles in a different color.
+    Since it doesn't specify anything about the rotation, it shares the rotation with the other ImageParticle so that the flowers are rotated the same way in both.
+    Note that you can undo rotation in another ImageParticle, you just need to explicity set rotationVariation to 0.
+
+    Sprites demonstrates using an image particle to render animated sprites instead of static images for each particle.
+*/
diff --git a/examples/particles/imageparticle/imageparticle.qml b/examples/particles/imageparticle/imageparticle.qml
index 0635fd7010..c6caa1c29c 100644
--- a/examples/particles/imageparticle/imageparticle.qml
+++ b/examples/particles/imageparticle/imageparticle.qml
@@ -41,42 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick.Particles Examples - Affectors
-    \example particles/imageparticle
-    \brief This is a collection of examples using Affectors in the QML particle system.
-    \image qml-imageparticle-example.png
-
-    This is a collection of small QML examples relating to using Affectors in the particle system.
-    Each example is a small QML file emphasizing a particular element or feature.
-
-    All at once shows off several of the features of ImageParticle at the same time.
-    \snippet examples/particles/imageparticle/content/allatonce.qml 0
-
-    Colored shows a simple ImageParticle with some color variation.
-    \snippet examples/particles/imageparticle/content/colored.qml 0
-
-    Color Table sets the color over life on the particles to provide a fixed rainbow effect.
-    \snippet examples/particles/imageparticle/content/colortable.qml 0
-
-    Deformation spins and squishes a starfish particle.
-    \snippet examples/particles/imageparticle/content/colortable.qml spin
-    \snippet examples/particles/imageparticle/content/colortable.qml deform
-
-    Rotation demonstrates the autoRotate property, so that particles rotate in the direction that they travel.
-
-    Sharing demonstrates what happens when multiple ImageParticles try to render the same particle.
-    The following ImageParticle renders the particles inside the ListView:
-    \snippet examples/particles/imageparticle/content/sharing.qml 0
-    The following ImageParticle is placed inside the list highlight, and renders the particles above the other ImageParticle.
-    \snippet examples/particles/imageparticle/content/sharing.qml 1
-    Note that because it sets the color and alpha in this ImageParticle, it renders the particles in a different color.
-    Since it doesn't specify anything about the rotation, it shares the rotation with the other ImageParticle so that the flowers are rotated the same way in both.
-    Note that you can undo rotation in another ImageParticle, you just need to explicitly set rotationVariation to 0.
-
-    Sprites demonstrates using an image particle to render animated sprites instead of static images for each particle.
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/particles/system/doc/src/system.qdoc b/examples/particles/system/doc/src/system.qdoc
new file mode 100644
index 0000000000..a52bd0d55c
--- /dev/null
+++ b/examples/particles/system/doc/src/system.qdoc
@@ -0,0 +1,59 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title QtQuick.Particles Examples - Affectors
+    \example particles/system
+    \brief This is a collection of examples using Affectors in the QML particle system.
+    \image qml-system-example.png
+
+    This is a collection of small QML examples relating to using Affectors in the particle system.
+    Each example is a small QML file emphasizing a particular element or feature.
+
+    Dynamic comparison compares using the particle system to getting a similar effect with the following code that dynamically instantiates Image elements.
+    \snippet examples/particles/system/content/dynamiccomparison.qml fake
+    Note how the Image elements are not able to be randomly colorized.
+
+    Start and Stop simply sets the running and paused states of a ParticleSystem. While the system does not perform any simulation when stopped or paused, a restart restarts the simulation from the beginning, while unpausing resumes the simulation from where it was.
+
+    Timed group changes is an example that highlights the ParticleGroup element. While normally referring to groups with a string name is sufficent, additional effects can be
+    done by setting properties on groups.
+    The first group has a variable duration on it, but always transitions to the second group.
+    \snippet examples/particles/system/content/timedgroupchanges.qml 0
+    The second group has a TrailEmitter on it, and a fixed duration for emitting into the third group. By placing the TrailEmitter as a direct child of the ParticleGroup, it automatically selects that group to follow.
+    \snippet examples/particles/system/content/timedgroupchanges.qml 1
+    The third group has an Affector as a direct child, which makes the affector automatically target this group. The affector means that as soon as particles enter this group, a burst function can be called on another emitter, using the x,y positions of this particle.
+    \snippet examples/particles/system/content/timedgroupchanges.qml 2
+
+    If TrailEmitter does not suit your needs for multiple emitters, you can also dynamically create Emitters while still using the same ParticleSystem and image particle
+    \snippet examples/particles/system/content/dynamicemitters.qml 0
+    Note that this effect, a flurry of flying rainbow spears, would be better served with TrailEmitter. It is only done with dynamic emitters in this example to show the concept more simply.
+
+    Multiple Painters shows how to control paint ordering of individual particles. While the paint ordering of particles within one ImagePainter is not strictly defined, ImageParticle elements follow the normal Z-ordering rules for QtQuick items. This example allow you to paint the inside of the particles above the black borders using a pair of ImageParticles each painting different parts of the same logical particle.
+
+*/
+
diff --git a/examples/particles/system/system.qml b/examples/particles/system/system.qml
index 2177f60987..ccf147e410 100644
--- a/examples/particles/system/system.qml
+++ b/examples/particles/system/system.qml
@@ -41,38 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick.Particles Examples - Affectors
-    \example particles/system
-    \brief This is a collection of examples using Affectors in the QML particle system.
-    \image qml-system-example.png
-
-    This is a collection of small QML examples relating to using Affectors in the particle system.
-    Each example is a small QML file emphasizing a particular element or feature.
-
-    Dynamic comparison compares using the particle system to getting a similar effect with the following code that dynamically instantiates Image elements.
-    \snippet examples/particles/system/content/dynamiccomparison.qml fake
-    Note how the Image elements are not able to be randomly colorized.
-
-    Start and Stop simply sets the running and paused states of a ParticleSystem. While the system does not perform any simulation when stopped or paused, a restart restarts the simulation from the beginning, while unpausing resumes the simulation from where it was.
-
-    Timed group changes is an example that highlights the ParticleGroup element. While normally referring to groups with a string name is sufficient, additional effects can be
-    done by setting properties on groups.
-    The first group has a variable duration on it, but always transitions to the second group.
-    \snippet examples/particles/system/content/timedgroupchanges.qml 0
-    The second group has a TrailEmitter on it, and a fixed duration for emitting into the third group. By placing the TrailEmitter as a direct child of the ParticleGroup, it automatically selects that group to follow.
-    \snippet examples/particles/system/content/timedgroupchanges.qml 1
-    The third group has an Affector as a direct child, which makes the affector automatically target this group. The affector means that as soon as particles enter this group, a burst function can be called on another emitter, using the x,y positions of this particle.
-    \snippet examples/particles/system/content/timedgroupchanges.qml 2
-
-    If TrailEmitter does not suit your needs for multiple emitters, you can also dynamically create Emitters while still using the same ParticleSystem and image particle
-    \snippet examples/particles/system/content/dynamicemitters.qml 0
-    Note that this effect, a flurry of flying rainbow spears, would be better served with TrailEmitter. It is only done with dynamic emitters in this example to show the concept more simply.
-
-    Multiple Painters shows how to control paint ordering of individual particles. While the paint ordering of particles within one ImagePainter is not strictly defined, ImageParticle elements follow the normal Z-ordering rules for QtQuick items. This example allow you to paint the inside of the particles above the black borders using a pair of ImageParticles each painting different parts of the same logical particle.
-
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/demos/samegame/samegame.qdoc b/examples/qml/dynamicscene/doc/src/dynamicscene.qdoc
index 7a311600c6..53a19e0561 100644
--- a/examples/demos/samegame/samegame.qdoc
+++ b/examples/qml/dynamicscene/doc/src/dynamicscene.qdoc
@@ -24,15 +24,11 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-
 /*!
-    \title QML Demo - SameGame
-    \example demos/samegame
-    \brief This is an example game written in QML.
-    \image qml-samegame-demo-small.png
-
-    The SameGame demo implements a simple game in QML. It is written for desktop and portrait devices.
-
-    This game has the logic implemented in Javascipt and the appearance implemented in QML.
+    \title QML Example - Dynamic Scene
+    \example qml/dynamicscene
+    \brief This example demonstrates creating components dynamically.
+    \image qml-dynamicscene-example.png
 */
 
+
diff --git a/examples/qml/dynamicscene/dynamicscene.qml b/examples/qml/dynamicscene/dynamicscene.qml
index 4771742621..66521b8caa 100644
--- a/examples/qml/dynamicscene/dynamicscene.qml
+++ b/examples/qml/dynamicscene/dynamicscene.qml
@@ -38,13 +38,6 @@
 **
 ****************************************************************************/
 
-/*!
-    \title QML Example - Dynamic Scene
-    \example qml/dynamicscene
-    \brief This example demonstrates creating components dynamically.
-    \image qml-dynamicscene-example.png
-*/
-
 import QtQuick 2.0
 import QtQuick.Particles 2.0
 import "content"
diff --git a/examples/qml/i18n/doc/src/i18n.qdoc b/examples/qml/i18n/doc/src/i18n.qdoc
new file mode 100644
index 0000000000..d9f3eaaf58
--- /dev/null
+++ b/examples/qml/i18n/doc/src/i18n.qdoc
@@ -0,0 +1,48 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QML Examples - Internationalization
+    \example qml/i18n
+    \image qml-i18n-example.png
+    \brief This is an internationalization example
+
+ The QML runtime automatically loads a translation from the i18n subdirectory of the root
+ QML file, based on the system language.
+
+ The files are created/updated by running:
+
+   lupdate i18n.qml -ts i18n/base.ts
+
+ Translations for new languages are created by copying i18n/base.ts to i18n/qml_<lang>.ts
+ The .ts files can then be edited with Linguist:
+
+   linguist i18n/qml_fr.ts
+
+ The run-time translation files are then generated by running:
+
+   lrelease i18n/*.ts
+*/
diff --git a/examples/qml/i18n/i18n.qml b/examples/qml/i18n/i18n.qml
index 2ffdd1914f..b924fb07c9 100644
--- a/examples/qml/i18n/i18n.qml
+++ b/examples/qml/i18n/i18n.qml
@@ -40,30 +40,6 @@
 
 import QtQuick 2.0
 
-/*!
-    \title QML Examples - Internationalization
-    \example qml/i18n
-    \image qml-i18n-example.png
-    \brief This is an internationalization example
-
- The QML runtime automatically loads a translation from the i18n subdirectory of the root
- QML file, based on the system language.
-
- The files are created/updated by running:
-
-   lupdate i18n.qml -ts i18n/base.ts
-
- Translations for new languages are created by copying i18n/base.ts to i18n/qml_<lang>.ts
- The .ts files can then be edited with Linguist:
-
-   linguist i18n/qml_fr.ts
-
- The run-time translation files are then generated by running:
-
-   lrelease i18n/*.ts
-*/
-
-
 Rectangle {
     width: 640; height: 480
 
diff --git a/examples/demos/stocqt/stocqt.qdoc b/examples/qml/xmlhttprequest/doc/src/xmlhttprequest.qdoc
index eb03c073de..ae76c28d16 100644
--- a/examples/demos/stocqt/stocqt.qdoc
+++ b/examples/qml/xmlhttprequest/doc/src/xmlhttprequest.qdoc
@@ -24,16 +24,15 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-
 /*!
-    \title QML Demo - StocQt
-    \example demos/StocQt
-    \brief This is an example stock chart viewer written in QML.
-    \image qml-stocqt-demo-small.png
+    \title QtQuick Examples - XMLHttpRequst
+    \example qml/xmlhttprequest
+    \brief This is a collection of XMLHttpRequest examples
+    \image qml-xmlhttprequest-example.png
+
+    This is a collection of small QML examples relating to XML HTTP request functionality.
 
-    This demo implements a simple stock chart viewer, designed for portrait devices.
+    Get data demos sending get XML request and showing the received header and XML body.
 
-    This app requests online data, which it processes in javascript. It then paints a chart depiction of the data using
-    the Canvas imperative drawing API.
 */
 
diff --git a/examples/qml/xmlhttprequest/xmlhttprequest.qml b/examples/qml/xmlhttprequest/xmlhttprequest.qml
index efe7d428db..5f950adc52 100644
--- a/examples/qml/xmlhttprequest/xmlhttprequest.qml
+++ b/examples/qml/xmlhttprequest/xmlhttprequest.qml
@@ -41,18 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - XMLHttpRequst
-    \example qtquick/xmlhttprequest
-    \brief This is a collection of XMLHttpRequest examples
-    \image qml-xmlhttprequest-example.png
-
-    This is a collection of small QML examples relating to XML HTTP request functionality.
-
-    Get data demos sending get XML request and showing the received header and XML body.
-
-*/
-
 Item {
     height: 480
     width: 320
@@ -63,4 +51,4 @@ Item {
             addExample("Get data", "Send get request and show received header and body",  Qt.resolvedUrl("get.qml"));
         }
     }
-}
\ No newline at end of file
+}
diff --git a/examples/quick/accessibility/accessibility.qml b/examples/quick/accessibility/accessibility.qml
index b8e929e007..7e3986bda4 100644
--- a/examples/quick/accessibility/accessibility.qml
+++ b/examples/quick/accessibility/accessibility.qml
@@ -42,19 +42,6 @@
 import QtQuick 2.0
 import "content"
 
-/*!
-    \title QtQuick Examples - Accessibility
-    \example quick/accessibility
-    \brief This example has accessible buttons.
-
-    Elements in this example are augmented with meta-data for accessiblity systems.
-
-    For example, the button identifies itself and its functionality to the accessibility system:
-    \snippet examples/quick/accessibility/content/Button.qml button
-
-    As do Text elements inside the example:
-    \snippet examples/quick/accessibility/accessibility.qml text
-*/
 
 Rectangle {
     id: window
diff --git a/examples/quick/accessibility/doc/src/accessibility.qdoc b/examples/quick/accessibility/doc/src/accessibility.qdoc
new file mode 100644
index 0000000000..d7a005dd7c
--- /dev/null
+++ b/examples/quick/accessibility/doc/src/accessibility.qdoc
@@ -0,0 +1,40 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QtQuick Examples - Accessibility
+    \example quick/accessibility
+    \brief This example has accessible buttons.
+
+    Elements in this example are augmented with meta-data for accessiblity systems.
+
+    For example, the button identifies itself and its functionality to the accessibility system:
+    \snippet examples/quick/accessibility/content/Button.qml button
+
+    As do Text elements inside the example:
+    \snippet examples/quick/accessibility/accessibility.qml text
+*/
+
diff --git a/examples/quick/animation/animation.qml b/examples/quick/animation/animation.qml
index a6735efcc2..812da3a5d5 100644
--- a/examples/quick/animation/animation.qml
+++ b/examples/quick/animation/animation.qml
@@ -41,51 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - Animation
-    \example quick/animation
-    \brief This is a collection of QML Animation examples.
-    \image qml-animations-example.png
-
-    This is a collection of small QML examples relating to animation. Each example is
-    a small QML file emphasizing a particular element or feature.
-
-    ColorAnimation demonstrates using a color animation to fade a sky from day to night.
-    \snippet examples/quick/animation/basics/color-animation.qml 0
-
-    PropertyAnimation demonstrates using a number animation to bounce a circle up and down.
-    \snippet examples/quick/animation/basics/property-animation.qml 0
-
-    Behaviors demonstrates using behaviors to animate moving a rectangle to whereever you click.
-    \snippet examples/quick/animation/behaviors/behavior-example.qml 0
-
-    Wiggly Text demonstrates using more complex behaviors to animate and wiggle some text around as you drag it.
-    It does this by assigning a complex binding to each letter:
-    \snippet examples/quick/animation/behaviors/wigglytext.qml 0
-    Then, it uses behaviors to animate the movement on each letter:
-    \snippet examples/quick/animation/behaviors/wigglytext.qml 1
-
-    Tv Tennis demonstrates using more complex behaviors to get paddles following a ball for an infinite game.
-    Again a binding which depends on other values is applied to the position and a behavior provided the animation.
-    \snippet examples/quick/animation/behaviors/tvtennis.qml 0
-
-    Easing Curves shows off all the easing curves available in Qt Quick animations.
-
-    States demonstrates how the properties of an item can vary between states.
-    It defines several states:
-    \snippet examples/quick/animation/states/states.qml 0
-    Note that there is also the implicit 'base state' from properties set directly on elements.
-
-    Transitions takes the States example and animates the property changes by setting transitions:
-    \snippet examples/quick/animation/states/transitions.qml 0
-
-    PathAnimation animates an image along a beizer curve using a PathAnimation.
-    \snippet examples/quick/animation/pathanimation/pathanimation.qml 0
-
-    PathInterpolator animates an image along the same beizer curve, using a PathInterpolator instead.
-    \snippet examples/quick/animation/pathinterpolator/pathinterpolator.qml 0
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/quick/animation/doc/src/animation.qdoc b/examples/quick/animation/doc/src/animation.qdoc
new file mode 100644
index 0000000000..3e3e9e6d3f
--- /dev/null
+++ b/examples/quick/animation/doc/src/animation.qdoc
@@ -0,0 +1,71 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title QtQuick Examples - Animation
+    \example quick/animation
+    \brief This is a collection of QML Animation examples.
+    \image qml-animations-example.png
+
+    This is a collection of small QML examples relating to animation. Each example is
+    a small QML file emphasizing a particular element or feature.
+
+    ColorAnimation demonstrates using a color animation to fade a sky from day to night.
+    \snippet examples/quick/animation/basics/color-animation.qml 0
+
+    PropertyAnimation demonstrates using a number animation to bounce a circle up and down.
+    \snippet examples/quick/animation/basics/property-animation.qml 0
+
+    Behaviors demonstrates using behaviors to animate moving a rectangle to whereever you click.
+    \snippet examples/quick/animation/behaviors/behavior-example.qml 0
+
+    Wiggly Text demonstrates using more complex behaviors to animate and wiggle some text around as you drag it.
+    It does this by assigning a complex binding to each letter:
+    \snippet examples/quick/animation/behaviors/wigglytext.qml 0
+    Then, it uses behaviors to animate the movement on each letter:
+    \snippet examples/quick/animation/behaviors/wigglytext.qml 1
+
+    Tv Tennis demonstrates using more complex behaviors to get paddles following a ball for an infinite game.
+    Again a binding which depends on other values is applied to the position and a behavior provided the animation.
+    \snippet examples/quick/animation/behaviors/tvtennis.qml 0
+
+    Easing Curves shows off all the easing curves available in Qt Quick animations.
+
+    States demonstrates how the properties of an item can vary between states.
+    It defines several states:
+    \snippet examples/quick/animation/states/states.qml 0
+    Note that there is also the implicit 'base state' from properties set directly on elements.
+
+    Transitions takes the States example and animates the property changes by setting transitions:
+    \snippet examples/quick/animation/states/transitions.qml 0
+
+    PathAnimation animates an image along a beizer curve using a PathAnimation.
+    \snippet examples/quick/animation/pathanimation/pathanimation.qml 0
+
+    PathInterpolator animates an image along the same beizer curve, using a PathInterpolator instead.
+    \snippet examples/quick/animation/pathinterpolator/pathinterpolator.qml 0
+*/
diff --git a/examples/quick/canvas/canvas.qml b/examples/quick/canvas/canvas.qml
index afb6fbf74e..dc4e50c0f2 100644
--- a/examples/quick/canvas/canvas.qml
+++ b/examples/quick/canvas/canvas.qml
@@ -41,37 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - Canvas
-    \example quick/canvas
-    \brief This is a collection of QML Canvas examples.
-    \image qml-canvas-example.png
-
-    This is a collection of small QML examples relating to Canvas item. Each example is
-    a small QML file emphasizing a particular element or feature.
-
-    Red heart demonstrates using a bezierCurve API to stroke and fill a red heart.
-    \snippet examples/quick/canvas/bezierCurve/bezierCurve.qml 0
-
-    Talk bubble demonstrates using a quadraticCurveTo API to stroke and fill a customized talk bubble:
-    \snippet examples/quick/canvas/quadraticCurveTo/quadraticCurveTo.qml 0
-    This example also demonstrates the fillText API:
-    \snippet examples/quick/canvas/quadraticCurveTo/quadraticCurveTo.qml 1
-
-    Squircle demonstrates using a collection of simple moveTo/lineTo path APIs to draw a smooth squircle.
-
-    Rounded rectangle demonstrates using a collection if lineTo/arcTo path APIs to draw a rounded rectangle.
-
-    Smile face demonstrates using several complex path APIs to draw an fill a smile face.
-
-    Clip demonstrates using clip API to clip a given image.
-    \snippet examples/quick/canvas/clip/clip.qml 0
-
-    Tiger demonstrates using SVG path API to draw a tiger with a collection of SVG path strings.
-    \snippet examples/quick/canvas/tiger/tiger.qml 0
-
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/quick/canvas/doc/src/canvas.qdoc b/examples/quick/canvas/doc/src/canvas.qdoc
new file mode 100644
index 0000000000..87c07b614a
--- /dev/null
+++ b/examples/quick/canvas/doc/src/canvas.qdoc
@@ -0,0 +1,58 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title QtQuick Examples - Canvas
+    \example quick/canvas
+    \brief This is a collection of QML Canvas examples.
+    \image qml-canvas-example.png
+
+    This is a collection of small QML examples relating to Canvas item. Each example is
+    a small QML file emphasizing a particular element or feature.
+
+    Red heart demonstrates using a bezierCurve API to stroke and fill a red heart.
+    \snippet examples/quick/canvas/bezierCurve/bezierCurve.qml 0
+
+    Talk bubble demonstrates using a quadraticCurveTo API to stroke and fill a customized talk bubble:
+    \snippet examples/quick/canvas/quadraticCurveTo/quadraticCurveTo.qml 0
+    This example also demonstrates the fillText API:
+    \snippet examples/quick/canvas/quadraticCurveTo/quadraticCurveTo.qml 1
+
+    Squircle demonstrates using a collection of simple moveTo/lineTo path APIs to draw a smooth squircle.
+
+    Rounded rectangle demonstrates using a collection if lineTo/arcTo path APIs to draw a rounded rectangle.
+
+    Smile face demonstrates using several complex path APIs to draw an fill a smile face.
+
+    Clip demonstrates using clip API to clip a given image.
+    \snippet examples/quick/canvas/clip/clip.qml 0
+
+    Tiger demonstrates using SVG path API to draw a tiger with a collection of SVG path strings.
+    \snippet examples/quick/canvas/tiger/tiger.qml 0
+
+*/
+
diff --git a/examples/quick/customitems/painteditem/textballoons.qml b/examples/quick/customitems/painteditem/textballoons.qml
index d5151c9553..eec20f8c4b 100644
--- a/examples/quick/customitems/painteditem/textballoons.qml
+++ b/examples/quick/customitems/painteditem/textballoons.qml
@@ -42,11 +42,6 @@
 import QtQuick 2.0
 import TextBalloonPlugin 1.0
 
-/*!
-    \title QtQuick Examples - Painted Text Balloons
-    \example quick/painteditem/textballoons
-    \brief This is a simple example that draws text balloons using QPainter
-*/
 Item {
     height: 480
     width: 320
@@ -82,7 +77,7 @@ Item {
     //! [1]
     Rectangle {
         id: controls
- 
+
         anchors.bottom: parent.bottom
         anchors.left: parent.left
         anchors.margins: 1
diff --git a/examples/quick/draganddrop/doc/src/draganddrop.qdoc b/examples/quick/draganddrop/doc/src/draganddrop.qdoc
new file mode 100644
index 0000000000..6c4e878187
--- /dev/null
+++ b/examples/quick/draganddrop/doc/src/draganddrop.qdoc
@@ -0,0 +1,57 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QtQuick Examples - Drag and Drop
+    \example quick/draganddrop
+    \brief This is a collection of QML drag and drop examples
+    \image qml-draganddrop-example.png
+
+    This is a collection of small QML examples relating to drag and drop functionality.
+
+    \section2 Tiles adds drag and drop to simple rectangles, which you can drag into a specific grid.
+
+    It has a DragTile component which uses a MouseArea to move an item when dragged:
+
+    \snippet examples/quick/draganddrop/tiles/DragTile.qml 0
+    \snippet examples/quick/draganddrop/tiles/DragTile.qml 1
+
+    And a DropTile component which the dragged tiles can be dropped onto:
+
+    \snippet examples/quick/draganddrop/tiles/DropTile.qml 0
+
+    The keys property of the DropArea will only allow an item with matching key in
+    it's Drag.keys property to be dropped on it.
+
+    \section2 GridView adds drag and drop to a GridView, allowing you to reorder the list.
+
+    It uses a VisualDataModel to move a delegate item to the position of another item
+    it is dragged over.
+
+    \snippet examples/quick/draganddrop/views/gridview.qml 0
+    \snippet examples/quick/draganddrop/views/gridview.qml 1
+*/
+
diff --git a/examples/quick/draganddrop/draganddrop.qml b/examples/quick/draganddrop/draganddrop.qml
index f30ca7d70f..0e75c96470 100644
--- a/examples/quick/draganddrop/draganddrop.qml
+++ b/examples/quick/draganddrop/draganddrop.qml
@@ -41,37 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - Drag and Drop
-    \example quick/draganddrop
-    \brief This is a collection of QML drag and drop examples
-    \image qml-draganddrop-example.png
-
-    This is a collection of small QML examples relating to drag and drop functionality.
-
-    \section2 Tiles adds drag and drop to simple rectangles, which you can drag into a specific grid.
-
-    It has a DragTile component which uses a MouseArea to move an item when dragged:
-
-    \snippet examples/quick/draganddrop/tiles/DragTile.qml 0
-    \snippet examples/quick/draganddrop/tiles/DragTile.qml 1
-
-    And a DropTile component which the dragged tiles can be dropped onto:
-
-    \snippet examples/quick/draganddrop/tiles/DropTile.qml 0
-
-    The keys property of the DropArea will only allow an item with matching key in
-    it's Drag.keys property to be dropped on it.
-
-    \section2 GridView adds drag and drop to a GridView, allowing you to reorder the list.
-
-    It uses a VisualDataModel to move a delegate item to the position of another item
-    it is dragged over.
-
-    \snippet examples/quick/draganddrop/views/gridview.qml 0
-    \snippet examples/quick/draganddrop/views/gridview.qml 1
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/quick/imageelements/doc/src/imageelements.qdoc b/examples/quick/imageelements/doc/src/imageelements.qdoc
new file mode 100644
index 0000000000..0dc626a94c
--- /dev/null
+++ b/examples/quick/imageelements/doc/src/imageelements.qdoc
@@ -0,0 +1,59 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QML Examples - Image Elements
+    \example quick/imageelements
+    \brief This is a collection of QML examples
+    \image qml-imageelements-example.png
+
+    This is a collection of small QML examples relating to image elements.
+
+    'BorderImage' shows off the various scaling modes of the BorderImage item
+    by setting its horizontalTileMode and verticalTileMode properties.
+
+    'Image' shows off the various fill modes of the Image item.
+
+    'Shadows' shows how to create a drop shadow effect for a rectangular item
+    using a BorderImage:
+    \snippet examples/quick/imageelements/content/ShadowRectangle.qml delegate
+
+    'AnimatedSprite' shows how to display a simple animation using an
+    AnimatedSprite element:
+    \snippet examples/quick/imageelements/animatedsprite.qml sprite
+    The sprite animation will loop 3 times.
+
+    'SpriteSequence' demonstrates using a sprite sequence to draw an animated
+    and interactive bear.
+    The SpriteSequence defines 5 different sprites. The bear is initially in
+    a 'still' state:
+    \snippet examples/quick/imageelements/spritesequence.qml still
+    When the scene is clicked, an animation sets the sprite sequence to the
+    'falling' states and animates the bear's y property.
+    \snippet examples/quick/imageelements/spritesequence.qml animation
+    At the end of the animation the bear is set back to its initial state.
+*/
+
diff --git a/examples/quick/imageelements/imageelements.qml b/examples/quick/imageelements/imageelements.qml
index 572715fe9a..86dcc37fbe 100644
--- a/examples/quick/imageelements/imageelements.qml
+++ b/examples/quick/imageelements/imageelements.qml
@@ -41,39 +41,6 @@
 import QtQuick 2.0
 import "../../shared"
 
-/*!
-    \title QML Examples - Image Elements
-    \example quick/imageelements
-    \brief This is a collection of QML examples
-    \image qml-imageelements-example.png
-
-    This is a collection of small QML examples relating to image elements.
-
-    'BorderImage' shows off the various scaling modes of the BorderImage item
-    by setting its horizontalTileMode and verticalTileMode properties.
-
-    'Image' shows off the various fill modes of the Image item.
-
-    'Shadows' shows how to create a drop shadow effect for a rectangular item
-    using a BorderImage:
-    \snippet examples/quick/imageelements/content/ShadowRectangle.qml delegate
-
-    'AnimatedSprite' shows how to display a simple animation using an
-    AnimatedSprite element:
-    \snippet examples/quick/imageelements/animatedsprite.qml sprite
-    The sprite animation will loop 3 times.
-
-    'SpriteSequence' demonstrates using a sprite sequence to draw an animated
-    and interactive bear.
-    The SpriteSequence defines 5 different sprites. The bear is initially in
-    a 'still' state:
-    \snippet examples/quick/imageelements/spritesequence.qml still
-    When the scene is clicked, an animation sets the sprite sequence to the
-    'falling' states and animates the bear's y property.
-    \snippet examples/quick/imageelements/spritesequence.qml animation
-    At the end of the animation the bear is set back to its initial state.
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc b/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc
new file mode 100644
index 0000000000..b529836843
--- /dev/null
+++ b/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc
@@ -0,0 +1,34 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QtQuick Examples - Key Interaction
+    \example quick/keyinteraction
+    \brief This is a collection of QML keyboard interaction examples.
+    \image qml-keyinteraction-example.png
+
+    This example demonstrates combining various methods of interacting with keyboard focus.
+*/
diff --git a/examples/quick/keyinteraction/keyinteraction.qml b/examples/quick/keyinteraction/keyinteraction.qml
index 546ba4cf05..6798491791 100644
--- a/examples/quick/keyinteraction/keyinteraction.qml
+++ b/examples/quick/keyinteraction/keyinteraction.qml
@@ -41,15 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - Key Interaction
-    \example quick/keyinteraction
-    \brief This is a collection of QML keyboard interaction examples.
-    \image qml-keyinteraction-example.png
-
-    This example demonstrates combining various methods of interacting with keyboard focus.
-*/
-
 Loader {//Just loader, since there's only one.
     source: "focus/focus.qml"
     focus: true
diff --git a/examples/quick/modelviews/doc/src/modelviews.qdoc b/examples/quick/modelviews/doc/src/modelviews.qdoc
new file mode 100644
index 0000000000..a568dc61ec
--- /dev/null
+++ b/examples/quick/modelviews/doc/src/modelviews.qdoc
@@ -0,0 +1,82 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title QtQuick Examples - ModelViews
+    \example quick/modelviews
+    \brief This is a collection of QML drag and drop examples
+    \image qml-modelviews-example.png
+
+    This is a collection of small QML examples relating to model and view functionality.
+
+    \section2 GridView and PathView demonstrate usage of these elements to display views.
+    \snippet examples/quick/modelviews/gridview/gridview-example.qml 0
+
+    \section2 Dynamic List demonstrates animation of runtime additions and removals to a ListView.
+
+    The ListView.onAdd signal handler runs an animation when new items are added to the
+    view, and the ListView.onRemove another when they are removed.
+    \snippet examples/quick/modelviews/listview/dynamiclist.qml 0
+    \snippet examples/quick/modelviews/listview/dynamiclist.qml 1
+
+    \section2 Expanding Delegates demonstrates delegates that expand when activated.
+
+    It has a complex delegate the size and appearance of which can change, displacing
+    other items in the view.
+    \snippet examples/quick/modelviews/listview/expandingdelegates.qml 0
+    \snippet examples/quick/modelviews/listview/expandingdelegates.qml 1
+    \snippet examples/quick/modelviews/listview/expandingdelegates.qml 2
+    \snippet examples/quick/modelviews/listview/expandingdelegates.qml 3
+
+    \section2 Highlight demonstrates adding a custom highlight to a ListView.
+    \snippet examples/quick/modelviews/listview/highlight.qml 0
+
+    \section2 Highlight Ranges shows the three different highlight range modes of ListView.
+    \snippet examples/quick/modelviews/listview/highlightranges.qml 0
+    \snippet examples/quick/modelviews/listview/highlightranges.qml 1
+    \snippet examples/quick/modelviews/listview/highlightranges.qml 2
+
+    \section2 Sections demonstrates the various section headers and footers available to ListView.
+    \snippet examples/quick/modelviews/listview/sections.qml 0
+
+    \section2 Packages demonstrates using Packages to transition delegates between two views.
+
+    It has a Package which defines delegate items for each view and an item that can
+    be transferred between delegates.
+
+    \snippet examples/quick/modelviews/package/Delegate.qml 0
+
+    A VisualDataModel allows the individual views to access their specific items from
+    the shared package delegate.
+
+    \snippet examples/quick/modelviews/package/view.qml 0
+
+    \section2 VisualItemModel uses a VisualItemModel for the model instead of a ListModel.
+
+    \snippet examples/quick/modelviews/visualitemmodel/visualitemmodel.qml 0
+*/
+
diff --git a/examples/quick/modelviews/modelviews.qml b/examples/quick/modelviews/modelviews.qml
index ab92fead4c..a48eb06516 100644
--- a/examples/quick/modelviews/modelviews.qml
+++ b/examples/quick/modelviews/modelviews.qml
@@ -41,61 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - ModelViews
-    \example quick/modelviews
-    \brief This is a collection of QML drag and drop examples
-    \image qml-modelviews-example.png
-
-    This is a collection of small QML examples relating to model and view functionality.
-
-    \section2 GridView and PathView demonstrate usage of these elements to display views.
-    \snippet examples/quick/modelviews/gridview/gridview-example.qml 0
-
-    \section2 Dynamic List demonstrates animation of runtime additions and removals to a ListView.
-
-    The ListView.onAdd signal handler runs an animation when new items are added to the
-    view, and the ListView.onRemove another when they are removed.
-    \snippet examples/quick/modelviews/listview/dynamiclist.qml 0
-    \snippet examples/quick/modelviews/listview/dynamiclist.qml 1
-
-    \section2 Expanding Delegates demonstrates delegates that expand when activated.
-
-    It has a complex delegate the size and appearance of which can change, displacing
-    other items in the view.
-    \snippet examples/quick/modelviews/listview/expandingdelegates.qml 0
-    \snippet examples/quick/modelviews/listview/expandingdelegates.qml 1
-    \snippet examples/quick/modelviews/listview/expandingdelegates.qml 2
-    \snippet examples/quick/modelviews/listview/expandingdelegates.qml 3
-
-    \section2 Highlight demonstrates adding a custom highlight to a ListView.
-    \snippet examples/quick/modelviews/listview/highlight.qml 0
-
-    \section2 Highlight Ranges shows the three different highlight range modes of ListView.
-    \snippet examples/quick/modelviews/listview/highlightranges.qml 0
-    \snippet examples/quick/modelviews/listview/highlightranges.qml 1
-    \snippet examples/quick/modelviews/listview/highlightranges.qml 2
-
-    \section2 Sections demonstrates the various section headers and footers available to ListView.
-    \snippet examples/quick/modelviews/listview/sections.qml 0
-
-    \section2 Packages demonstrates using Packages to transition delegates between two views.
-
-    It has a Package which defines delegate items for each view and an item that can
-    be transferred between delegates.
-
-    \snippet examples/quick/modelviews/package/Delegate.qml 0
-
-    A VisualDataModel allows the individual views to access their specific items from
-    the shared package delegate.
-
-    \snippet examples/quick/modelviews/package/view.qml 0
-
-    \section2 VisualItemModel uses a VisualItemModel for the model instead of a ListModel.
-
-    \snippet examples/quick/modelviews/visualitemmodel/visualitemmodel.qml 0
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/demos/maroon/maroon.qdoc b/examples/quick/mousearea/doc/src/mousearea.qdoc
index 1b3003304e..159620dd3b 100644
--- a/examples/demos/maroon/maroon.qdoc
+++ b/examples/quick/mousearea/doc/src/mousearea.qdoc
@@ -24,20 +24,23 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-
 /*!
-    \title QML Demos - Maroon in Trouble
-    \example demos/maroon
-    \brief This is an example game written in QML.
-    \image qml-maroon-demo-icon.png
+    \title QtQuick Examples - MouseArea
+    \example quick/mousearea
+    \brief This is a collection of QML Animation examples.
+    \image qml-mousearea-example.png
+
+    This example shows you how to respond to clicks and drags with a MouseArea.
+
+    When you click inside the red square, the Text element will list several properties
+    of that click which are available to QML.
 
-    The Maroon in Trouble game demonstrates some of the UI effects that QtQuick provides to
-    make UIs more visually rich. It take a simple tower defense game and then jazzes it up with
-    animated sprites, particle effects, and sound effects (if the QtMultimedia module is available).
+    Signals are emitted by the MouseArea when clicks or other discrete operations occur within it
+    \snippet examples/quick/mousearea/mousearea.qml clicks
 
-    The game also demonstrates the extensibility of QML, by making it easy to add more types of tower
-    for the player to build. Advanced QML users should be able to play around with adding additional
-    types of towers or mobs.
+    The MouseArea can also be used to drag elements around. By setting the parameters of the drag property,
+    the target item will be dragged around if the user starts to drag within the MouseArea.
+    \snippet examples/quick/mousearea/mousearea.qml drag
 
 */
 
diff --git a/examples/quick/mousearea/mousearea.qml b/examples/quick/mousearea/mousearea.qml
index cdc2364b1f..9488f72a4c 100644
--- a/examples/quick/mousearea/mousearea.qml
+++ b/examples/quick/mousearea/mousearea.qml
@@ -40,26 +40,6 @@
 
 import QtQuick 2.0
 
-/*!
-    \title QtQuick Examples - MouseArea
-    \example quick/mousearea
-    \brief This is a collection of QML Animation examples.
-    \image qml-mousearea-example.png
-
-    This example shows you how to respond to clicks and drags with a MouseArea.
-
-    When you click inside the red square, the Text element will list several properties
-    of that click which are available to QML.
-
-    Signals are emitted by the MouseArea when clicks or other discrete operations occur within it
-    \snippet examples/quick/mousearea/mousearea.qml clicks
-
-    The MouseArea can also be used to drag elements around. By setting the parameters of the drag property,
-    the target item will be dragged around if the user starts to drag within the MouseArea.
-    \snippet examples/quick/mousearea/mousearea.qml drag
-
-*/
-
 Rectangle {
     id: box
     width: 320; height: 480
diff --git a/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc b/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc
new file mode 100644
index 0000000000..2b60f53c79
--- /dev/null
+++ b/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc
@@ -0,0 +1,32 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title QtQuick Examples - Painted Text Balloons
+    \example quick/painteditem/textballoons
+    \brief This is a simple example that draws text balloons using QPainter
+*/
diff --git a/examples/quick/positioners/doc/src/positioners.qdoc b/examples/quick/positioners/doc/src/positioners.qdoc
new file mode 100644
index 0000000000..6166aa2eb6
--- /dev/null
+++ b/examples/quick/positioners/doc/src/positioners.qdoc
@@ -0,0 +1,52 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QtQuick Examples - Positioners
+    \example quick/positioners
+    \brief This is a collection of QML Positioner examples.
+    \image qml-positioners-example.png
+
+    This is a collection of small QML examples relating to positioners. Each example is
+    a small QML file emphasizing a particular element or feature.
+
+    Transitions shows animated transitions when showing or hiding items in a positioner.
+    It consists of a scene populated with items in a variety of positioners: Column, Row, Grid and Flow.
+    Each positioner has animations described as Transitions.
+
+    \snippet examples/quick/positioners/positioners-transitions.qml move
+    The move transition specifies how items inside a positioner will animate when they are displaced by the appearance or disappearance of other items.
+
+    \snippet examples/quick/positioners/positioners-transitions.qml add
+    The add transition specifies how items will appear when they are added to a positioner.
+
+    \snippet examples/quick/positioners/positioners-transitions.qml populate
+    The populate transition specifies how items will appear when their parent positioner is first created.
+
+    Attached Properties shows how the Positioner attached property can be used to determine where an item is within a positioner.
+    \snippet examples/quick/positioners/positioners-attachedproperties.qml 0
+*/
+
diff --git a/examples/quick/positioners/positioners.qml b/examples/quick/positioners/positioners.qml
index 859d6bd6c5..ccbdb2b23a 100644
--- a/examples/quick/positioners/positioners.qml
+++ b/examples/quick/positioners/positioners.qml
@@ -41,32 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - Positioners
-    \example quick/positioners
-    \brief This is a collection of QML Positioner examples.
-    \image qml-positioners-example.png
-
-    This is a collection of small QML examples relating to positioners. Each example is
-    a small QML file emphasizing a particular element or feature.
-
-    Transitions shows animated transitions when showing or hiding items in a positioner.
-    It consists of a scene populated with items in a variety of positioners: Column, Row, Grid and Flow.
-    Each positioner has animations described as Transitions.
-
-    \snippet examples/quick/positioners/positioners-transitions.qml move
-    The move transition specifies how items inside a positioner will animate when they are displaced by the appearance or disappearance of other items.
-
-    \snippet examples/quick/positioners/positioners-transitions.qml add
-    The add transition specifies how items will appear when they are added to a positioner.
-
-    \snippet examples/quick/positioners/positioners-transitions.qml populate
-    The populate transition specifies how items will appear when their parent positioner is first created.
-
-    Attached Properties shows how the Positioner attached property can be used to determine where an item is within a positioner.
-    \snippet examples/quick/positioners/positioners-attachedproperties.qml 0
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/quick/righttoleft/doc/src/righttoleft.qdoc b/examples/quick/righttoleft/doc/src/righttoleft.qdoc
new file mode 100644
index 0000000000..9d8240fb8e
--- /dev/null
+++ b/examples/quick/righttoleft/doc/src/righttoleft.qdoc
@@ -0,0 +1,38 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QtQuick Examples - Right to Left
+    \example quick/righttoleft
+    \brief This is a collection of QML Right to Left examples.
+    \image qml-righttoleft-example.png
+
+    This is a collection of small QML examples relating to right to left(RTL) localization support.
+
+    Layout direction shows RTL layouting.
+    Layout mirroring shows automatic mirroring of horizontal layouts in RTL locales.
+    Text Alignment shows automatic mirroring of text alignment in RTL locales.
+*/
diff --git a/examples/quick/righttoleft/righttoleft.qml b/examples/quick/righttoleft/righttoleft.qml
index b95f671d95..e2f2a9a535 100644
--- a/examples/quick/righttoleft/righttoleft.qml
+++ b/examples/quick/righttoleft/righttoleft.qml
@@ -41,19 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - Right to Left
-    \example quick/righttoleft
-    \brief This is a collection of QML Right to Left examples.
-    \image qml-righttoleft-example.png
-
-    This is a collection of small QML examples relating to right to left(RTL) localization support.
-
-    Layout direction shows RTL layouting.
-    Layout mirroring shows automatic mirroring of horizontal layouts in RTL locales.
-    Text Alignment shows automatic mirroring of text alignment in RTL locales.
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/quick/doc/customgeometry.qdoc b/examples/quick/scenegraph/customgeometry/doc/src/customgeometry.qdoc
index e17990cc56..e17990cc56 100644
--- a/examples/quick/doc/customgeometry.qdoc
+++ b/examples/quick/scenegraph/customgeometry/doc/src/customgeometry.qdoc
diff --git a/examples/quick/shadereffects/doc/src/shadereffects.qdoc b/examples/quick/shadereffects/doc/src/shadereffects.qdoc
new file mode 100644
index 0000000000..75199daffe
--- /dev/null
+++ b/examples/quick/shadereffects/doc/src/shadereffects.qdoc
@@ -0,0 +1,51 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QML Examples - Shader Effects
+    \example quick/shadereffects
+    \image qml-shadereffects-example.png
+    \brief This is a shader effects example
+
+    This example demonstrates a couple of visual effects that you can perform
+    with shaders in QtQuick 2.0
+
+    ShaderEffects typically operate on other elements, using a ShaderEffectSource
+    \snippet examples/quick/shadereffects/shadereffects.qml source
+    In the above snippet, theItem is the id of a complex QML element in the file.
+
+    ShaderEffects can use this ShaderEffectSource as a texture in their fragment shader.
+    \snippet examples/quick/shadereffects/shadereffects.qml fragment
+
+    You can use any custom property on the ShaderEffect in your shader. This makes
+    animated shader code very easy.
+    \snippet examples/quick/shadereffects/shadereffects.qml properties
+
+    ShaderEffects can also have a custom vertext shader. Setting the mesh property on ShaderEffect
+    provides more vertices for you to manipulate, enabling many effects.
+    \snippet examples/quick/shadereffects/shadereffects.qml vertex
+*/
+
diff --git a/examples/quick/shadereffects/shadereffects.qml b/examples/quick/shadereffects/shadereffects.qml
index 9fdbde97d5..207a1a14ac 100644
--- a/examples/quick/shadereffects/shadereffects.qml
+++ b/examples/quick/shadereffects/shadereffects.qml
@@ -46,30 +46,6 @@ Rectangle {
     id: root
     width: 320
     height: 480
-/*!
-    \title QML Examples - Shader Effects
-    \example quick/shadereffects
-    \image qml-shadereffects-example.png
-    \brief This is a shader effects example
-
-    This example demonstrates a couple of visual effects that you can perform
-    with shaders in QtQuick 2.0
-
-    ShaderEffects typically operate on other elements, using a ShaderEffectSource
-    \snippet examples/quick/shadereffects/shadereffects.qml source
-    In the above snippet, theItem is the id of a complex QML element in the file.
-
-    ShaderEffects can use this ShaderEffectSource as a texture in their fragment shader.
-    \snippet examples/quick/shadereffects/shadereffects.qml fragment
-
-    You can use any custom property on the ShaderEffect in your shader. This makes
-    animated shader code very easy.
-    \snippet examples/quick/shadereffects/shadereffects.qml properties
-
-    ShaderEffects can also have a custom vertext shader. Setting the mesh property on ShaderEffect
-    provides more vertices for you to manipulate, enabling many effects.
-    \snippet examples/quick/shadereffects/shadereffects.qml vertex
-*/
     property color col: "lightsteelblue"
     gradient: Gradient {
         GradientStop { position: 0.0; color: Qt.tint(root.col, "#20FFFFFF") }
diff --git a/examples/quick/text/doc/src/text.qdoc b/examples/quick/text/doc/src/text.qdoc
new file mode 100644
index 0000000000..32ccfca355
--- /dev/null
+++ b/examples/quick/text/doc/src/text.qdoc
@@ -0,0 +1,69 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QML Examples - Text
+    \example quick/text
+    \brief This is a collection of QML examples
+    \image qml-text-example.png
+
+    This is a collection of  small QML examples relating to text. Each example is
+    a small QML file, usually containing or emphasizing a particular element or
+    feature. You can run and observe the behavior of each example.
+
+    'Hello' shows how to change and animate the letter spacing of a Text element.
+    It uses a sequential animation to first animate the font.letterSpacing property
+    from 0 to 50 over 3 seconds and then move the text to a random position on screen:
+    \snippet examples/quick/text/fonts/hello.qml letterspacing
+
+    'Fonts' shows different ways of using fonts with the Text element.
+    Simply by name, using the font.family property directly:
+    \snippet examples/quick/text/fonts/fonts.qml name
+    or using a FontLoader element:
+    \snippet examples/quick/text/fonts/fonts.qml fontloader
+    or using a FontLoader and specifying a local font file:
+    \snippet examples/quick/text/fonts/fonts.qml fontloaderlocal
+    or finally using a FontLoader and specifying a remote font file:
+    \snippet examples/quick/text/fonts/fonts.qml fontloaderremote
+
+    'Available Fonts' shows how to use the QML global Qt object and a list view
+    to display all the fonts available on the system.
+    The ListView element uses the list of fonts available as its model:
+    \snippet examples/quick/text/fonts/availableFonts.qml model
+    Inside the delegate, the font family is set with the modelData:
+    \snippet examples/quick/text/fonts/availableFonts.qml delegate
+
+    'Banner' is a simple example showing how to create a banner using a row of text
+    elements and a NumberAnimation.
+
+    'Img tag' shows different ways of displaying images in a text elements using
+    the <img> tag.
+
+    'Text Layout' shows how to create a more complex layout for a text element.
+    This example lays out the text in two columns using the onLineLaidOut handler
+    that allows you to position and resize each line:
+    \snippet examples/quick/text/styledtext-layout.qml layout
+*/
diff --git a/examples/quick/text/text.qml b/examples/quick/text/text.qml
index 4b11b93189..83b1699bd6 100644
--- a/examples/quick/text/text.qml
+++ b/examples/quick/text/text.qml
@@ -40,49 +40,6 @@
 
 import QtQuick 2.0
 import "../../shared"
-/*!
-    \title QML Examples - Text
-    \example quick/text
-    \brief This is a collection of QML examples
-    \image qml-text-example.png
-
-    This is a collection of  small QML examples relating to text. Each example is
-    a small QML file, usually containing or emphasizing a particular element or
-    feature. You can run and observe the behavior of each example.
-
-    'Hello' shows how to change and animate the letter spacing of a Text element.
-    It uses a sequential animation to first animate the font.letterSpacing property
-    from 0 to 50 over 3 seconds and then move the text to a random position on screen:
-    \snippet examples/quick/text/fonts/hello.qml letterspacing
-
-    'Fonts' shows different ways of using fonts with the Text element.
-    Simply by name, using the font.family property directly:
-    \snippet examples/quick/text/fonts/fonts.qml name
-    or using a FontLoader element:
-    \snippet examples/quick/text/fonts/fonts.qml fontloader
-    or using a FontLoader and specifying a local font file:
-    \snippet examples/quick/text/fonts/fonts.qml fontloaderlocal
-    or finally using a FontLoader and specifying a remote font file:
-    \snippet examples/quick/text/fonts/fonts.qml fontloaderremote
-
-    'Available Fonts' shows how to use the QML global Qt object and a list view
-    to display all the fonts available on the system.
-    The ListView element uses the list of fonts available as its model:
-    \snippet examples/quick/text/fonts/availableFonts.qml model
-    Inside the delegate, the font family is set with the modelData:
-    \snippet examples/quick/text/fonts/availableFonts.qml delegate
-
-    'Banner' is a simple example showing how to create a banner using a row of text
-    elements and a NumberAnimation.
-
-    'Img tag' shows different ways of displaying images in a text elements using
-    the <img> tag.
-
-    'Text Layout' shows how to create a more complex layout for a text element.
-    This example lays out the text in two columns using the onLineLaidOut handler
-    that allows you to position and resize each line:
-    \snippet examples/quick/text/styledtext-layout.qml layout
-*/
 
 Item {
     height: 480
diff --git a/examples/quick/threading/doc/src/threading.qdoc b/examples/quick/threading/doc/src/threading.qdoc
new file mode 100644
index 0000000000..d645b2bcb4
--- /dev/null
+++ b/examples/quick/threading/doc/src/threading.qdoc
@@ -0,0 +1,48 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QtQuick Examples - Threading
+    \example quick/threading
+    \brief This is a collection of QML Multithreading examples.
+    \image qml-threading-example.png
+
+    Threaded ListModel contains a ListView and a ListModel. The ListModel is updated asynchronusly in another thread, and the results propagate back to the main thread.
+    A timer requests updates from the worker thread periodically:
+    \snippet examples/threading/threadedlistmodel/timedisplay.qml 0
+
+    Inside the worker thread, the ListModel is synchronized once the data is finished loading:
+    \snippet examples/threading/threadedlistmodel/dataloader.js 0
+
+    WorkerScript contains an example of using a WorkerScript to offload expensive calculations into another thread. This keeps the UI from being blocked. This example calculates numbers in Pascal's Triangle, and not in a very optimal way, so it will often take several seconds to complete the calculation. By doing this in a WorkerScript in another thread, the UI is not blocked during this time.
+
+    When the UI needs another value, a request is sent to the WorkerScript:
+    \snippet examples/threading/workerscript/workerscript.qml 0
+    The workerscript then is free to take a really long time to calculate it:
+    \snippet examples/threading/workerscript/workerscript.js 0
+    When it's done, the result returns to the main scene via the WorkerScript element:
+    \snippet examples/threading/workerscript/workerscript.qml 1
+*/
diff --git a/examples/quick/threading/threading.qml b/examples/quick/threading/threading.qml
index cff4dd83b9..1b1906734b 100644
--- a/examples/quick/threading/threading.qml
+++ b/examples/quick/threading/threading.qml
@@ -41,29 +41,6 @@
 import QtQuick 2.0
 import "../../shared" as Examples
 
-/*!
-    \title QtQuick Examples - Threading
-    \example quick/threading
-    \brief This is a collection of QML Multithreading examples.
-    \image qml-threading-example.png
-
-    Threaded ListModel contains a ListView and a ListModel. The ListModel is updated asynchronusly in another thread, and the results propagate back to the main thread.
-    A timer requests updates from the worker thread periodically:
-    \snippet examples/threading/threadedlistmodel/timedisplay.qml 0
-
-    Inside the worker thread, the ListModel is synchronized once the data is finished loading:
-    \snippet examples/threading/threadedlistmodel/dataloader.js 0
-
-    WorkerScript contains an example of using a WorkerScript to offload expensive calculations into another thread. This keeps the UI from being blocked. This example calculates numbers in Pascal's Triangle, and not in a very optimal way, so it will often take several seconds to complete the calculation. By doing this in a WorkerScript in another thread, the UI is not blocked during this time.
-
-    When the UI needs another value, a request is sent to the WorkerScript:
-    \snippet examples/threading/workerscript/workerscript.qml 0
-    The workerscript then is free to take a really long time to calculate it:
-    \snippet examples/threading/workerscript/workerscript.js 0
-    When it's done, the result returns to the main scene via the WorkerScript element:
-    \snippet examples/threading/workerscript/workerscript.qml 1
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc b/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc
new file mode 100644
index 0000000000..48c7b0b4ab
--- /dev/null
+++ b/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc
@@ -0,0 +1,56 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** GNU Free Documentation License
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms
+** and conditions contained in a signed written agreement between you
+** and Nokia.
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \title QtQuick Examples - Touch Interaction
+    \example quick/touchinteraction
+    \brief This is a collection of QML Touch Interaction examples.
+    \image qml-touchinteraction-example.png
+
+    This is a collection of small QML examples relating to touch interaction methods.
+
+    Multipoint Flames demonstrates distinguishing different fingers in a MultiPointTouchArea, by assigning a different colored flame to each touch point.
+    The MultipointTouchArea sets up multiple touch points:
+    \snippet examples/quick/touchinteraction/multipointtouch/multiflame.qml 0
+    The flames are then simply bound to the coordiates of the touch point, and whether it is currently pressed, like so:
+    \snippet examples/quick/touchinteraction/multipointtouch/multiflame.qml 1
+
+    Bear-Whack demonstrates using a MultiPointTouchArea to add multiple finger support to a simple game. The interaction with the game
+    is done through a SpriteGoal that follows the TouchPoint. The TouchPoints added to the MultiPointTouchArea are a component with all
+    this logic embedded into it:
+    \snippet examples/quick/touchinteraction/multipointtouch/bearwhack/content/AugmentedTouchPoint.qml 0
+
+    Flick Resize uses a PinchArea to allow Pinch-to-Resize behavior. This is easily achieved just by listening to the PinchArea signals and responding
+    to user input.
+    \snippet examples/quick/touchinteraction/pincharea/flickresize.qml 0
+
+    Flickable is a simple example demonstrating the Flickable element. The element inside the flickable is very big, but the flickable itself is very small:
+    \snippet examples/quick/touchinteraction/flickable/basic-flickable.qml 0
+
+    Corkboards shows a more complex Flickable usecase, with elements on the flickable that respond to mouse and keyboard interaction.
+    This doesn't require special code, the QtQuick elements automatically cooperate with Flickable for accepting the touch events.
+*/
+
diff --git a/examples/quick/touchinteraction/touchinteraction.qml b/examples/quick/touchinteraction/touchinteraction.qml
index c8285438ef..f72500eaa2 100644
--- a/examples/quick/touchinteraction/touchinteraction.qml
+++ b/examples/quick/touchinteraction/touchinteraction.qml
@@ -41,36 +41,6 @@
 import QtQuick 2.0
 import "../../shared"
 
-/*!
-    \title QtQuick Examples - Touch Interaction
-    \example quick/touchinteraction
-    \brief This is a collection of QML Touch Interaction examples.
-    \image qml-touchinteraction-example.png
-
-    This is a collection of small QML examples relating to touch interaction methods.
-
-    Multipoint Flames demonstrates distinguishing different fingers in a MultiPointTouchArea, by assigning a different colored flame to each touch point.
-    The MultipointTouchArea sets up multiple touch points:
-    \snippet examples/quick/touchinteraction/multipointtouch/multiflame.qml 0
-    The flames are then simply bound to the coordiates of the touch point, and whether it is currently pressed, like so:
-    \snippet examples/quick/touchinteraction/multipointtouch/multiflame.qml 1
-
-    Bear-Whack demonstrates using a MultiPointTouchArea to add multiple finger support to a simple game. The interaction with the game
-    is done through a SpriteGoal that follows the TouchPoint. The TouchPoints added to the MultiPointTouchArea are a component with all
-    this logic embedded into it:
-    \snippet examples/quick/touchinteraction/multipointtouch/bearwhack/content/AugmentedTouchPoint.qml 0
-
-    Flick Resize uses a PinchArea to allow Pinch-to-Resize behavior. This is easily achieved just by listening to the PinchArea signals and responding
-    to user input.
-    \snippet examples/quick/touchinteraction/pincharea/flickresize.qml 0
-
-    Flickable is a simple example demonstrating the Flickable element. The element inside the flickable is very big, but the flickable itself is very small:
-    \snippet examples/quick/touchinteraction/flickable/basic-flickable.qml 0
-
-    Corkboards shows a more complex Flickable usecase, with elements on the flickable that respond to mouse and keyboard interaction.
-    This doesn't require special code, the QtQuick elements automatically cooperate with Flickable for accepting the touch events.
-*/
-
 Item {
     height: 480
     width: 320
diff --git a/examples/quick/ui-components/dialcontrol/content/Dial.qml b/examples/quick/ui-components/dialcontrol/content/Dial.qml
new file mode 100644
index 0000000000..c61adee364
--- /dev/null
+++ b/examples/quick/ui-components/dialcontrol/content/Dial.qml
@@ -0,0 +1,86 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Item {
+    id: root
+    property real value : 0
+
+    width: 210; height: 210
+
+    Image { source: "background.png" }
+
+//! [needle_shadow]
+    Image {
+        x: 96
+        y: 35
+        source: "needle_shadow.png"
+        transform: Rotation {
+            origin.x: 9; origin.y: 67
+            angle: needleRotation.angle
+        }
+    }
+//! [needle_shadow]
+//! [needle]
+    Image {
+        id: needle
+        x: 98; y: 33
+        smooth: true
+        source: "needle.png"
+        transform: Rotation {
+            id: needleRotation
+            origin.x: 5; origin.y: 65
+            //! [needle angle]
+            angle: Math.min(Math.max(-130, root.value*2.6 - 130), 133)
+            Behavior on angle {
+                SpringAnimation {
+                    spring: 1.4
+                    damping: .15
+                }
+            }
+            //! [needle angle]
+        }
+    }
+//! [needle]
+//! [overlay]
+    Image { x: 21; y: 18; source: "overlay.png" }
+//! [overlay]
+}
diff --git a/examples/quick/ui-components/dialcontrol/content/QuitButton.qml b/examples/quick/ui-components/dialcontrol/content/QuitButton.qml
new file mode 100644
index 0000000000..702b892d23
--- /dev/null
+++ b/examples/quick/ui-components/dialcontrol/content/QuitButton.qml
@@ -0,0 +1,52 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+Image {
+    source: "quit.png"
+    scale: quitMouse.pressed ? 0.8 : 1.0
+    smooth: quitMouse.pressed
+    MouseArea {
+        id: quitMouse
+        anchors.fill: parent
+        anchors.margins: -10
+        onClicked: Qt.quit()
+    }
+}
diff --git a/examples/quick/ui-components/dialcontrol/content/background.png b/examples/quick/ui-components/dialcontrol/content/background.png
new file mode 100644
index 0000000000..75d555d7ab
--- /dev/null
+++ b/examples/quick/ui-components/dialcontrol/content/background.png
diff --git a/examples/quick/ui-components/dialcontrol/content/needle.png b/examples/quick/ui-components/dialcontrol/content/needle.png
new file mode 100644
index 0000000000..2d19f75039
--- /dev/null
+++ b/examples/quick/ui-components/dialcontrol/content/needle.png
diff --git a/examples/quick/ui-components/dialcontrol/content/needle_shadow.png b/examples/quick/ui-components/dialcontrol/content/needle_shadow.png
new file mode 100644
index 0000000000..8d8a928cc5
--- /dev/null
+++ b/examples/quick/ui-components/dialcontrol/content/needle_shadow.png
diff --git a/examples/quick/ui-components/dialcontrol/content/overlay.png b/examples/quick/ui-components/dialcontrol/content/overlay.png
new file mode 100644
index 0000000000..3860a7b590
--- /dev/null
+++ b/examples/quick/ui-components/dialcontrol/content/overlay.png
diff --git a/examples/quick/ui-components/dialcontrol/content/quit.png b/examples/quick/ui-components/dialcontrol/content/quit.png
new file mode 100644
index 0000000000..b822057d4e
--- /dev/null
+++ b/examples/quick/ui-components/dialcontrol/content/quit.png
diff --git a/examples/quick/ui-components/dialcontrol/dialcontrol.qml b/examples/quick/ui-components/dialcontrol/dialcontrol.qml
new file mode 100644
index 0000000000..467a558696
--- /dev/null
+++ b/examples/quick/ui-components/dialcontrol/dialcontrol.qml
@@ -0,0 +1,100 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [imports]
+import QtQuick 2.0
+import "content"
+//! [imports]
+
+//! [0]
+Rectangle {
+    color: "#545454"
+    width: 300; height: 300
+
+    //! [the dial in use]
+    // Dial with a slider to adjust it
+    Dial {
+        id: dial
+        anchors.centerIn: parent
+        value: slider.x * 100 / (container.width - 34)
+    }
+    //! [the dial in use]
+
+    Rectangle {
+        id: container
+        anchors { bottom: parent.bottom; left: parent.left
+            right: parent.right; leftMargin: 20; rightMargin: 20
+            bottomMargin: 10
+        }
+        height: 16
+
+        radius: 8
+        opacity: 0.7
+        smooth: true
+        gradient: Gradient {
+            GradientStop { position: 0.0; color: "gray" }
+            GradientStop { position: 1.0; color: "white" }
+        }
+
+        Rectangle {
+            id: slider
+            x: 1; y: 1; width: 30; height: 14
+            radius: 6
+            smooth: true
+            gradient: Gradient {
+                GradientStop { position: 0.0; color: "#424242" }
+                GradientStop { position: 1.0; color: "black" }
+            }
+
+            MouseArea {
+                anchors.fill: parent
+                anchors.margins: -16 // Increase mouse area a lot outside the slider
+                drag.target: parent; drag.axis: Drag.XAxis
+                drag.minimumX: 2; drag.maximumX: container.width - 32
+            }
+        }
+    }
+    QuitButton {
+        anchors.right: parent.right
+        anchors.top: parent.top
+        anchors.margins: 10
+    }
+}
+//! [0]
diff --git a/examples/quick/ui-components/flipable/content/5_heart.png b/examples/quick/ui-components/flipable/content/5_heart.png
new file mode 100644
index 0000000000..fb59d81453
--- /dev/null
+++ b/examples/quick/ui-components/flipable/content/5_heart.png
diff --git a/examples/quick/ui-components/flipable/content/9_club.png b/examples/quick/ui-components/flipable/content/9_club.png
new file mode 100644
index 0000000000..2545001904
--- /dev/null
+++ b/examples/quick/ui-components/flipable/content/9_club.png
diff --git a/examples/quick/ui-components/flipable/content/Card.qml b/examples/quick/ui-components/flipable/content/Card.qml
new file mode 100644
index 0000000000..6f9f80b88d
--- /dev/null
+++ b/examples/quick/ui-components/flipable/content/Card.qml
@@ -0,0 +1,80 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Flipable {
+    id: container
+
+    property alias source: frontImage.source
+    property bool flipped: true
+    property int xAxis: 0
+    property int yAxis: 0
+    property int angle: 0
+
+    width: front.width; height: front.height
+
+    front: Image { id: frontImage; smooth: true }
+    back: Image { source: "back.png"; smooth: true }
+
+    state: "back"
+
+    MouseArea { anchors.fill: parent; onClicked: container.flipped = !container.flipped }
+
+    transform: Rotation {
+        id: rotation; origin.x: container.width / 2; origin.y: container.height / 2
+        axis.x: container.xAxis; axis.y: container.yAxis; axis.z: 0
+    }
+
+    states: State {
+        name: "back"; when: container.flipped
+        PropertyChanges { target: rotation; angle: container.angle }
+    }
+
+    transitions: Transition {
+        ParallelAnimation {
+            NumberAnimation { target: rotation; properties: "angle"; duration: 600 }
+            SequentialAnimation {
+                NumberAnimation { target: container; property: "scale"; to: 0.75; duration: 300 }
+                NumberAnimation { target: container; property: "scale"; to: 1.0; duration: 300 }
+            }
+        }
+    }
+}
diff --git a/examples/quick/ui-components/flipable/content/back.png b/examples/quick/ui-components/flipable/content/back.png
new file mode 100644
index 0000000000..f715d7487e
--- /dev/null
+++ b/examples/quick/ui-components/flipable/content/back.png
diff --git a/examples/demos/tweetsearch/tweetsearch.qdoc b/examples/quick/ui-components/flipable/flipable.qml
index 1cff976156..41733e3adf 100644
--- a/examples/demos/tweetsearch/tweetsearch.qdoc
+++ b/examples/quick/ui-components/flipable/flipable.qml
@@ -38,14 +38,18 @@
 **
 ****************************************************************************/
 
-/*!
-    \title QML Demo - Tweet Search
-    \example demos/tweetsearch
-    \brief This is simple twitter application written in QML.
+import QtQuick 2.0
+import "content"
 
-    The Tweet Search demo shows how to write a simple twitter application.
-    It uses the twitter search API to search for tweets with specific words or hashtag
-    or from a specific user. The tweets are presented in a list that can be pulled to
-    be updated.
-*/
+Rectangle {
+    id: window
 
+    width: 480; height: 320
+    color: "darkgreen"
+
+    Row {
+        anchors.centerIn: parent; spacing: 30
+        Card { source: "content/9_club.png"; angle: 180; yAxis: 1 }
+        Card { source: "content/5_heart.png"; angle: 540; xAxis: 1 }
+    }
+}
diff --git a/examples/quick/ui-components/progressbar/content/ProgressBar.qml b/examples/quick/ui-components/progressbar/content/ProgressBar.qml
new file mode 100644
index 0000000000..c9be8d7336
--- /dev/null
+++ b/examples/quick/ui-components/progressbar/content/ProgressBar.qml
@@ -0,0 +1,83 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Item {
+    id: progressbar
+
+    property int minimum: 0
+    property int maximum: 100
+    property int value: 0
+    property alias color: gradient1.color
+    property alias secondColor: gradient2.color
+
+    width: 250; height: 23
+    clip: true
+
+    BorderImage {
+        source: "background.png"
+        width: parent.width; height: parent.height
+        border { left: 4; top: 4; right: 4; bottom: 4 }
+    }
+
+    Rectangle {
+        id: highlight
+
+        property int widthDest: ((progressbar.width * (value - minimum)) / (maximum - minimum) - 6)
+
+        width: highlight.widthDest
+        Behavior on width { SmoothedAnimation { velocity: 1200 } }
+
+        anchors { left: parent.left; top: parent.top; bottom: parent.bottom; margins: 3 }
+        radius: 1
+        gradient: Gradient {
+            GradientStop { id: gradient1; position: 0.0 }
+            GradientStop { id: gradient2; position: 1.0 }
+        }
+
+    }
+    Text {
+        anchors { right: highlight.right; rightMargin: 6; verticalCenter: parent.verticalCenter }
+        color: "white"
+        font.bold: true
+        text: Math.floor((value - minimum) / (maximum - minimum) * 100) + '%'
+    }
+}
diff --git a/examples/quick/ui-components/progressbar/content/background.png b/examples/quick/ui-components/progressbar/content/background.png
new file mode 100644
index 0000000000..9044226f85
--- /dev/null
+++ b/examples/quick/ui-components/progressbar/content/background.png
diff --git a/examples/quick/ui-components/progressbar/main.qml b/examples/quick/ui-components/progressbar/main.qml
new file mode 100644
index 0000000000..367e4c1265
--- /dev/null
+++ b/examples/quick/ui-components/progressbar/main.qml
@@ -0,0 +1,73 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import "content"
+
+Rectangle {
+    id: main
+
+    width: 600; height: 405
+    color: "#edecec"
+
+    Flickable {
+        anchors.fill: parent
+        contentHeight: column.height + 20
+
+        Column {
+            id: column
+            x: 10; y: 10
+            spacing: 10
+
+            Repeater {
+                model: 25
+
+                ProgressBar {
+                    property int r: Math.floor(Math.random() * 5000 + 1000)
+                    width: main.width - 20
+
+                    NumberAnimation on value { duration: r; from: 0; to: 100; loops: Animation.Infinite }
+                    ColorAnimation on color { duration: r; from: "lightsteelblue"; to: "thistle"; loops: Animation.Infinite }
+                    ColorAnimation on secondColor { duration: r; from: "steelblue"; to: "#CD96CD"; loops: Animation.Infinite }
+                }
+            }
+        }
+    }
+}
diff --git a/examples/quick/ui-components/scrollbar/ScrollBar.qml b/examples/quick/ui-components/scrollbar/ScrollBar.qml
new file mode 100644
index 0000000000..a3d0d3841c
--- /dev/null
+++ b/examples/quick/ui-components/scrollbar/ScrollBar.qml
@@ -0,0 +1,74 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Item {
+    id: scrollBar
+
+    // The properties that define the scrollbar's state.
+    // position and pageSize are in the range 0.0 - 1.0.  They are relative to the
+    // height of the page, i.e. a pageSize of 0.5 means that you can see 50%
+    // of the height of the view.
+    // orientation can be either Qt.Vertical or Qt.Horizontal
+    property real position
+    property real pageSize
+    property variant orientation : Qt.Vertical
+
+    // A light, semi-transparent background
+    Rectangle {
+        id: background
+        anchors.fill: parent
+        radius: orientation == Qt.Vertical ? (width/2 - 1) : (height/2 - 1)
+        color: "white"
+        opacity: 0.3
+    }
+
+    // Size the bar to the required size, depending upon the orientation.
+    Rectangle {
+        x: orientation == Qt.Vertical ? 1 : (scrollBar.position * (scrollBar.width-2) + 1)
+        y: orientation == Qt.Vertical ? (scrollBar.position * (scrollBar.height-2) + 1) : 1
+        width: orientation == Qt.Vertical ? (parent.width-2) : (scrollBar.pageSize * (scrollBar.width-2))
+        height: orientation == Qt.Vertical ? (scrollBar.pageSize * (scrollBar.height-2)) : (parent.height-2)
+        radius: orientation == Qt.Vertical ? (width/2 - 1) : (height/2 - 1)
+        color: "black"
+        opacity: 0.7
+    }
+}
diff --git a/examples/quick/ui-components/scrollbar/main.qml b/examples/quick/ui-components/scrollbar/main.qml
new file mode 100644
index 0000000000..a7d602b437
--- /dev/null
+++ b/examples/quick/ui-components/scrollbar/main.qml
@@ -0,0 +1,93 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Rectangle {
+    width: 640
+    height: 480
+
+    // Create a flickable to view a large image.
+    Flickable {
+        id: view
+        anchors.fill: parent
+        contentWidth: picture.width
+        contentHeight: picture.height
+
+        Image {
+            id: picture
+            source: "pics/niagara_falls.jpg"
+            asynchronous: true
+        }
+
+        // Only show the scrollbars when the view is moving.
+        states: State {
+            name: "ShowBars"
+            when: view.movingVertically || view.movingHorizontally
+            PropertyChanges { target: verticalScrollBar; opacity: 1 }
+            PropertyChanges { target: horizontalScrollBar; opacity: 1 }
+        }
+
+        transitions: Transition {
+            NumberAnimation { properties: "opacity"; duration: 400 }
+        }
+    }
+
+    // Attach scrollbars to the right and bottom edges of the view.
+    ScrollBar {
+        id: verticalScrollBar
+        width: 12; height: view.height-12
+        anchors.right: view.right
+        opacity: 0
+        orientation: Qt.Vertical
+        position: view.visibleArea.yPosition
+        pageSize: view.visibleArea.heightRatio
+    }
+
+    ScrollBar {
+        id: horizontalScrollBar
+        width: view.width-12; height: 12
+        anchors.bottom: view.bottom
+        opacity: 0
+        orientation: Qt.Horizontal
+        position: view.visibleArea.xPosition
+        pageSize: view.visibleArea.widthRatio
+    }
+}
diff --git a/examples/quick/ui-components/scrollbar/pics/niagara_falls.jpg b/examples/quick/ui-components/scrollbar/pics/niagara_falls.jpg
new file mode 100644
index 0000000000..e625c0d3e6
--- /dev/null
+++ b/examples/quick/ui-components/scrollbar/pics/niagara_falls.jpg
diff --git a/examples/quick/ui-components/scrollbar/scrollbar.qmlproject b/examples/quick/ui-components/scrollbar/scrollbar.qmlproject
new file mode 100644
index 0000000000..e5a8bf02ca
--- /dev/null
+++ b/examples/quick/ui-components/scrollbar/scrollbar.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.1
+
+Project {
+    mainFile: "main.qml"
+
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+}
diff --git a/examples/quick/ui-components/searchbox/SearchBox.qml b/examples/quick/ui-components/searchbox/SearchBox.qml
new file mode 100644
index 0000000000..1168d05dd3
--- /dev/null
+++ b/examples/quick/ui-components/searchbox/SearchBox.qml
@@ -0,0 +1,109 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+FocusScope {
+    id: focusScope
+    width: 250; height: 28
+
+    BorderImage {
+        source: "images/lineedit-bg.png"
+        width: parent.width; height: parent.height
+        border { left: 4; top: 4; right: 4; bottom: 4 }
+    }
+
+    BorderImage {
+        source: "images/lineedit-bg-focus.png"
+        width: parent.width; height: parent.height
+        border { left: 4; top: 4; right: 4; bottom: 4 }
+        visible: parent.activeFocus ? true : false
+    }
+
+    Text {
+        id: typeSomething
+        anchors.fill: parent; anchors.leftMargin: 8
+        verticalAlignment: Text.AlignVCenter
+        text: "Type something..."
+        color: "gray"
+        font.italic: true
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        onClicked: { focusScope.focus = true; textInput.openSoftwareInputPanel(); }
+    }
+
+    TextInput {
+        id: textInput
+        anchors { left: parent.left; leftMargin: 8; right: clear.left; rightMargin: 8; verticalCenter: parent.verticalCenter }
+        focus: true
+        selectByMouse: true
+    }
+
+    Image {
+        id: clear
+        anchors { right: parent.right; rightMargin: 8; verticalCenter: parent.verticalCenter }
+        source: "images/clear.png"
+        opacity: 0
+
+        MouseArea {
+            anchors.fill: parent
+            onClicked: { textInput.text = ''; focusScope.focus = true; textInput.openSoftwareInputPanel(); }
+        }
+    }
+
+    states: State {
+        name: "hasText"; when: textInput.text != ''
+        PropertyChanges { target: typeSomething; opacity: 0 }
+        PropertyChanges { target: clear; opacity: 1 }
+    }
+
+    transitions: [
+        Transition {
+            from: ""; to: "hasText"
+            NumberAnimation { exclude: typeSomething; properties: "opacity" }
+        },
+        Transition {
+            from: "hasText"; to: ""
+            NumberAnimation { properties: "opacity" }
+        }
+    ]
+}
diff --git a/examples/quick/ui-components/searchbox/images/clear.png b/examples/quick/ui-components/searchbox/images/clear.png
new file mode 100644
index 0000000000..91eb270695
--- /dev/null
+++ b/examples/quick/ui-components/searchbox/images/clear.png
diff --git a/examples/quick/ui-components/searchbox/images/lineedit-bg-focus.png b/examples/quick/ui-components/searchbox/images/lineedit-bg-focus.png
new file mode 100644
index 0000000000..bbfac38d2d
--- /dev/null
+++ b/examples/quick/ui-components/searchbox/images/lineedit-bg-focus.png
diff --git a/examples/quick/ui-components/searchbox/images/lineedit-bg.png b/examples/quick/ui-components/searchbox/images/lineedit-bg.png
new file mode 100644
index 0000000000..9044226f85
--- /dev/null
+++ b/examples/quick/ui-components/searchbox/images/lineedit-bg.png
diff --git a/examples/quick/ui-components/searchbox/main.qml b/examples/quick/ui-components/searchbox/main.qml
new file mode 100644
index 0000000000..6e9731cf9c
--- /dev/null
+++ b/examples/quick/ui-components/searchbox/main.qml
@@ -0,0 +1,60 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Rectangle {
+    id: page
+    width: 500; height: 250
+    color: "#edecec"
+
+    MouseArea {
+        anchors.fill: parent
+        onClicked: page.focus = false;
+    }
+    Column {
+        anchors { horizontalCenter: parent.horizontalCenter; verticalCenter: parent.verticalCenter }
+        spacing: 10
+
+        SearchBox { id: search1; KeyNavigation.tab: search2; KeyNavigation.backtab: search3; focus: true }
+        SearchBox { id: search2; KeyNavigation.tab: search3; KeyNavigation.backtab: search1 }
+        SearchBox { id: search3; KeyNavigation.tab: search1; KeyNavigation.backtab: search2 }
+    }
+}
diff --git a/examples/quick/ui-components/searchbox/searchbox.qmlproject b/examples/quick/ui-components/searchbox/searchbox.qmlproject
new file mode 100644
index 0000000000..e5a8bf02ca
--- /dev/null
+++ b/examples/quick/ui-components/searchbox/searchbox.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.1
+
+Project {
+    mainFile: "main.qml"
+
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+}
diff --git a/examples/quick/ui-components/slideswitch/content/Switch.qml b/examples/quick/ui-components/slideswitch/content/Switch.qml
new file mode 100644
index 0000000000..482e3eadfd
--- /dev/null
+++ b/examples/quick/ui-components/slideswitch/content/Switch.qml
@@ -0,0 +1,117 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//![0]
+import QtQuick 2.0
+
+Item {
+    id: toggleswitch
+    width: background.width; height: background.height
+
+//![1]
+    property bool on: false
+//![1]
+
+//![2]
+    function toggle() {
+        if (toggleswitch.state == "on")
+            toggleswitch.state = "off";
+        else
+            toggleswitch.state = "on";
+    }
+//![2]
+
+//![3]
+    function releaseSwitch() {
+        if (knob.x == 1) {
+            if (toggleswitch.state == "off") return;
+        }
+        if (knob.x == 78) {
+            if (toggleswitch.state == "on") return;
+        }
+        toggle();
+    }
+//![3]
+
+//![4]
+    Image {
+        id: background
+        source: "background.png"
+        MouseArea { anchors.fill: parent; onClicked: toggle() }
+    }
+//![4]
+
+//![5]
+    Image {
+        id: knob
+        x: 1; y: 2
+        source: "knob.png"
+
+        MouseArea {
+            anchors.fill: parent
+            drag.target: knob; drag.axis: Drag.XAxis; drag.minimumX: 1; drag.maximumX: 78
+            onClicked: toggle()
+            onReleased: releaseSwitch()
+        }
+    }
+//![5]
+
+//![6]
+    states: [
+        State {
+            name: "on"
+            PropertyChanges { target: knob; x: 78 }
+            PropertyChanges { target: toggleswitch; on: true }
+        },
+        State {
+            name: "off"
+            PropertyChanges { target: knob; x: 1 }
+            PropertyChanges { target: toggleswitch; on: false }
+        }
+    ]
+//![6]
+
+//![7]
+    transitions: Transition {
+        NumberAnimation { properties: "x"; easing.type: Easing.InOutQuad; duration: 200 }
+    }
+//![7]
+}
+//![0]
diff --git a/examples/quick/ui-components/slideswitch/content/background.png b/examples/quick/ui-components/slideswitch/content/background.png
new file mode 100644
index 0000000000..d736815870
--- /dev/null
+++ b/examples/quick/ui-components/slideswitch/content/background.png
diff --git a/examples/quick/ui-components/slideswitch/content/background.svg b/examples/quick/ui-components/slideswitch/content/background.svg
new file mode 100644
index 0000000000..d82fd8fb83
--- /dev/null
+++ b/examples/quick/ui-components/slideswitch/content/background.svg
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 13.0.2, SVG Export Plug-In  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
+    <!ENTITY ns_flows "http://ns.adobe.com/Flows/1.0/">
+]>
+<svg version="1.1"
+     xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
+     x="0px" y="0px" width="130px" height="56px" viewBox="0 0 130 56" enable-background="new 0 0 130 56" xml:space="preserve">
+<defs>
+</defs>
+<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-37.5005" y1="-66" x2="-37.5005" y2="-121.9985" gradientTransform="matrix(1 0 0 -1 102.5 -66)">
+    <stop  offset="0.0056" style="stop-color:#000000"/>
+    <stop  offset="1" style="stop-color:#EAECEF"/>
+</linearGradient>
+<path fill="url(#SVGID_1_)" d="M101.998,55.998H28c-15.439,0-28-12.562-28-28C0,12.56,12.561,0,28,0h73.998
+    c15.439,0,28,12.559,28,27.998C129.998,43.438,117.438,55.998,101.998,55.998L101.998,55.998z"/>
+<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="-5.5" y1="-132.1338" x2="-69.5002" y2="-55.8613" gradientTransform="matrix(1 0 0 -1 102.5 -66)">
+    <stop  offset="0.0056" style="stop-color:#000000"/>
+    <stop  offset="1" style="stop-color:#828385"/>
+</linearGradient>
+<path fill="url(#SVGID_2_)" d="M127.999,27.998c0,14.359-11.642,26-26,26h-74c-14.359,0-26-11.641-26-26l0,0
+    c0-14.359,11.641-26,26-26h74C116.357,1.998,127.999,13.639,127.999,27.998L127.999,27.998z"/>
+</svg>
diff --git a/examples/quick/ui-components/slideswitch/content/knob.png b/examples/quick/ui-components/slideswitch/content/knob.png
new file mode 100644
index 0000000000..ee0a436f84
--- /dev/null
+++ b/examples/quick/ui-components/slideswitch/content/knob.png
diff --git a/examples/quick/ui-components/slideswitch/content/knob.svg b/examples/quick/ui-components/slideswitch/content/knob.svg
new file mode 100644
index 0000000000..a14019298d
--- /dev/null
+++ b/examples/quick/ui-components/slideswitch/content/knob.svg
@@ -0,0 +1,867 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 13.0.2, SVG Export Plug-In  -->
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://web.resource.org/cc/"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.1"
+   x="0px"
+   y="0px"
+   width="52px"
+   height="52px"
+   viewBox="0 0 52 52"
+   enable-background="new 0 0 52 52"
+   xml:space="preserve"
+   id="svg3883"
+   sodipodi:version="0.32"
+   inkscape:version="0.44.1"
+   sodipodi:docname="knob_on.svg"
+   sodipodi:docbase="/local/axel/embeddedwidgets/embeddedstories/skins/svgslideswitch/MetallicBrush"><metadata
+   id="metadata4200"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><sodipodi:namedview
+   inkscape:window-height="640"
+   inkscape:window-width="937"
+   inkscape:pageshadow="2"
+   inkscape:pageopacity="0.0"
+   guidetolerance="10.0"
+   gridtolerance="10.0"
+   objecttolerance="10.0"
+   borderopacity="1.0"
+   bordercolor="#666666"
+   pagecolor="#ffffff"
+   id="base"
+   inkscape:zoom="8.3653846"
+   inkscape:cx="26.000002"
+   inkscape:cy="26"
+   inkscape:window-x="0"
+   inkscape:window-y="0"
+   inkscape:current-layer="svg3883" />
+<defs
+   id="defs3885">
+</defs>
+<linearGradient
+   id="SVGID_1_"
+   gradientUnits="userSpaceOnUse"
+   x1="-59.7866"
+   y1="-115.917"
+   x2="-93.2123"
+   y2="-76.0818"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#000000"
+   id="stop3888" />
+    <stop
+   offset="1"
+   style="stop-color:#EAECEF"
+   id="stop3890" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="26"
+   id="circle3892"
+   style="fill:url(#SVGID_1_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="26"
+   sodipodi:ry="26"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_2_"
+   gradientUnits="userSpaceOnUse"
+   x1="-100.5"
+   y1="-96"
+   x2="-52.5"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop3895" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop3897" />
+    <stop
+   offset="0.6043"
+   style="stop-color:#E7EAED"
+   id="stop3899" />
+    <stop
+   offset="0.6751"
+   style="stop-color:#DEE4E7"
+   id="stop3901" />
+    <stop
+   offset="0.7358"
+   style="stop-color:#CFD9DD"
+   id="stop3903" />
+    <stop
+   offset="0.791"
+   style="stop-color:#B9CACF"
+   id="stop3905" />
+    <stop
+   offset="0.8425"
+   style="stop-color:#9EB6BD"
+   id="stop3907" />
+    <stop
+   offset="0.891"
+   style="stop-color:#7B9EA7"
+   id="stop3909" />
+    <stop
+   offset="0.9374"
+   style="stop-color:#53828C"
+   id="stop3911" />
+    <stop
+   offset="0.9809"
+   style="stop-color:#25626E"
+   id="stop3913" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop3915" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="24"
+   id="circle3917"
+   style="fill:url(#SVGID_2_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="24"
+   sodipodi:ry="24"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_3_"
+   gradientUnits="userSpaceOnUse"
+   x1="-98.6328"
+   y1="-96"
+   x2="-54.3672"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop3920" />
+    <stop
+   offset="0.073"
+   style="stop-color:#8FAECB"
+   id="stop3922" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop3924" />
+    <stop
+   offset="0.5902"
+   style="stop-color:#E7E9ED"
+   id="stop3926" />
+    <stop
+   offset="0.618"
+   style="stop-color:#E4E7EB"
+   id="stop3928" />
+    <stop
+   offset="0.6697"
+   style="stop-color:#E0E4E9"
+   id="stop3930" />
+    <stop
+   offset="0.7211"
+   style="stop-color:#D4DCE1"
+   id="stop3932" />
+    <stop
+   offset="0.7722"
+   style="stop-color:#C0CFD5"
+   id="stop3934" />
+    <stop
+   offset="0.809"
+   style="stop-color:#ADC2C9"
+   id="stop3936" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop3938" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="22.132999"
+   id="circle3940"
+   style="fill:url(#SVGID_3_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="22.132999"
+   sodipodi:ry="22.132999"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_4_"
+   gradientUnits="userSpaceOnUse"
+   x1="-96.7671"
+   y1="-96"
+   x2="-56.2324"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop3943" />
+    <stop
+   offset="0.073"
+   style="stop-color:#86A7C4"
+   id="stop3945" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop3947" />
+    <stop
+   offset="0.577"
+   style="stop-color:#E7EAED"
+   id="stop3949" />
+    <stop
+   offset="0.618"
+   style="stop-color:#E1E6EA"
+   id="stop3951" />
+    <stop
+   offset="0.6697"
+   style="stop-color:#DDE3E8"
+   id="stop3953" />
+    <stop
+   offset="0.7211"
+   style="stop-color:#D1DBE1"
+   id="stop3955" />
+    <stop
+   offset="0.7722"
+   style="stop-color:#BDCDD5"
+   id="stop3957" />
+    <stop
+   offset="0.809"
+   style="stop-color:#AAC0CA"
+   id="stop3959" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop3961" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="20.267"
+   id="circle3963"
+   style="fill:url(#SVGID_4_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="20.267"
+   sodipodi:ry="20.267"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_5_"
+   gradientUnits="userSpaceOnUse"
+   x1="-94.8999"
+   y1="-96"
+   x2="-58.0996"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop3966" />
+    <stop
+   offset="0.073"
+   style="stop-color:#7E9FBC"
+   id="stop3968" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop3970" />
+    <stop
+   offset="0.5709"
+   style="stop-color:#E6E9ED"
+   id="stop3972" />
+    <stop
+   offset="0.618"
+   style="stop-color:#DFE4E9"
+   id="stop3974" />
+    <stop
+   offset="0.6687"
+   style="stop-color:#DBE1E7"
+   id="stop3976" />
+    <stop
+   offset="0.7193"
+   style="stop-color:#CFD9E0"
+   id="stop3978" />
+    <stop
+   offset="0.7695"
+   style="stop-color:#BBCCD6"
+   id="stop3980" />
+    <stop
+   offset="0.809"
+   style="stop-color:#A6BECA"
+   id="stop3982" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop3984" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="18.4"
+   id="circle3986"
+   style="fill:url(#SVGID_5_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="18.4"
+   sodipodi:ry="18.4"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_6_"
+   gradientUnits="userSpaceOnUse"
+   x1="-93.0332"
+   y1="-96"
+   x2="-59.9668"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop3989" />
+    <stop
+   offset="0.073"
+   style="stop-color:#7697B4"
+   id="stop3991" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop3993" />
+    <stop
+   offset="0.5636"
+   style="stop-color:#E6E9ED"
+   id="stop3995" />
+    <stop
+   offset="0.618"
+   style="stop-color:#DCE2E8"
+   id="stop3997" />
+    <stop
+   offset="0.6687"
+   style="stop-color:#D8DFE6"
+   id="stop3999" />
+    <stop
+   offset="0.7193"
+   style="stop-color:#CCD7E0"
+   id="stop4001" />
+    <stop
+   offset="0.7695"
+   style="stop-color:#B8CAD5"
+   id="stop4003" />
+    <stop
+   offset="0.809"
+   style="stop-color:#A3BCCA"
+   id="stop4005" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4007" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="16.533001"
+   id="circle4009"
+   style="fill:url(#SVGID_6_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="16.533001"
+   sodipodi:ry="16.533001"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_7_"
+   gradientUnits="userSpaceOnUse"
+   x1="-91.167"
+   y1="-96"
+   x2="-61.833"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop4012" />
+    <stop
+   offset="0.073"
+   style="stop-color:#6D8FAD"
+   id="stop4014" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop4016" />
+    <stop
+   offset="0.5605"
+   style="stop-color:#E5E8EC"
+   id="stop4018" />
+    <stop
+   offset="0.618"
+   style="stop-color:#DAE1E7"
+   id="stop4020" />
+    <stop
+   offset="0.6679"
+   style="stop-color:#D6DEE5"
+   id="stop4022" />
+    <stop
+   offset="0.7175"
+   style="stop-color:#CAD6DF"
+   id="stop4024" />
+    <stop
+   offset="0.7669"
+   style="stop-color:#B6C9D6"
+   id="stop4026" />
+    <stop
+   offset="0.809"
+   style="stop-color:#9FBACB"
+   id="stop4028" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4030" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="14.667"
+   id="circle4032"
+   style="fill:url(#SVGID_7_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="14.667"
+   sodipodi:ry="14.667"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_8_"
+   gradientUnits="userSpaceOnUse"
+   x1="-89.2998"
+   y1="-96"
+   x2="-63.7002"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop4035" />
+    <stop
+   offset="0.073"
+   style="stop-color:#6587A5"
+   id="stop4037" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop4039" />
+    <stop
+   offset="0.5588"
+   style="stop-color:#E4E8EC"
+   id="stop4041" />
+    <stop
+   offset="0.618"
+   style="stop-color:#D8DFE7"
+   id="stop4043" />
+    <stop
+   offset="0.6675"
+   style="stop-color:#D4DCE5"
+   id="stop4045" />
+    <stop
+   offset="0.7167"
+   style="stop-color:#C8D5E0"
+   id="stop4047" />
+    <stop
+   offset="0.7657"
+   style="stop-color:#B4C8D6"
+   id="stop4049" />
+    <stop
+   offset="0.809"
+   style="stop-color:#9CB8CB"
+   id="stop4051" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4053" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="12.8"
+   id="circle4055"
+   style="fill:url(#SVGID_8_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="12.8"
+   sodipodi:ry="12.8"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_9_"
+   gradientUnits="userSpaceOnUse"
+   x1="-87.4331"
+   y1="-96"
+   x2="-65.5664"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop4058" />
+    <stop
+   offset="0.073"
+   style="stop-color:#5D809D"
+   id="stop4060" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop4062" />
+    <stop
+   offset="0.5567"
+   style="stop-color:#E3E7EC"
+   id="stop4064" />
+    <stop
+   offset="0.618"
+   style="stop-color:#D5DDE6"
+   id="stop4066" />
+    <stop
+   offset="0.6671"
+   style="stop-color:#D1DAE4"
+   id="stop4068" />
+    <stop
+   offset="0.7159"
+   style="stop-color:#C5D3DF"
+   id="stop4070" />
+    <stop
+   offset="0.7645"
+   style="stop-color:#B1C6D6"
+   id="stop4072" />
+    <stop
+   offset="0.809"
+   style="stop-color:#98B5CB"
+   id="stop4074" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4076" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="10.933"
+   id="circle4078"
+   style="fill:url(#SVGID_9_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="10.933"
+   sodipodi:ry="10.933"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_10_"
+   gradientUnits="userSpaceOnUse"
+   x1="-85.5659"
+   y1="-96"
+   x2="-67.4336"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop4081" />
+    <stop
+   offset="0.073"
+   style="stop-color:#547896"
+   id="stop4083" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop4085" />
+    <stop
+   offset="0.5588"
+   style="stop-color:#E1E6EB"
+   id="stop4087" />
+    <stop
+   offset="0.618"
+   style="stop-color:#D3DCE5"
+   id="stop4089" />
+    <stop
+   offset="0.6663"
+   style="stop-color:#CFD9E3"
+   id="stop4091" />
+    <stop
+   offset="0.7143"
+   style="stop-color:#C3D2DF"
+   id="stop4093" />
+    <stop
+   offset="0.7621"
+   style="stop-color:#AFC5D7"
+   id="stop4095" />
+    <stop
+   offset="0.809"
+   style="stop-color:#94B3CC"
+   id="stop4097" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4099" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="9.066"
+   id="circle4101"
+   style="fill:url(#SVGID_10_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="9.066"
+   sodipodi:ry="9.066"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_11_"
+   gradientUnits="userSpaceOnUse"
+   x1="-83.7002"
+   y1="-96"
+   x2="-69.2998"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop4104" />
+    <stop
+   offset="0.073"
+   style="stop-color:#4C708E"
+   id="stop4106" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop4108" />
+    <stop
+   offset="0.5625"
+   style="stop-color:#DEE4EA"
+   id="stop4110" />
+    <stop
+   offset="0.618"
+   style="stop-color:#D0DAE4"
+   id="stop4112" />
+    <stop
+   offset="0.6663"
+   style="stop-color:#CCD7E2"
+   id="stop4114" />
+    <stop
+   offset="0.7143"
+   style="stop-color:#C0D0DE"
+   id="stop4116" />
+    <stop
+   offset="0.7621"
+   style="stop-color:#ACC3D6"
+   id="stop4118" />
+    <stop
+   offset="0.809"
+   style="stop-color:#91B1CC"
+   id="stop4120" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4122" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="7.1999998"
+   id="circle4124"
+   style="fill:url(#SVGID_11_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="7.1999998"
+   sodipodi:ry="7.1999998"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_12_"
+   gradientUnits="userSpaceOnUse"
+   x1="-81.833"
+   y1="-96"
+   x2="-71.167"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop4127" />
+    <stop
+   offset="0.073"
+   style="stop-color:#446986"
+   id="stop4129" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop4131" />
+    <stop
+   offset="0.5757"
+   style="stop-color:#D9E0E8"
+   id="stop4133" />
+    <stop
+   offset="0.618"
+   style="stop-color:#CED8E3"
+   id="stop4135" />
+    <stop
+   offset="0.6655"
+   style="stop-color:#CAD5E2"
+   id="stop4137" />
+    <stop
+   offset="0.7129"
+   style="stop-color:#BECEDD"
+   id="stop4139" />
+    <stop
+   offset="0.7601"
+   style="stop-color:#AAC1D6"
+   id="stop4141" />
+    <stop
+   offset="0.807"
+   style="stop-color:#8EB0CC"
+   id="stop4143" />
+    <stop
+   offset="0.809"
+   style="stop-color:#8DAFCC"
+   id="stop4145" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4147" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="5.3330002"
+   id="circle4149"
+   style="fill:url(#SVGID_12_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="5.3330002"
+   sodipodi:ry="5.3330002"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_13_"
+   gradientUnits="userSpaceOnUse"
+   x1="-79.9658"
+   y1="-96"
+   x2="-73.0342"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop4152" />
+    <stop
+   offset="0.073"
+   style="stop-color:#3B617F"
+   id="stop4154" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop4156" />
+    <stop
+   offset="0.6087"
+   style="stop-color:#CED9E3"
+   id="stop4158" />
+    <stop
+   offset="0.618"
+   style="stop-color:#CBD7E2"
+   id="stop4160" />
+    <stop
+   offset="0.6655"
+   style="stop-color:#C7D4E1"
+   id="stop4162" />
+    <stop
+   offset="0.7129"
+   style="stop-color:#BBCDDD"
+   id="stop4164" />
+    <stop
+   offset="0.7601"
+   style="stop-color:#A7C0D6"
+   id="stop4166" />
+    <stop
+   offset="0.807"
+   style="stop-color:#8BAECD"
+   id="stop4168" />
+    <stop
+   offset="0.809"
+   style="stop-color:#8AADCD"
+   id="stop4170" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4172" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="3.4660001"
+   id="circle4174"
+   style="fill:url(#SVGID_13_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="3.4660001"
+   sodipodi:ry="3.4660001"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+<linearGradient
+   id="SVGID_14_"
+   gradientUnits="userSpaceOnUse"
+   x1="-78.1001"
+   y1="-96"
+   x2="-74.9004"
+   y2="-96"
+   gradientTransform="matrix(1,0,0,-1,102.5,-70)">
+    <stop
+   offset="0.0056"
+   style="stop-color:#8AADCE"
+   id="stop4177" />
+    <stop
+   offset="0.073"
+   style="stop-color:#335977"
+   id="stop4179" />
+    <stop
+   offset="0.5"
+   style="stop-color:#EAECEF"
+   id="stop4181" />
+    <stop
+   offset="0.618"
+   style="stop-color:#C9D5E1"
+   id="stop4183" />
+    <stop
+   offset="0.6648"
+   style="stop-color:#C5D3E0"
+   id="stop4185" />
+    <stop
+   offset="0.7114"
+   style="stop-color:#B9CBDC"
+   id="stop4187" />
+    <stop
+   offset="0.758"
+   style="stop-color:#A5BFD6"
+   id="stop4189" />
+    <stop
+   offset="0.8042"
+   style="stop-color:#89ADCE"
+   id="stop4191" />
+    <stop
+   offset="0.809"
+   style="stop-color:#86ABCD"
+   id="stop4193" />
+    <stop
+   offset="1"
+   style="stop-color:#0E525F"
+   id="stop4195" />
+</linearGradient>
+<circle
+   cx="26"
+   cy="26"
+   r="1.6"
+   id="circle4197"
+   style="fill:url(#SVGID_14_)"
+   sodipodi:cx="26"
+   sodipodi:cy="26"
+   sodipodi:rx="1.6"
+   sodipodi:ry="1.6"
+   transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
+</svg>
diff --git a/examples/quick/ui-components/slideswitch/slideswitch.qml b/examples/quick/ui-components/slideswitch/slideswitch.qml
new file mode 100644
index 0000000000..60a331407c
--- /dev/null
+++ b/examples/quick/ui-components/slideswitch/slideswitch.qml
@@ -0,0 +1,51 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import "content"
+
+Rectangle {
+    color: "white"
+    width: 400; height: 250
+
+//![0]
+    Switch { anchors.centerIn: parent; on: false }
+//![0]
+}
diff --git a/examples/quick/ui-components/spinner/content/Spinner.qml b/examples/quick/ui-components/spinner/content/Spinner.qml
new file mode 100644
index 0000000000..d7bbeb33ee
--- /dev/null
+++ b/examples/quick/ui-components/spinner/content/Spinner.qml
@@ -0,0 +1,70 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Image {
+    property alias model: view.model
+    property alias delegate: view.delegate
+    property alias currentIndex: view.currentIndex
+    property real itemHeight: 30
+
+    source: "spinner-bg.png"
+    clip: true
+
+    PathView {
+        id: view
+        anchors.fill: parent
+
+        pathItemCount: height/itemHeight
+        preferredHighlightBegin: 0.5
+        preferredHighlightEnd: 0.5
+        highlight: Image { source: "spinner-select.png"; width: view.width; height: itemHeight+4 }
+        dragMargin: view.width/2
+
+        path: Path {
+            startX: view.width/2; startY: -itemHeight/2
+            PathLine { x: view.width/2; y: view.pathItemCount*itemHeight + itemHeight }
+        }
+    }
+
+    Keys.onDownPressed: view.incrementCurrentIndex()
+    Keys.onUpPressed: view.decrementCurrentIndex()
+}
diff --git a/examples/quick/ui-components/spinner/content/spinner-bg.png b/examples/quick/ui-components/spinner/content/spinner-bg.png
new file mode 100644
index 0000000000..b3556f1f9f
--- /dev/null
+++ b/examples/quick/ui-components/spinner/content/spinner-bg.png
diff --git a/examples/quick/ui-components/spinner/content/spinner-select.png b/examples/quick/ui-components/spinner/content/spinner-select.png
new file mode 100644
index 0000000000..95a17a1fe2
--- /dev/null
+++ b/examples/quick/ui-components/spinner/content/spinner-select.png
diff --git a/examples/quick/ui-components/spinner/main.qml b/examples/quick/ui-components/spinner/main.qml
new file mode 100644
index 0000000000..7584c98396
--- /dev/null
+++ b/examples/quick/ui-components/spinner/main.qml
@@ -0,0 +1,61 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import "content"
+
+Rectangle {
+    width: 240; height: 320
+
+    Column {
+        y: 20; x: 20; spacing: 20
+
+        Spinner {
+            id: spinner
+            width: 200; height: 240
+            focus: true
+            model: 20
+            itemHeight: 30
+            delegate: Text { font.pixelSize: 25; text: index; height: 30 }
+        }
+
+        Text { text: "Current item index: " + spinner.currentIndex }
+    }
+}
diff --git a/examples/quick/ui-components/spinner/spinner.qmlproject b/examples/quick/ui-components/spinner/spinner.qmlproject
new file mode 100644
index 0000000000..e5a8bf02ca
--- /dev/null
+++ b/examples/quick/ui-components/spinner/spinner.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.1
+
+Project {
+    mainFile: "main.qml"
+
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+}
diff --git a/examples/quick/ui-components/tabwidget/TabWidget.qml b/examples/quick/ui-components/tabwidget/TabWidget.qml
new file mode 100644
index 0000000000..560ed1f58a
--- /dev/null
+++ b/examples/quick/ui-components/tabwidget/TabWidget.qml
@@ -0,0 +1,102 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Item {
+    id: tabWidget
+
+    // Setting the default property to stack.children means any child items
+    // of the TabWidget are actually added to the 'stack' item's children.
+    // See the "Property Binding"
+    // documentation for details on default properties.
+    default property alias content: stack.children
+
+    property int current: 0
+
+    onCurrentChanged: setOpacities()
+    Component.onCompleted: setOpacities()
+
+    function setOpacities() {
+        for (var i = 0; i < stack.children.length; ++i) {
+            stack.children[i].opacity = (i == current ? 1 : 0)
+        }
+    }
+
+    Row {
+        id: header
+
+        Repeater {
+            model: stack.children.length
+            delegate: Rectangle {
+                width: tabWidget.width / stack.children.length; height: 36
+
+                Rectangle {
+                    width: parent.width; height: 1
+                    anchors { bottom: parent.bottom; bottomMargin: 1 }
+                    color: "#acb2c2"
+                }
+                BorderImage {
+                    anchors { fill: parent; leftMargin: 2; topMargin: 5; rightMargin: 1 }
+                    border { left: 7; right: 7 }
+                    source: "tab.png"
+                    visible: tabWidget.current == index
+                }
+                Text {
+                    horizontalAlignment: Qt.AlignHCenter; verticalAlignment: Qt.AlignVCenter
+                    anchors.fill: parent
+                    text: stack.children[index].title
+                    elide: Text.ElideRight
+                    font.bold: tabWidget.current == index
+                }
+                MouseArea {
+                    anchors.fill: parent
+                    onClicked: tabWidget.current = index
+                }
+            }
+        }
+    }
+
+    Item {
+        id: stack
+        width: tabWidget.width
+        anchors.top: header.bottom; anchors.bottom: tabWidget.bottom
+    }
+}
diff --git a/examples/quick/ui-components/tabwidget/main.qml b/examples/quick/ui-components/tabwidget/main.qml
new file mode 100644
index 0000000000..df99c11b7d
--- /dev/null
+++ b/examples/quick/ui-components/tabwidget/main.qml
@@ -0,0 +1,99 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+**     the names of its contributors may be used to endorse or promote
+**     products derived from this software without specific prior written
+**     permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+TabWidget {
+    id: tabs
+    width: 640; height: 480
+
+    Rectangle {
+        property string title: "Red"
+        anchors.fill: parent
+        color: "#e3e3e3"
+
+        Rectangle {
+            anchors.fill: parent; anchors.margins: 20
+            color: "#ff7f7f"
+            Text {
+                width: parent.width - 20
+                anchors.centerIn: parent; horizontalAlignment: Qt.AlignHCenter
+                text: "Roses are red"
+                font.pixelSize: 20
+                wrapMode: Text.WordWrap
+            }
+        }
+    }
+
+    Rectangle {
+        property string title: "Green"
+        anchors.fill: parent
+        color: "#e3e3e3"
+
+        Rectangle {
+            anchors.fill: parent; anchors.margins: 20
+            color: "#7fff7f"
+            Text {
+                width: parent.width - 20
+                anchors.centerIn: parent; horizontalAlignment: Qt.AlignHCenter
+                text: "Flower stems are green"
+                font.pixelSize: 20
+                wrapMode: Text.WordWrap
+            }
+        }
+    }
+
+    Rectangle {
+        property string title: "Blue"
+        anchors.fill: parent; color: "#e3e3e3"
+
+        Rectangle {
+            anchors.fill: parent; anchors.margins: 20
+            color: "#7f7fff"
+            Text {
+                width: parent.width - 20
+                anchors.centerIn: parent; horizontalAlignment: Qt.AlignHCenter
+                text: "Violets are blue"
+                font.pixelSize: 20
+                wrapMode: Text.WordWrap
+            }
+        }
+    }
+}
diff --git a/examples/quick/ui-components/tabwidget/tab.png b/examples/quick/ui-components/tabwidget/tab.png
new file mode 100644
index 0000000000..ad8021605f
--- /dev/null
+++ b/examples/quick/ui-components/tabwidget/tab.png
diff --git a/examples/quick/ui-components/tabwidget/tabwidget.qmlproject b/examples/quick/ui-components/tabwidget/tabwidget.qmlproject
new file mode 100644
index 0000000000..e5a8bf02ca
--- /dev/null
+++ b/examples/quick/ui-components/tabwidget/tabwidget.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.1
+
+Project {
+    mainFile: "main.qml"
+
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+}