Integrate some QML examples and demos into qtdemo

Includes minor changes and additions to the existing doc and examples,
so that they follow Qt conventions better.

Note that while blurring the background was part of the plan for the
embedded QML viewer I could not get it to perform well enough. In the
future, when blur is fast enough (or someone else can get it to
perform better than I) -use-blur should become the default, and
-no-blur the option.

Task-number: QTBUG-10582

52 files changed, 452 insertions, 47 deletions

diff --git a/demos/qtdemo/MagicAnim.qml b/demos/qtdemo/MagicAnim.qml
new file mode 100644
index 0000000000..f2ee80630f
--- /dev/null
+++ b/demos/qtdemo/MagicAnim.qml
@@ -0,0 +1,19 @@
+import Qt 4.7
+
+//Emulates the in animation of the menu elements
+SequentialAnimation{
+    id: main;
+    property Item target
+    property int from: 0
+    property int to: 100
+    property int duration: 1000
+    property string properties: "y"
+    PauseAnimation { duration: main.duration*0.20 }
+    NumberAnimation { target: main.target; properties: main.properties; from: main.from; to: main.to + 40; duration: main.duration*0.30 }
+    NumberAnimation { target: main.target; properties: main.properties; from: main.to + 40; to: main.to; duration: main.duration*0.10 }
+    NumberAnimation { target: main.target; properties: main.properties; from: main.to; to: main.to + 20; duration: main.duration*0.10 }
+    NumberAnimation { target: main.target; properties: main.properties; from: main.to + 20; to: main.to; duration: main.duration*0.10 }
+    NumberAnimation { target: main.target; properties: main.properties; from: main.to; to: main.to + 8; duration: main.duration*0.10 }
+    NumberAnimation { target: main.target; properties: main.properties; from: main.to + 8; to: main.to; duration: main.duration*0.10 }
+}
+
diff --git a/demos/qtdemo/colors.cpp b/demos/qtdemo/colors.cpp
index 802d77d232..07cf1627ed 100644
--- a/demos/qtdemo/colors.cpp
+++ b/demos/qtdemo/colors.cpp
@@ -81,6 +81,7 @@ bool Colors::noRescale = false;
 bool Colors::noAnimations = false;
 bool Colors::noBlending = false;
 bool Colors::noScreenSync = false;
+bool Colors::noBlur = true;
 bool Colors::fullscreen = false;
 bool Colors::usePixmaps = false;
 bool Colors::useLoop = false;
@@ -232,6 +233,8 @@ void Colors::parseArgs(int argc, char *argv[])
             Colors::showFps = true;
         else if (s == "-no-blending")
             Colors::noBlending = true;
+        else if (s == "-use-blur")
+            Colors::noBlur = false;
         else if (s == "-no-sync")
             Colors::noScreenSync = true;
         else if (s.startsWith("-menu"))
@@ -295,6 +298,7 @@ void Colors::setLowSettings()
     Colors::usePixmaps = true;
     Colors::noAnimations = true;
     Colors::noBlending = true;
+    Colors::noBlur = true;
 }
 
 void Colors::detectSystemResources()
diff --git a/demos/qtdemo/colors.h b/demos/qtdemo/colors.h
index 1e0b795970..2d58058e7a 100644
--- a/demos/qtdemo/colors.h
+++ b/demos/qtdemo/colors.h
@@ -91,6 +91,7 @@ public:
     static bool noAnimations;
     static bool noBlending;
     static bool noScreenSync;
+    static bool noBlur;
     static bool useLoop;
     static bool noWindowMask;
     static bool usePixmaps;
diff --git a/demos/qtdemo/mainwindow.cpp b/demos/qtdemo/mainwindow.cpp
index a679c4f505..45ec9a6d43 100644
--- a/demos/qtdemo/mainwindow.cpp
+++ b/demos/qtdemo/mainwindow.cpp
@@ -270,8 +270,10 @@ void MainWindow::setupSceneItems()
         this->fpsLabel->setPos(Colors::stageStartX, 600 - QFontMetricsF(Colors::buttonFont()).height() - 5);
     }
 
-    this->companyLogo = new ImageItem(QImage(":/images/trolltech-logo.png"), 1000, 1000, this->scene, 0, true, 0.5f);
-    this->qtLogo = new ImageItem(QImage(":/images/qtlogo_small.png"), 1000, 1000, this->scene, 0, true, 0.5f);
+    this->mainSceneRoot = new QGraphicsWidget();
+    this->scene->addItem(mainSceneRoot);
+    this->companyLogo = new ImageItem(QImage(":/images/trolltech-logo.png"), 1000, 1000, this->scene, mainSceneRoot, true, 0.5f);
+    this->qtLogo = new ImageItem(QImage(":/images/qtlogo_small.png"), 1000, 1000, this->scene, mainSceneRoot, true, 0.5f);
     this->companyLogo->setZValue(100);
     this->qtLogo->setZValue(100);
     this->pausedLabel = new DemoTextItem(QString("PAUSED"), Colors::buttonFont(), Qt::white, -1, this->scene, 0);
@@ -308,6 +310,20 @@ void MainWindow::checkAdapt()
                qDebug() << "- benchmark adaption: removed ticker (fps < 30)";
         }
 
+        //Note: Because we don't adapt later in the program, if blur makes FPS plummet then we won't catch it
+        if (!Colors::noBlur && MenuManager::instance()->mainSceneBlur && this->mainSceneRoot){
+            Colors::noBlur = true;
+            this->mainSceneRoot->setGraphicsEffect(0);
+            MenuManager::instance()->mainSceneBlur = 0;
+            if(MenuManager::instance()->qmlRoot){
+                MenuManager::instance()->qmlRoot->setGraphicsEffect(0);
+                MenuManager::instance()->declarativeEngine->rootContext()->setContextProperty("realBlur", 0);
+            }
+            MenuManager::instance()->qmlShadow = 0;
+            if (Colors::verbose)
+               qDebug() << "- benchmark adaption: removed blur (fps < 30)";
+        }
+
         if (this->fpsMedian < 20){
             Colors::noAnimations = true;
             if (Colors::verbose)
@@ -376,7 +392,7 @@ void MainWindow::keyPressEvent(QKeyEvent *event)
         this->loop = false;
         QApplication::quit();
     }
-    else if (event->key() == Qt::Key_1){
+    else if (event->key() == Qt::Key_F1){
             QString s("");
             s += "Rendering system: ";
             if (Colors::openGlRendering)
@@ -415,6 +431,7 @@ void MainWindow::keyPressEvent(QKeyEvent *event)
             s += Colors::noScreenSync ? "no" : "yes";
             QMessageBox::information(0, QString("Current configuration"), s);
     }
+    QGraphicsView::keyPressEvent(event);
 }
 
 void MainWindow::focusInEvent(QFocusEvent *)
diff --git a/demos/qtdemo/mainwindow.h b/demos/qtdemo/mainwindow.h
index edcc14695d..e61326827f 100644
--- a/demos/qtdemo/mainwindow.h
+++ b/demos/qtdemo/mainwindow.h
@@ -43,6 +43,7 @@
 #define MAIN_WINDOW_H
 
 #include <QtGui>
+#include <QtDeclarative>
 #include <QPixmap>
 
 class DemoTextItem;
@@ -62,6 +63,8 @@ public:
     void start();
 
     QGraphicsScene *scene;
+    QGraphicsWidget* mainSceneRoot;
+
     bool loop;
 
     // FPS stuff:
diff --git a/demos/qtdemo/menumanager.cpp b/demos/qtdemo/menumanager.cpp
index 40af30fed0..9eb5664317 100644
--- a/demos/qtdemo/menumanager.cpp
+++ b/demos/qtdemo/menumanager.cpp
@@ -59,6 +59,8 @@ MenuManager::MenuManager()
     this->tickerInAnim = 0;
     this->upButton = 0;
     this->downButton = 0;
+    this->mainSceneBlur = 0;
+    this->qmlShadow = 0;
     this->helpEngine = 0;
     this->score = new Score();
     this->currentMenu = QLatin1String("[no menu visible]");
@@ -152,6 +154,9 @@ void MenuManager::itemSelected(int userCode, const QString &menuName)
     case LAUNCH:
         this->launchExample(this->currentInfo);
         break;
+    case LAUNCH_QML:
+        this->launchQmlExample(this->currentInfo);
+        break;
     case DOCUMENTATION:
         this->showDocInAssistant(this->currentInfo);
         break;
@@ -169,6 +174,8 @@ void MenuManager::itemSelected(int userCode, const QString &menuName)
         this->score->queueMovie(this->currentInfo + " -out");
         this->score->queueMovie(this->currentInfo + " -buttons -out", Score::NEW_ANIMATION_ONLY);
         this->score->queueMovie("back -out", Score::ONLY_IF_VISIBLE);
+        if(qmlRoot)
+            qmlRoot->setProperty("show", QVariant(false));
         // book-keeping:
         this->currentMenuCode = ROOT;
         this->currentMenu = menuName + " -menu1";
@@ -191,6 +198,8 @@ void MenuManager::itemSelected(int userCode, const QString &menuName)
         this->score->queueMovie(this->currentMenu + " -out", Score::FROM_START, Score::LOCK_ITEMS);
         this->score->queueMovie(this->currentMenuButtons + " -out", Score::FROM_START, Score::LOCK_ITEMS);
         this->score->queueMovie(this->currentInfo + " -out");
+        if(qmlRoot)
+            qmlRoot->setProperty("show", QVariant(false));
         // book-keeping:
         this->currentMenuCode = MENU1;
         this->currentCategory = menuName;
@@ -208,6 +217,8 @@ void MenuManager::itemSelected(int userCode, const QString &menuName)
         // out:
         this->score->queueMovie(this->currentInfo + " -out", Score::NEW_ANIMATION_ONLY);
         this->score->queueMovie(this->currentInfo + " -buttons -out", Score::NEW_ANIMATION_ONLY);
+        if(qmlRoot)
+            qmlRoot->setProperty("show", QVariant(false));
         // book-keeping:
         this->currentMenuCode = MENU2;
         this->currentInfo = menuName;
@@ -242,6 +253,8 @@ void MenuManager::itemSelected(int userCode, const QString &menuName)
             // out:
             this->score->queueMovie(this->currentInfo + " -out", Score::NEW_ANIMATION_ONLY);
             this->score->queueMovie(this->currentInfo + " -buttons -out", Score::NEW_ANIMATION_ONLY);
+            if(qmlRoot)
+                qmlRoot->setProperty("show", QVariant(false));
             // book-keeping:
             this->currentMenuCode = MENU1;
             this->currentMenuButtons = this->currentCategory + " -buttons";
@@ -343,6 +356,35 @@ void MenuManager::launchExample(const QString &name)
 #endif
 }
 
+void MenuManager::launchQmlExample(const QString &name)
+{
+    if(!qmlRoot){
+        exampleError(QProcess::UnknownError);
+        return;
+    }
+    //resolveQmlFilename - refactor to separate fn?
+    QString dirName = this->info[name]["dirname"];
+    QString category = this->info[name]["category"];
+    QString fileName = this->info[name]["filename"];
+    QDir dir;
+    if (category == "demos")
+        dir = QDir(QLibraryInfo::location(QLibraryInfo::DemosPath));
+    else
+        dir = QDir(QLibraryInfo::location(QLibraryInfo::ExamplesPath));
+    QFile file(dir.path() + "/" + dirName + "/" + fileName + "/" + fileName.split('/').last() + ".qml");
+    if(!file.exists()){
+        //try main.qml as well
+        file.setFileName(dir.path() + "/" + dirName + "/" + fileName + "/" + "main.qml");
+        if(!file.exists()){
+            exampleError(QProcess::UnknownError);
+            return;
+        }
+    }
+
+    qmlRoot->setProperty("show", QVariant(true));
+    qmlRoot->setProperty("source", file.fileName());
+}
+
 void MenuManager::exampleFinished()
 {
 }
@@ -359,6 +401,15 @@ void MenuManager::init(MainWindow *window)
 {
     this->window = window;
 
+    //Create blur for later use
+    // Note that blur is DISABLED by default because it's too slow, even on Desktop machines
+    if(!Colors::noBlur){
+        this->mainSceneBlur = new QGraphicsBlurEffect(this);
+        this->mainSceneBlur->setEnabled(false);
+        this->mainSceneBlur->setBlurRadius(0);
+        this->window->mainSceneRoot->setGraphicsEffect(mainSceneBlur);
+    }
+
     // Create div:
     this->createTicker();
     this->createUpnDownButtons();
@@ -385,6 +436,37 @@ void MenuManager::init(MainWindow *window)
 
         level2MenuNode = level2MenuNode.nextSibling();
     }
+
+    // Create QML Loader
+    qmlRegisterType<QGraphicsBlurEffect>("Effects", 1, 0, "Blur");
+    declarativeEngine = new QDeclarativeEngine(this);
+    MenuManager::instance()->declarativeEngine->rootContext()->setContextProperty("realBlur", this->mainSceneBlur);
+    QDeclarativeComponent component(declarativeEngine, QUrl("qrc:qml/qmlShell.qml"), this);
+    qmlRoot = 0;
+    if(component.isReady())
+        qmlRoot = qobject_cast<QDeclarativeItem*>(component.create());
+    else
+        qDebug() << component.status() << component.errorString();
+    if(qmlRoot){
+        qmlRoot->setHeight(this->window->scene->sceneRect().height());
+        qmlRoot->setWidth(this->window->scene->sceneRect().width());
+        qmlRoot->setZValue(1000);//Above other items
+        qmlRoot->setCursor(Qt::ArrowCursor);
+        window->scene->addItem(qmlRoot);
+        if(!Colors::noBlur){
+            qmlShadow = new QGraphicsDropShadowEffect(this);
+            qmlShadow->setOffset(4);
+            qmlRoot->setGraphicsEffect(qmlShadow);
+        }
+
+        //Note that QML adds key handling to the app.
+        window->viewport()->setFocusPolicy(Qt::NoFocus);//Correct keyboard focus handling
+        window->setFocusPolicy(Qt::StrongFocus);
+        window->scene->setStickyFocus(true);
+        window->setFocus();
+    }else{
+        qDebug() << "Error intializing QML subsystem, Declarative examples will not work";
+    }
 }
 
 void MenuManager::readInfoAboutExample(const QDomElement &example)
@@ -392,13 +474,14 @@ void MenuManager::readInfoAboutExample(const QDomElement &example)
     QString name = example.attribute("name");
     if (this->info.contains(name))
         qWarning() << "__WARNING: MenuManager::readInfoAboutExample: Demo/example with name"
-                    << name << "appears twize in the xml-file!__";
+                    << name << "appears twice in the xml-file!__";
 
     this->info[name]["filename"] = example.attribute("filename");
     this->info[name]["category"] = example.parentNode().toElement().tagName();
     this->info[name]["dirname"] = example.parentNode().toElement().attribute("dirname");
     this->info[name]["changedirectory"] = example.attribute("changedirectory");
     this->info[name]["image"] = example.attribute("image");
+    this->info[name]["qml"] = example.attribute("qml");
 }
 
 QString MenuManager::resolveDataDir(const QString &name)
@@ -454,7 +537,7 @@ QString MenuManager::resolveDocUrl(const QString &name)
     QString fileName = this->info[name]["filename"];
 
     if (category == "demos")
-        return this->helpRootUrl + "demos-" + fileName + ".html";
+        return this->helpRootUrl + "demos-" + fileName.replace("/", "-") + ".html";
     else
         return this->helpRootUrl + dirName.replace("/", "-") + "-" + fileName + ".html";
 }
@@ -474,6 +557,9 @@ QByteArray MenuManager::getImage(const QString &name)
     QString imageName = this->info[name]["image"];
     QString category = this->info[name]["category"];
     QString fileName = this->info[name]["filename"];
+    bool qml = (this->info[name]["qml"] == QLatin1String("true"));
+    if(qml)
+        fileName = QLatin1String("qml-") + fileName.split('/').last();
 
     if (imageName.isEmpty()){
         if (category == "demos")
@@ -493,7 +579,7 @@ void MenuManager::createRootMenu(const QDomElement &el)
 {
     QString name = el.attribute("name");
     createMenu(el, MENU1);
-    createInfo(new MenuContentItem(el, this->window->scene, 0), name + " -info");
+    createInfo(new MenuContentItem(el, this->window->scene, this->window->mainSceneRoot), name + " -info");
 
     Movie *menuButtonsIn = this->score->insertMovie(name + " -buttons");
     Movie *menuButtonsOut = this->score->insertMovie(name + " -buttons -out");
@@ -505,19 +591,21 @@ void MenuManager::createSubMenu(const QDomElement &el)
 {
     QString name = el.attribute("name");
     createMenu(el, MENU2);
-    createInfo(new MenuContentItem(el, this->window->scene, 0), name + " -info");
+    createInfo(new MenuContentItem(el, this->window->scene, this->window->mainSceneRoot), name + " -info");
 }
 
 void MenuManager::createLeafMenu(const QDomElement &el)
 {
     QString name = el.attribute("name");
-    createInfo(new ExampleContent(name, this->window->scene, 0), name);
+    createInfo(new ExampleContent(name, this->window->scene, this->window->mainSceneRoot), name);
 
     Movie *infoButtonsIn = this->score->insertMovie(name + " -buttons");
     Movie *infoButtonsOut = this->score->insertMovie(name + " -buttons -out");
     createLowRightLeafButton("Documentation", 600, DOCUMENTATION, infoButtonsIn, infoButtonsOut, 0);
     if (el.attribute("executable") != "false")
         createLowRightLeafButton("Launch", 405, LAUNCH, infoButtonsIn, infoButtonsOut, 0);
+    else if(el.attribute("qml") == "true")
+        createLowRightLeafButton("Display", 405, LAUNCH_QML, infoButtonsIn, infoButtonsOut, 0);
 }
 
 void MenuManager::createMenu(const QDomElement &category, BUTTON_TYPE type)
@@ -546,7 +634,7 @@ void MenuManager::createMenu(const QDomElement &category, BUTTON_TYPE type)
 
             // create normal menu button
             QString label = currentNode.toElement().attribute("name");
-            item = new TextButton(label, TextButton::LEFT, type, this->window->scene, 0);
+            item = new TextButton(label, TextButton::LEFT, type, this->window->scene, this->window->mainSceneRoot);
             currentNode = currentNode.nextSibling();
 
 #ifndef QT_OPENGL_SUPPORT
@@ -646,7 +734,7 @@ void MenuManager::createMenu(const QDomElement &category, BUTTON_TYPE type)
 void MenuManager::createLowLeftButton(const QString &label, BUTTON_TYPE type,
     Movie *movieIn, Movie *movieOut, Movie *movieShake, const QString &menuString)
 {
-    TextButton *button = new TextButton(label, TextButton::RIGHT, type, this->window->scene, 0, TextButton::PANEL);
+    TextButton *button = new TextButton(label, TextButton::RIGHT, type, this->window->scene, this->window->mainSceneRoot, TextButton::PANEL);
     if (!menuString.isNull())
         button->setMenuString(menuString);
     button->setRecursiveVisible(false);
@@ -688,7 +776,7 @@ void MenuManager::createLowLeftButton(const QString &label, BUTTON_TYPE type,
 
 void MenuManager::createLowRightButton(const QString &label, BUTTON_TYPE type, Movie *movieIn, Movie *movieOut, Movie * /*movieShake*/)
 {
-    TextButton *item = new TextButton(label, TextButton::RIGHT, type, this->window->scene, 0, TextButton::PANEL);
+    TextButton *item = new TextButton(label, TextButton::RIGHT, type, this->window->scene, this->window->mainSceneRoot, TextButton::PANEL);
     item->setRecursiveVisible(false);
     item->setZValue(10);
 
@@ -715,7 +803,7 @@ void MenuManager::createLowRightButton(const QString &label, BUTTON_TYPE type, M
 
 void MenuManager::createLowRightLeafButton(const QString &label, int xOffset, BUTTON_TYPE type, Movie *movieIn, Movie *movieOut, Movie * /*movieShake*/)
 {
-    TextButton *item = new TextButton(label, TextButton::RIGHT, type, this->window->scene, 0, TextButton::PANEL);
+    TextButton *item = new TextButton(label, TextButton::RIGHT, type, this->window->scene, this->window->mainSceneRoot, TextButton::PANEL);
     item->setRecursiveVisible(false);
     item->setZValue(10);
 
@@ -831,12 +919,12 @@ void MenuManager::createUpnDownButtons()
     float xOffset = 15.0f;
     float yOffset = 450.0f;
 
-    this->upButton = new TextButton("", TextButton::LEFT, MenuManager::UP, this->window->scene, 0, TextButton::UP);
+    this->upButton = new TextButton("", TextButton::LEFT, MenuManager::UP, this->window->scene, this->window->mainSceneRoot, TextButton::UP);
     this->upButton->prepare();
     this->upButton->setPos(xOffset, yOffset);
     this->upButton->setState(TextButton::DISABLED);
 
-    this->downButton = new TextButton("", TextButton::LEFT, MenuManager::DOWN, this->window->scene, 0, TextButton::DOWN);
+    this->downButton = new TextButton("", TextButton::LEFT, MenuManager::DOWN, this->window->scene, this->window->mainSceneRoot, TextButton::DOWN);
     this->downButton->prepare();
     this->downButton->setPos(xOffset + 10 + this->downButton->sceneBoundingRect().width(), yOffset);
 
diff --git a/demos/qtdemo/menumanager.h b/demos/qtdemo/menumanager.h
index ff98341426..3524081ff0 100644
--- a/demos/qtdemo/menumanager.h
+++ b/demos/qtdemo/menumanager.h
@@ -61,7 +61,7 @@ class MenuManager : public QObject
     Q_OBJECT
 
 public:
-    enum BUTTON_TYPE {ROOT, MENU1, MENU2, LAUNCH, DOCUMENTATION, QUIT, FULLSCREEN, UP, DOWN, BACK};
+    enum BUTTON_TYPE {ROOT, MENU1, MENU2, LAUNCH, DOCUMENTATION, QUIT, FULLSCREEN, UP, DOWN, BACK, LAUNCH_QML};
 
     // singleton pattern:
     static MenuManager *instance();
@@ -83,6 +83,11 @@ public:
     Score *score;
     int currentMenuCode;
 
+    QDeclarativeEngine* declarativeEngine;
+    QDeclarativeItem *qmlRoot;
+    QGraphicsBlurEffect *mainSceneBlur;
+    QGraphicsDropShadowEffect *qmlShadow;
+
 private slots:
     void exampleFinished();
     void exampleError(QProcess::ProcessError error);
@@ -100,6 +105,7 @@ private:
     void readInfoAboutExample(const QDomElement &example);
     void showDocInAssistant(const QString &docFile);
     void launchExample(const QString &uniqueName);
+    void launchQmlExample(const QString &uniqueName);
 
     void createMenu(const QDomElement &category, BUTTON_TYPE type);
     void createLowLeftButton(const QString &label, BUTTON_TYPE type,
@@ -128,6 +134,7 @@ private:
 
     TextButton *upButton;
     TextButton *downButton;
+
 };
 
 #endif // MENU_MANAGER_H
diff --git a/demos/qtdemo/qmlShell.qml b/demos/qtdemo/qmlShell.qml
new file mode 100644
index 0000000000..8c20cf4c99
--- /dev/null
+++ b/demos/qtdemo/qmlShell.qml
@@ -0,0 +1,117 @@
+import Qt 4.7
+import Effects 1.0
+
+Item {
+    id: main
+    property alias source: loader.source
+    property bool show: false
+    x: 0
+    y: -500 //height and width set by program
+    opacity: 0
+    property QtObject blurEffect: realBlur == null ? dummyBlur : realBlur //Is there a better way to lose those error messages?
+    Loader{//Automatic FocusScope
+        focus: true
+        clip: true
+        id: loader //source set by program
+        anchors.centerIn: parent
+        onStatusChanged: if(status == Loader.Ready) {
+                if(loader.item.width > 640)
+                    loader.item.width = 640;
+                if(loader.item.height > 480)
+                    loader.item.height = 480;
+       }
+
+    }
+    Rectangle{
+        z: -1
+        anchors.fill: loader.status == Loader.Ready ? loader : errorTxt
+        anchors.margins: -10
+        radius: 12
+        smooth: true
+        gradient: Gradient{
+            GradientStop{ position: 0.0; color: "#14FFFFFF" }
+            GradientStop{ position: 1.0; color: "#5AFFFFFF" }
+        }
+        MouseArea{
+            anchors.fill: parent
+            onClicked: loader.focus=true;/* and don't propogate to the 'exit' area*/
+        }
+
+    }
+
+    MouseArea{
+        z: -2
+        hoverEnabled: true //To steal from the buttons
+        anchors.fill: parent
+        onClicked: main.show=false;
+    }
+
+    Text{
+        id: errorTxt
+        anchors.centerIn: parent
+        color: 'white'
+        smooth: true
+        visible: loader.status == Loader.Error
+        textFormat: Text.RichText //includes link for bugreport
+        //Note that if loader is Error, it is because the file was found but there was an error creating the component
+        //This means either we have a bug in our demos, or the required modules (which ship with Qt) did not deploy correctly
+        text: 'The example has failed to load. This is a bug!<br />'
+            +'Report it at <a href="http://bugreports.qt.nokia.com">http://bugreports.qt.nokia.com</a>';
+        onLinkActivated: Qt.openUrlExternally(link);
+    }
+
+
+    states: [
+        State {
+            name: "show"
+            when: show == true
+            PropertyChanges {
+                target: main
+                opacity: 1
+                y: 0                
+            }
+            PropertyChanges {
+                target: blurEffect
+                enabled: true
+                blurRadius: 8
+                blurHints: Blur.AnimationHint | Blur.PerformanceHint
+            }
+        }
+    ]
+    MagicAnim{ id: magicAnim; target: main; from: -500; to: 0 }
+    transitions: [
+        Transition { from: ""; to: "show"
+            SequentialAnimation{
+                ScriptAction{ script: magicAnim.start() }
+                NumberAnimation{ properties: "opacity,blurRadius";  easing.type: Easing.OutCubic; duration: 1000}
+                PropertyAnimation{ target: main; property: "y"}
+            }
+
+        },
+        Transition { from: "show"; to: "" //Addtionally, unload the item
+            SequentialAnimation{
+                NumberAnimation{ properties: "y,opacity,blurRadius";duration: 500 }
+                ScriptAction{ script: loader.source = ''; }
+            }
+            /*Attempt to copy the exeunt animation. Looks bad
+            SequentialAnimation{
+                ParallelAnimation{
+                    NumberAnimation{ properties: "opacity,blurRadius"; easing.type: Easing.InCubic; duration: 1000 }
+                    SequentialAnimation{
+                        NumberAnimation{ target: main; property: 'y'; to: 3.2*height/5; duration: 500}
+                        ParallelAnimation{
+                            NumberAnimation{ target: main; property: 'y'; to: 3.0*height/5; duration: 100}
+                            NumberAnimation{ target: main; property: 'x'; to: 3.0*width/5; duration: 100}
+                        }
+                        NumberAnimation{ target: main; property: 'x'; to: 700; duration: 400}
+                    }
+                }
+                ScriptAction{ script: loader.source = ''; }
+                PropertyAction{ properties: "x,y";}
+            }
+            */
+        }
+    ]
+    Item{ Blur{id: dummyBlur } }
+
+}
diff --git a/demos/qtdemo/qtdemo.pro b/demos/qtdemo/qtdemo.pro
index 2a776ace1d..5e64e1c097 100644
--- a/demos/qtdemo/qtdemo.pro
+++ b/demos/qtdemo/qtdemo.pro
@@ -6,7 +6,7 @@ DESTDIR = $$DEMO_DESTDIR/bin
 INSTALLS += target sources
 
 
-QT += xml network
+QT += xml network declarative
 
 contains(QT_CONFIG, opengl) {
     DEFINES += QT_OPENGL_SUPPORT
@@ -74,3 +74,6 @@ target.path = $$[QT_INSTALL_BINS]
 sources.files = $$SOURCES $$HEADERS $$FORMS $$RESOURCES qtdemo.pro images xml *.ico *.icns *.rc *.plist
 sources.path = $$[QT_INSTALL_DEMOS]/qtdemo
 
+OTHER_FILES += \
+    qmlShell.qml \
+    MagicAnim.qml
diff --git a/demos/qtdemo/qtdemo.qrc b/demos/qtdemo/qtdemo.qrc
index b30dd5894e..7682ab5148 100644
--- a/demos/qtdemo/qtdemo.qrc
+++ b/demos/qtdemo/qtdemo.qrc
@@ -1,8 +1,12 @@
-<!DOCTYPE RCC><RCC version="1.0">
-<qresource prefix="/">
-   <file>xml/examples.xml</file>
-   <file>images/qtlogo_small.png</file>
-   <file>images/trolltech-logo.png</file>
-   <file>images/demobg.png</file>
-</qresource>
+<RCC>
+    <qresource prefix="/">
+        <file>xml/examples.xml</file>
+        <file>images/qtlogo_small.png</file>
+        <file>images/trolltech-logo.png</file>
+        <file>images/demobg.png</file>
+    </qresource>
+    <qresource prefix="/qml" lang="qml">
+        <file>qmlShell.qml</file>
+        <file>MagicAnim.qml</file>
+    </qresource>
 </RCC>
diff --git a/demos/qtdemo/xml/examples.xml b/demos/qtdemo/xml/examples.xml
index 91218611a8..0ab048e0a1 100644
--- a/demos/qtdemo/xml/examples.xml
+++ b/demos/qtdemo/xml/examples.xml
@@ -1,25 +1,32 @@
 <?xml version="1.0" encoding="iso-8859-1"?>
 <categories name="Qt Examples and Demos">
   <demos dirname="." docname="demos" name="Demonstrations">
+    <example filename="declarative/samegame" name="SameGame" executable="false" qml="true"/>
+    <example filename="declarative/flickr" name="Flickr Client" executable="false" qml="true"/>
     <example filename="affine" name="Affine Transformations" />
-    <example filename="arthurplugin" name="Arthur Plugin" executable="false" />
     <example filename="composition" name="Composition Modes" />
     <example filename="gradients" name="Gradients" />
     <example filename="pathstroke" name="Path Stroking" />
-    <example filename="deform" name="Vector Deformation" />
-    <example filename="books" name="Books" />
-    <example filename="mainwindow" name="Main Window" />
-    <example filename="spreadsheet" name="Spreadsheet" />
-    <example filename="sqlbrowser" name="SQL Browser" />
     <example filename="textedit" name="Text Edit" />
     <example filename="chip" name="40000 Chips" />
     <example filename="embeddeddialogs" name="Embedded Dialogs" />
     <example filename="interview" name="Interview" />
+    <example filename="declarative/rssnews" name="Rss Client" executable="false" qml="true"/>
+    <example filename="declarative/twitter" name="Twitter Client" executable="false" qml="true"/>
     <example filename="browser" name="Browser" />
     <example filename="qmediaplayer" name="Media Player" />
     <example filename="boxes" name="Boxes" />
     <example filename="sub-attaq" name="Sub-attaq" />
     <example filename="spectrum" name="Spectrum Analyzer" />
+    <example filename="declarative/minehunt" name="Minehunt" executable="false" qml="true"/>
+    <example filename="declarative/snake" name="Snake" executable="false" qml="true"/>
+    <example filename="deform" name="Vector Deformation" />
+    <example filename="books" name="Books" />
+    <example filename="mainwindow" name="Main Window" />
+    <example filename="spreadsheet" name="Spreadsheet" />
+    <example filename="sqlbrowser" name="SQL Browser" />
+    <example filename="arthurplugin" name="Arthur Plugin" executable="false" />
+
   </demos>
   <category dirname="animation" name="Animation Framework">
     <example filename="animatedtiles" name="Animated Tiles" />
@@ -35,6 +42,13 @@
     <example filename="runfunction" name="Run Function" executable="false"/>
     <example filename="wordcount" name="Word Count" executable="false" />
   </category>
+  <category dirname="declarative/toys" name="Qt Declarative Examples">
+    <example filename="dynamicscene" name="Dynamic Scene" executable="false" qml="true" />
+    <example filename="tic-tac-toe" name="Tic Tac Toe" executable="false" qml="true" />
+    <example filename="clocks" name="Clocks" executable="false" qml="true" />
+    <example filename="corkboards" name="Corkboards" executable="false" qml="true" />
+    <example filename="tvtennis" name="TV Tennis" executable="false" qml="true" />
+  </category>
   <category dirname="designer" name="Qt Designer">
     <example filename="calculatorbuilder" name="Calculator Builder" />
     <example filename="calculatorform" name="Calculator Form" />
@@ -116,6 +130,16 @@
     <example filename="menus" name="Menus" />
     <example filename="recentfiles" name="Recent Files" />
   </category>
+  <category dirname="declarative/ui-components" name="QML UI Components">
+    <example filename="dialcontrol" name="Dial" executable="false" qml="true" />
+    <example filename="flipable" name="Flipable" executable="false" qml="true" />
+    <example filename="progressbar" name="Progress bar" executable="false" qml="true" />
+    <example filename="scrollbar" name="Scroll bar" executable="false" qml="true" />
+    <example filename="searchbox" name="Search box" executable="false" qml="true" />
+    <example filename="slideswitch" name="Slide switch" executable="false" qml="true" />
+    <example filename="spinner" name="Spinner" executable="false" qml="true" />
+    <example filename="tabwidget" name="Tab widget" executable="false" qml="true" />
+  </category>
   <category dirname="network" name="Networking">
     <example filename="blockingfortuneclient" name="Blocking Fortune Client" />
     <example filename="broadcastreceiver" name="Broadcast Receiver" />
diff --git a/doc/src/examples/qml-examples.qdoc b/doc/src/examples/qml-examples.qdoc
index c2237d685e..56ba1c70a7 100644
--- a/doc/src/examples/qml-examples.qdoc
+++ b/doc/src/examples/qml-examples.qdoc
@@ -271,6 +271,8 @@
     This example displays a set of clocks with different times for different cities.
     Each clock is created by combining \l Image elements with \l Rotation transforms 
     and \l SpringFollow animations.
+
+    \image qml-clocks-example.png
 */
 
 /*!
@@ -280,14 +282,8 @@
     This example presents a flickable set of interactive corkboards. It is created
     through a combination of elements like \l ListModel, \l Repeater and \l TextEdit
     together with rotation and scaling transforms, animation and mouse interaction.
-*/
-
-/*!
-    \title Toys: Dial
-    \example declarative/toys/dial
 
-    This example presents an interactive speedometer-type dial by combining
-    \l Image elements with \l Rotation transforms and \l SpringFollow animations.
+    \image qml-corkboards-example.png
 */
 
 /*!
@@ -297,6 +293,8 @@
     This example presents an interactive drag-and-drop scene. It demonstrates
     how to use QML's \l{Dynamic Object Creation} support to dynamically create and
     destroy objects.
+
+    \image qml-dynamicscene-example.png
 */
 
 /*!
@@ -304,6 +302,8 @@
     \example declarative/toys/tic-tac-toe
 
     This example presents a simple implementation of Tic Tac Toe.
+
+    \image qml-tic-tac-toe-example.png
 */
 
 /*!
@@ -312,6 +312,8 @@
 
     This example shows how to use animation components such as \l SpringFollow,
     \l SequentialAnimation and \l PropertyAction to create a game of TV tennis.
+
+    \image qml-tvtennis-example.png
 */
 
 /*!
@@ -329,10 +331,23 @@
 */
 
 /*!
+    \title UI Components: Dial
+    \example declarative/ui-components/dialcontrol
+
+    This example presents an interactive speedometer-type dial by combining
+    \l Image elements with \l Rotation transforms and \l SpringFollow animations.
+
+    \image qml-dialcontrol-example.png
+*/
+
+
+/*!
     \title UI Components: Flipable
     \example declarative/ui-components/flipable
 
     This example shows how to use the Flipable element.
+
+    \image qml-flipable-example.png
 */
 
 /*!
@@ -340,6 +355,8 @@
     \example declarative/ui-components/progressbar
 
     This example shows how to create a progress bar.
+
+    \image qml-progressbar-example.png
 */
 
 /*!
@@ -349,6 +366,8 @@
     This example shows how to create scroll bars for a Flickable element
     using the \l {Flickable::visibleArea.xPosition}{Flickable::visibleArea}
     properties.
+
+    \image qml-scrollbar-example.png
 */
 
 /*!
@@ -356,6 +375,8 @@
     \example declarative/ui-components/searchbox
 
     This example shows how to create a search box.
+
+    \image qml-searchbox-example.png
 */
 
 /*!
@@ -363,6 +384,8 @@
     \example declarative/ui-components/slideswitch
 
     This example shows how to create a slide switch.
+
+    \image qml-slideswitch-example.png
 */
 
 /*!
@@ -370,6 +393,8 @@
     \example declarative/ui-components/spinner
 
     This example shows how to create a spinner-type component.
+
+    \image qml-spinner-example.png
 */
 
 /*!
@@ -377,6 +402,8 @@
     \example declarative/ui-components/tabwidget
 
     This example shows how to create a tab widget.
+
+    \image qml-tabwidget-example.png
 */
 
 /*!
diff --git a/doc/src/examples/qml-flickr.qdoc b/doc/src/examples/qml-flickr.qdoc
index ebf3250f0b..43fcf1f6cf 100644
--- a/doc/src/examples/qml-flickr.qdoc
+++ b/doc/src/examples/qml-flickr.qdoc
@@ -45,5 +45,5 @@
 
     This demo shows how to write a mobile Flickr browser application in QML.
 
-    \image qml-flickr-example.png
+    \image qml-flickr-demo.png
 */
diff --git a/doc/src/examples/qml-minehunt.qdoc b/doc/src/examples/qml-minehunt.qdoc
index 773f21646d..b2c662d91f 100644
--- a/doc/src/examples/qml-minehunt.qdoc
+++ b/doc/src/examples/qml-minehunt.qdoc
@@ -43,7 +43,8 @@
     \title Minehunt
     \example demos/declarative/minehunt
 
-    This demo shows how to create a simple Minehunt game with QML and C++.
+    This demo shows how to create a simple Minehunt game, using QML for the
+    UI and a C++ plugin for the game logic.
 
-    \image qml-minehunt-example.png
+    \image qml-minehunt-demo.png
 */
diff --git a/doc/src/examples/qml-photoviewer.qdoc b/doc/src/examples/qml-photoviewer.qdoc
index d1c3da287e..d2114b90f9 100644
--- a/doc/src/examples/qml-photoviewer.qdoc
+++ b/doc/src/examples/qml-photoviewer.qdoc
@@ -45,5 +45,5 @@
 
     This demo shows how to write a Flickr photo viewer application in QML.
 
-    \image qml-photoviewer-example.png
+    \image qml-photoviewer-demo.png
 */
diff --git a/doc/src/examples/qml-rssnews.qdoc b/doc/src/examples/qml-rssnews.qdoc
index 0e7bdef9f6..801efd9ab1 100644
--- a/doc/src/examples/qml-rssnews.qdoc
+++ b/doc/src/examples/qml-rssnews.qdoc
@@ -45,5 +45,5 @@
 
     This demo shows how to write a RSS news reader in QML.
 
-    \image qml-rssnews-example.png
+    \image qml-rssnews-demo.png
 */
diff --git a/doc/src/examples/qml-samegame.qdoc b/doc/src/examples/qml-samegame.qdoc
index d9a9c7c433..5b78b0cf42 100644
--- a/doc/src/examples/qml-samegame.qdoc
+++ b/doc/src/examples/qml-samegame.qdoc
@@ -43,7 +43,8 @@
     \title Same Game
     \example demos/declarative/samegame
 
-    This demo shows how to write a Same Game in QML.
+    This demo shows how to write a 'Same Game' game in QML, using Javascript
+    for all the game logic.
 
-    \image qml-samegame-example.png
+    \image qml-samegame-demo.png
 */
diff --git a/doc/src/examples/qml-snake.qdoc b/doc/src/examples/qml-snake.qdoc
index 373ca133af..3125f2d939 100644
--- a/doc/src/examples/qml-snake.qdoc
+++ b/doc/src/examples/qml-snake.qdoc
@@ -43,7 +43,8 @@
     \title Snake
     \example demos/declarative/snake
 
-    This demo shows how to write a Snake game in QML.
+    This demo shows how to write a Snake game in QML, controlled by the
+    keyboard as well as the mouse.
 
-    \image qml-snake-example.png
+    \image qml-snake-demo.png
 */
diff --git a/doc/src/examples/qml-twitter.qdoc b/doc/src/examples/qml-twitter.qdoc
new file mode 100644
index 0000000000..0e663606f0
--- /dev/null
+++ b/doc/src/examples/qml-twitter.qdoc
@@ -0,0 +1,50 @@
+/****************************************************************************
+**
+** Copyright (C) 2010 Nokia Corporation and/or its subsidiary(-ies).
+** All rights reserved.
+** Contact: Nokia Corporation (qt-info@nokia.com)
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL$
+** No Commercial Usage
+** This file contains pre-release code and may not be distributed.
+** You may use this file in accordance with the terms and conditions
+** contained in the Technology Preview License Agreement accompanying
+** this package.
+**
+** GNU Lesser General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU Lesser
+** General Public License version 2.1 as published by the Free Software
+** Foundation and appearing in the file LICENSE.LGPL included in the
+** packaging of this file.  Please review the following information to
+** ensure the GNU Lesser General Public License version 2.1 requirements
+** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
+**
+** In addition, as a special exception, Nokia gives you certain additional
+** rights.  These rights are described in the Nokia Qt LGPL Exception
+** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
+**
+** If you have questions regarding the use of this file, please contact
+** Nokia at qt-info@nokia.com.
+**
+**
+**
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+    \title Twitter Mobile
+    \example demos/declarative/twitter
+
+    This demo shows how to write a mobile Twitter client in QML. Use it to
+    tweet us(@qtbynokia) how much you like our demos!
+
+    \image qml-twitter-demo.png
+*/
diff --git a/doc/src/images/qml-clocks-example.png b/doc/src/images/qml-clocks-example.png
new file mode 100644
index 0000000000..1b352b589b
--- /dev/null
+++ b/doc/src/images/qml-clocks-example.png
diff --git a/doc/src/images/qml-corkboards-example.png b/doc/src/images/qml-corkboards-example.png
new file mode 100644
index 0000000000..8acffa7b64
--- /dev/null
+++ b/doc/src/images/qml-corkboards-example.png
diff --git a/doc/src/images/qml-dialcontrol-example.png b/doc/src/images/qml-dialcontrol-example.png
new file mode 100644
index 0000000000..74cd645d3a
--- /dev/null
+++ b/doc/src/images/qml-dialcontrol-example.png
diff --git a/doc/src/images/qml-dynamicscene-example.png b/doc/src/images/qml-dynamicscene-example.png
new file mode 100644
index 0000000000..1f725d1b09
--- /dev/null
+++ b/doc/src/images/qml-dynamicscene-example.png
diff --git a/doc/src/images/qml-flickr-example.png b/doc/src/images/qml-flickr-demo.png
index 71ea567929..71ea567929 100644
--- a/doc/src/images/qml-flickr-example.png
+++ b/doc/src/images/qml-flickr-demo.png
diff --git a/doc/src/images/qml-flipable-example.png b/doc/src/images/qml-flipable-example.png
new file mode 100644
index 0000000000..dd68a66cef
--- /dev/null
+++ b/doc/src/images/qml-flipable-example.png
diff --git a/doc/src/images/qml-minehunt-example.png b/doc/src/images/qml-minehunt-demo.png
index 3b6956936f..3b6956936f 100644
--- a/doc/src/images/qml-minehunt-example.png
+++ b/doc/src/images/qml-minehunt-demo.png
diff --git a/doc/src/images/qml-photoviewer-example.png b/doc/src/images/qml-photoviewer-demo.png
index be6f1bf1f9..be6f1bf1f9 100644
--- a/doc/src/images/qml-photoviewer-example.png
+++ b/doc/src/images/qml-photoviewer-demo.png
diff --git a/doc/src/images/qml-progressbar-example.png b/doc/src/images/qml-progressbar-example.png
new file mode 100644
index 0000000000..3ddd6c64ad
--- /dev/null
+++ b/doc/src/images/qml-progressbar-example.png
diff --git a/doc/src/images/qml-rssnews-example.png b/doc/src/images/qml-rssnews-demo.png
index 948ef4d87c..948ef4d87c 100644
--- a/doc/src/images/qml-rssnews-example.png
+++ b/doc/src/images/qml-rssnews-demo.png
diff --git a/doc/src/images/qml-samegame-example.png b/doc/src/images/qml-samegame-demo.png
index c17b4e0775..c17b4e0775 100644
--- a/doc/src/images/qml-samegame-example.png
+++ b/doc/src/images/qml-samegame-demo.png
diff --git a/doc/src/images/qml-searchbox-example.png b/doc/src/images/qml-searchbox-example.png
new file mode 100644
index 0000000000..97d12bba89
--- /dev/null
+++ b/doc/src/images/qml-searchbox-example.png
diff --git a/doc/src/images/qml-slideswitch-example.png b/doc/src/images/qml-slideswitch-example.png
new file mode 100644
index 0000000000..17cb3eb36b
--- /dev/null
+++ b/doc/src/images/qml-slideswitch-example.png
diff --git a/doc/src/images/qml-snake-example.png b/doc/src/images/qml-snake-demo.png
index d3c077d1f8..d3c077d1f8 100644
--- a/doc/src/images/qml-snake-example.png
+++ b/doc/src/images/qml-snake-demo.png
diff --git a/doc/src/images/qml-spinner-example.png b/doc/src/images/qml-spinner-example.png
new file mode 100644
index 0000000000..ed381f8aa7
--- /dev/null
+++ b/doc/src/images/qml-spinner-example.png
diff --git a/doc/src/images/qml-tabwidget-example.png b/doc/src/images/qml-tabwidget-example.png
new file mode 100644
index 0000000000..05887f3d1a
--- /dev/null
+++ b/doc/src/images/qml-tabwidget-example.png
diff --git a/doc/src/images/qml-tic-tac-toe-example.png b/doc/src/images/qml-tic-tac-toe-example.png
new file mode 100644
index 0000000000..5a5cc8262b
--- /dev/null
+++ b/doc/src/images/qml-tic-tac-toe-example.png
diff --git a/doc/src/images/qml-tvtennis-example.png b/doc/src/images/qml-tvtennis-example.png
new file mode 100644
index 0000000000..ac2b5276bd
--- /dev/null
+++ b/doc/src/images/qml-tvtennis-example.png
diff --git a/doc/src/images/qml-twitter-demo.png b/doc/src/images/qml-twitter-demo.png
new file mode 100644
index 0000000000..63d6486a5a
--- /dev/null
+++ b/doc/src/images/qml-twitter-demo.png
diff --git a/examples/declarative/toys/README b/examples/declarative/toys/README
index 7fd7eb0bbc..ff4d0242d7 100644
--- a/examples/declarative/toys/README
+++ b/examples/declarative/toys/README
@@ -1,4 +1,4 @@
-These pure QML examples create complete components to demonstrate
+These pure QML examples demonstrate
 some of what can be easily done using just a few QML files.
 
 The example launcher provided with Qt can be used to explore each of the
diff --git a/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml b/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml
index 707add774c..76a6a3bdc4 100644
--- a/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml
+++ b/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml
@@ -50,7 +50,6 @@ Item {
 
     width: 440
     height: 480
-    anchors.fill: parent
 
     Image {
         id: boardimage
diff --git a/examples/declarative/ui-components/README b/examples/declarative/ui-components/README
new file mode 100644
index 0000000000..7eecec104a
--- /dev/null
+++ b/examples/declarative/ui-components/README
@@ -0,0 +1,39 @@
+With Qt Declarative, it is easy to implement the UI components that you need
+in exactly the way that you want. These examples demonstrate this by creating
+a selection of user interface components where the look and feel has been
+completely defined in a QML file.
+
+The example launcher provided with Qt can be used to explore each of the
+examples in this directory. But most can also be viewed directly with the
+QML viewer utility, without requiring compilation.
+
+Documentation for these examples can be found via the Tutorials and Examples
+link in the main Qt documentation.
+
+
+Finding the Qt Examples and Demos launcher
+==========================================
+
+On Windows:
+
+The launcher can be accessed via the Windows Start menu. Select the menu
+entry entitled "Qt Examples and Demos" entry in the submenu containing
+the Qt tools.
+
+On Mac OS X:
+
+For the binary distribution, the qtdemo executable is installed in the
+/Developer/Applications/Qt directory. For the source distribution, it is
+installed alongside the other Qt tools on the path specified when Qt is
+configured.
+
+On Unix/Linux:
+
+The qtdemo executable is installed alongside the other Qt tools on the path
+specified when Qt is configured.
+
+On all platforms:
+
+The source code for the launcher can be found in the demos/qtdemo directory
+in the Qt package. This example is built at the same time as the Qt libraries,
+tools, examples, and demonstrations.
diff --git a/examples/declarative/toys/dial-example/content/Dial.qml b/examples/declarative/ui-components/dialcontrol/content/Dial.qml
index 2b421bf7c8..2b421bf7c8 100644
--- a/examples/declarative/toys/dial-example/content/Dial.qml
+++ b/examples/declarative/ui-components/dialcontrol/content/Dial.qml
diff --git a/examples/declarative/toys/dial-example/content/background.png b/examples/declarative/ui-components/dialcontrol/content/background.png
index 75d555d7ab..75d555d7ab 100644
--- a/examples/declarative/toys/dial-example/content/background.png
+++ b/examples/declarative/ui-components/dialcontrol/content/background.png
diff --git a/examples/declarative/toys/dial-example/content/needle.png b/examples/declarative/ui-components/dialcontrol/content/needle.png
index 2d19f75039..2d19f75039 100644
--- a/examples/declarative/toys/dial-example/content/needle.png
+++ b/examples/declarative/ui-components/dialcontrol/content/needle.png
diff --git a/examples/declarative/toys/dial-example/content/needle_shadow.png b/examples/declarative/ui-components/dialcontrol/content/needle_shadow.png
index 8d8a928cc5..8d8a928cc5 100644
--- a/examples/declarative/toys/dial-example/content/needle_shadow.png
+++ b/examples/declarative/ui-components/dialcontrol/content/needle_shadow.png
diff --git a/examples/declarative/toys/dial-example/content/overlay.png b/examples/declarative/ui-components/dialcontrol/content/overlay.png
index 3860a7b590..3860a7b590 100644
--- a/examples/declarative/toys/dial-example/content/overlay.png
+++ b/examples/declarative/ui-components/dialcontrol/content/overlay.png
diff --git a/examples/declarative/toys/dial-example/dial.qmlproject b/examples/declarative/ui-components/dialcontrol/dial.qmlproject
index d4909f8685..d4909f8685 100644
--- a/examples/declarative/toys/dial-example/dial.qmlproject
+++ b/examples/declarative/ui-components/dialcontrol/dial.qmlproject
diff --git a/examples/declarative/toys/dial-example/dial-example.qml b/examples/declarative/ui-components/dialcontrol/dialcontrol.qml
index 95df68c638..95df68c638 100644
--- a/examples/declarative/toys/dial-example/dial-example.qml
+++ b/examples/declarative/ui-components/dialcontrol/dialcontrol.qml
diff --git a/examples/declarative/ui-components/flipable/flipable-example.qml b/examples/declarative/ui-components/flipable/flipable.qml
index 479e35b413..479e35b413 100644
--- a/examples/declarative/ui-components/flipable/flipable-example.qml
+++ b/examples/declarative/ui-components/flipable/flipable.qml
diff --git a/examples/declarative/ui-components/progressbar/progressbars.qml b/examples/declarative/ui-components/progressbar/main.qml
index 22f8dbdd4b..22f8dbdd4b 100644
--- a/examples/declarative/ui-components/progressbar/progressbars.qml
+++ b/examples/declarative/ui-components/progressbar/main.qml
diff --git a/examples/declarative/ui-components/scrollbar/display.qml b/examples/declarative/ui-components/scrollbar/main.qml
index 1f7992b542..1f7992b542 100644
--- a/examples/declarative/ui-components/scrollbar/display.qml
+++ b/examples/declarative/ui-components/scrollbar/main.qml
diff --git a/examples/declarative/ui-components/tabwidget/tabs.qml b/examples/declarative/ui-components/tabwidget/main.qml
index e11902a516..e11902a516 100644
--- a/examples/declarative/ui-components/tabwidget/tabs.qml
+++ b/examples/declarative/ui-components/tabwidget/main.qml