Doc: Update examples used in Writing QML Extensions tutorial
authorTopi Reinio <topi.reinio@digia.com>
Mon, 25 Nov 2013 12:27:42 +0000 (13:27 +0100)
committerThe Qt Project <gerrit-noreply@qt-project.org>
Sat, 30 Nov 2013 16:57:21 +0000 (17:57 +0100)
Update the examples to use Qt's resource file system to
store the qml files in, enabling them to run unmodified
in any platform/build configuration.

Also,
    - Chapter 6: Move the plugin code to a subproject
      and create a C++ application to use the plugin
    - Update documentation related to above chapter
    - Add thumbnails for the examples so they will
      appear in Qt Creators example list.

Task-number: QTBUG-35001
Change-Id: I29122af11bb11c7e5e17993438e5fc18c7f96f89
Reviewed-by: Jerome Pasion <jerome.pasion@digia.com>
Reviewed-by: Alan Alpert <aalpert@blackberry.com>
Reviewed-by: Kai Koehne <kai.koehne@digia.com>
29 files changed:
examples/qml/tutorials/extending/chapter1-basics/chapter1-basics.pro
examples/qml/tutorials/extending/chapter1-basics/chapter1-basics.qrc [new file with mode: 0644]
examples/qml/tutorials/extending/chapter1-basics/main.cpp
examples/qml/tutorials/extending/chapter2-methods/chapter2-methods.pro
examples/qml/tutorials/extending/chapter2-methods/chapter2-methods.qrc [new file with mode: 0644]
examples/qml/tutorials/extending/chapter2-methods/main.cpp
examples/qml/tutorials/extending/chapter3-bindings/chapter3-binding.qrc [new file with mode: 0644]
examples/qml/tutorials/extending/chapter3-bindings/chapter3-bindings.pro
examples/qml/tutorials/extending/chapter3-bindings/main.cpp
examples/qml/tutorials/extending/chapter4-customPropertyTypes/chapter4-customPropertyTypes.pro
examples/qml/tutorials/extending/chapter4-customPropertyTypes/chapter4-customPropertyTypes.qrc [new file with mode: 0644]
examples/qml/tutorials/extending/chapter4-customPropertyTypes/main.cpp
examples/qml/tutorials/extending/chapter5-listproperties/chapter5-listproperties.pro
examples/qml/tutorials/extending/chapter5-listproperties/chapter5-listproperties.qrc [new file with mode: 0644]
examples/qml/tutorials/extending/chapter5-listproperties/main.cpp
examples/qml/tutorials/extending/chapter6-plugins/app.pro [new file with mode: 0644]
examples/qml/tutorials/extending/chapter6-plugins/app.qrc [new file with mode: 0644]
examples/qml/tutorials/extending/chapter6-plugins/chapter6-plugins.pro
examples/qml/tutorials/extending/chapter6-plugins/import/chartsplugin.cpp [moved from examples/qml/tutorials/extending/chapter6-plugins/chartsplugin.cpp with 100% similarity]
examples/qml/tutorials/extending/chapter6-plugins/import/chartsplugin.h [moved from examples/qml/tutorials/extending/chapter6-plugins/chartsplugin.h with 100% similarity]
examples/qml/tutorials/extending/chapter6-plugins/import/import.pro [new file with mode: 0644]
examples/qml/tutorials/extending/chapter6-plugins/import/piechart.cpp [moved from examples/qml/tutorials/extending/chapter6-plugins/piechart.cpp with 100% similarity]
examples/qml/tutorials/extending/chapter6-plugins/import/piechart.h [moved from examples/qml/tutorials/extending/chapter6-plugins/piechart.h with 100% similarity]
examples/qml/tutorials/extending/chapter6-plugins/import/pieslice.cpp [moved from examples/qml/tutorials/extending/chapter6-plugins/pieslice.cpp with 100% similarity]
examples/qml/tutorials/extending/chapter6-plugins/import/pieslice.h [moved from examples/qml/tutorials/extending/chapter6-plugins/pieslice.h with 100% similarity]
examples/qml/tutorials/extending/chapter6-plugins/import/qmldir [moved from examples/qml/tutorials/extending/chapter6-plugins/Charts/qmldir with 100% similarity]
examples/qml/tutorials/extending/chapter6-plugins/main.cpp [new file with mode: 0644]
src/qml/doc/qtqml.qdocconf
src/qml/doc/src/cppintegration/extending-tutorial.qdoc

index 8ed66f8..c28664e 100644 (file)
@@ -3,3 +3,13 @@ QT += qml quick
 HEADERS += piechart.h
 SOURCES += piechart.cpp \
            main.cpp
+
+RESOURCES += chapter1-basics.qrc
+
+DESTPATH = $$[QT_INSTALL_EXAMPLES]/qml/tutorials/extending/chapter1-basics
+target.path = $$DESTPATH
+
+qml.files = *.qml
+qml.path = $$DESTPATH
+
+INSTALLS += target qml
diff --git a/examples/qml/tutorials/extending/chapter1-basics/chapter1-basics.qrc b/examples/qml/tutorials/extending/chapter1-basics/chapter1-basics.qrc
new file mode 100644 (file)
index 0000000..f1168ae
--- /dev/null
@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>app.qml</file>
+    </qresource>
+</RCC>
index d30628f..4e719d2 100644 (file)
@@ -50,7 +50,7 @@ int main(int argc, char *argv[])
 
     QQuickView view;
     view.setResizeMode(QQuickView::SizeRootObjectToView);
-    view.setSource(QUrl::fromLocalFile("app.qml"));
+    view.setSource(QUrl("qrc:///app.qml"));
     view.show();
     return app.exec();
 }
index 8ed66f8..a451c77 100644 (file)
@@ -3,3 +3,13 @@ QT += qml quick
 HEADERS += piechart.h
 SOURCES += piechart.cpp \
            main.cpp
+
+RESOURCES += chapter2-methods.qrc
+
+DESTPATH = $$[QT_INSTALL_EXAMPLES]/qml/tutorials/extending/chapter2-methods
+target.path = $$DESTPATH
+
+qml.files = *.qml
+qml.path = $$DESTPATH
+
+INSTALLS += target qml
diff --git a/examples/qml/tutorials/extending/chapter2-methods/chapter2-methods.qrc b/examples/qml/tutorials/extending/chapter2-methods/chapter2-methods.qrc
new file mode 100644 (file)
index 0000000..f1168ae
--- /dev/null
@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>app.qml</file>
+    </qresource>
+</RCC>
index d30628f..4e719d2 100644 (file)
@@ -50,7 +50,7 @@ int main(int argc, char *argv[])
 
     QQuickView view;
     view.setResizeMode(QQuickView::SizeRootObjectToView);
-    view.setSource(QUrl::fromLocalFile("app.qml"));
+    view.setSource(QUrl("qrc:///app.qml"));
     view.show();
     return app.exec();
 }
diff --git a/examples/qml/tutorials/extending/chapter3-bindings/chapter3-binding.qrc b/examples/qml/tutorials/extending/chapter3-bindings/chapter3-binding.qrc
new file mode 100644 (file)
index 0000000..f1168ae
--- /dev/null
@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>app.qml</file>
+    </qresource>
+</RCC>
index 8ed66f8..6193f46 100644 (file)
@@ -3,3 +3,13 @@ QT += qml quick
 HEADERS += piechart.h
 SOURCES += piechart.cpp \
            main.cpp
+
+RESOURCES += chapter3-binding.qrc
+
+DESTPATH = $$[QT_INSTALL_EXAMPLES]/qml/tutorials/extending/chapter3-binding
+target.path = $$DESTPATH
+
+qml.files = *.qml
+qml.path = $$DESTPATH
+
+INSTALLS += target qml
index d30628f..4e719d2 100644 (file)
@@ -50,7 +50,7 @@ int main(int argc, char *argv[])
 
     QQuickView view;
     view.setResizeMode(QQuickView::SizeRootObjectToView);
-    view.setSource(QUrl::fromLocalFile("app.qml"));
+    view.setSource(QUrl("qrc:///app.qml"));
     view.show();
     return app.exec();
 }
index 23eb222..6d5c7ac 100644 (file)
@@ -5,3 +5,13 @@ HEADERS += piechart.h \
 SOURCES += piechart.cpp \
            pieslice.cpp \
            main.cpp
+
+RESOURCES += chapter4-customPropertyTypes.qrc
+
+DESTPATH = $$[QT_INSTALL_EXAMPLES]/qml/tutorials/extending/chapter4-customPropertyTypes
+target.path = $$DESTPATH
+
+qml.files = *.qml
+qml.path = $$DESTPATH
+
+INSTALLS += target qml
diff --git a/examples/qml/tutorials/extending/chapter4-customPropertyTypes/chapter4-customPropertyTypes.qrc b/examples/qml/tutorials/extending/chapter4-customPropertyTypes/chapter4-customPropertyTypes.qrc
new file mode 100644 (file)
index 0000000..f1168ae
--- /dev/null
@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>app.qml</file>
+    </qresource>
+</RCC>
index 5b6e1cf..fc59a11 100644 (file)
@@ -57,7 +57,7 @@ int main(int argc, char *argv[])
 
     QQuickView view;
     view.setResizeMode(QQuickView::SizeRootObjectToView);
-    view.setSource(QUrl::fromLocalFile("app.qml"));
+    view.setSource(QUrl("qrc:///app.qml"));
     view.show();
     return app.exec();
 
index 23eb222..7cc2b40 100644 (file)
@@ -5,3 +5,13 @@ HEADERS += piechart.h \
 SOURCES += piechart.cpp \
            pieslice.cpp \
            main.cpp
+
+RESOURCES += chapter5-listproperties.qrc
+
+DESTPATH = $$[QT_INSTALL_EXAMPLES]/qml/tutorials/extending/chapter5-listproperties
+target.path = $$DESTPATH
+
+qml.files = *.qml
+qml.path = $$DESTPATH
+
+INSTALLS += target qml
diff --git a/examples/qml/tutorials/extending/chapter5-listproperties/chapter5-listproperties.qrc b/examples/qml/tutorials/extending/chapter5-listproperties/chapter5-listproperties.qrc
new file mode 100644 (file)
index 0000000..f1168ae
--- /dev/null
@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>app.qml</file>
+    </qresource>
+</RCC>
index f8826f6..8a4afcf 100644 (file)
@@ -52,7 +52,7 @@ int main(int argc, char *argv[])
 
     QQuickView view;
     view.setResizeMode(QQuickView::SizeRootObjectToView);
-    view.setSource(QUrl::fromLocalFile("app.qml"));
+    view.setSource(QUrl("qrc:///app.qml"));
     view.show();
     return app.exec();
 }
diff --git a/examples/qml/tutorials/extending/chapter6-plugins/app.pro b/examples/qml/tutorials/extending/chapter6-plugins/app.pro
new file mode 100644 (file)
index 0000000..c55db00
--- /dev/null
@@ -0,0 +1,10 @@
+TARGET = chapter6-plugins
+QT += qml quick
+
+# Avoid going to debug/release subdirectory
+# so that our application will see the
+# import path for the Charts module.
+win32: DESTDIR = ./
+
+SOURCES += main.cpp
+RESOURCES += app.qrc
diff --git a/examples/qml/tutorials/extending/chapter6-plugins/app.qrc b/examples/qml/tutorials/extending/chapter6-plugins/app.qrc
new file mode 100644 (file)
index 0000000..f1168ae
--- /dev/null
@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>app.qml</file>
+    </qresource>
+</RCC>
index 6bf44b4..f858c80 100644 (file)
@@ -1,18 +1,5 @@
-TEMPLATE = lib
-CONFIG += plugin
-QT += qml quick
-
-DESTDIR = Charts
-TARGET = chartsplugin
-
-OBJECTS_DIR = tmp
-MOC_DIR = tmp
-
-HEADERS += piechart.h \
-           pieslice.h \
-           chartsplugin.h
-
-SOURCES += piechart.cpp \
-           pieslice.cpp \
-           chartsplugin.cpp
-
+TEMPLATE = subdirs
+CONFIG += ordered
+SUBDIRS = \
+          import \
+          app.pro
diff --git a/examples/qml/tutorials/extending/chapter6-plugins/import/import.pro b/examples/qml/tutorials/extending/chapter6-plugins/import/import.pro
new file mode 100644 (file)
index 0000000..83cfb96
--- /dev/null
@@ -0,0 +1,26 @@
+TEMPLATE = lib
+CONFIG += plugin
+QT += qml quick
+
+DESTDIR = ../Charts
+TARGET = $$qtLibraryTarget(chartsplugin)
+
+HEADERS += piechart.h \
+           pieslice.h \
+           chartsplugin.h
+
+SOURCES += piechart.cpp \
+           pieslice.cpp \
+           chartsplugin.cpp
+
+DESTPATH=$$[QT_INSTALL_EXAMPLES]/qml/tutorials/extending/chapter6-plugins/Charts
+
+target.path=$$DESTPATH
+qmldir.files=$$PWD/qmldir
+qmldir.path=$$DESTPATH
+INSTALLS += target qmldir
+
+OTHER_FILES += qmldir
+
+# Copy the qmldir file to the same folder as the plugin binary
+QMAKE_POST_LINK += $$QMAKE_COPY $$replace($$list($$quote($$PWD/qmldir) $$DESTDIR), /, $$QMAKE_DIR_SEP)
diff --git a/examples/qml/tutorials/extending/chapter6-plugins/main.cpp b/examples/qml/tutorials/extending/chapter6-plugins/main.cpp
new file mode 100644 (file)
index 0000000..60d8c6c
--- /dev/null
@@ -0,0 +1,53 @@
+/****************************************************************************
+**
+** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/legal
+**
+** This file is part of the documentation 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 Digia Plc 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]
+#include <QtQuick/QQuickView>
+#include <QGuiApplication>
+
+int main(int argc, char *argv[])
+{
+    QGuiApplication app(argc, argv);
+    QQuickView view;
+    view.setResizeMode(QQuickView::SizeRootObjectToView);
+    view.setSource(QUrl("qrc:///app.qml"));
+    view.show();
+    return app.exec();
+}
+//![0]
index 1b11fa1..74aaae7 100644 (file)
@@ -48,6 +48,10 @@ exampledirs += ../../../examples/qml \
 
 imagedirs   += images
 
+# Add a thumbnail for examples that do not have images
+manifestmeta.thumbnail.names += "QtQml/Chapter 4*" \
+                                "QtQml/Chapter 6*"
+
 navigation.landingpage = "Qt QML"
 navigation.cppclassespage = "Qt QML C++ Classes"
 navigation.qmltypespage = "Qt QML QML Types"
index d0fb03a..ecfcf8f 100644 (file)
@@ -397,36 +397,50 @@ The complete code can be seen in the updated \c examples/qml/tutorials/extending
 Currently the \c PieChart and \c PieSlice types are used by \c app.qml,
 which is displayed using a QQuickView in a C++ application. An alternative
 way to use our QML extension is to create a plugin library to make it available
-to the QML engine. This would allow the \c PieChart and \c PieSlice types to be
-registered into a type namespace which could be imported by any QML application,
-instead of restricting these types to be only used by the one application.
+to the QML engine as a new QML import module. This allows the \c PieChart and
+\c PieSlice types to be registered into a type namespace which can be imported
+by any QML application, instead of restricting these types to be only used by
+the one application.
 
-The setps for creating a plugin are described in \l {Creating C++ Plugins for QML}.
+The steps for creating a plugin are described in \l {Creating C++ Plugins for QML}.
 To start with, we create a plugin class named \c ChartsPlugin. It subclasses QQmlExtensionPlugin
 and registers our QML types in the inherited \l{QQmlExtensionPlugin::}{registerTypes()} method.
 
 Here is the \c ChartsPlugin definition in \c chartsplugin.h:
 
-\snippet tutorials/extending/chapter6-plugins/chartsplugin.h 0
+\snippet tutorials/extending/chapter6-plugins/import/chartsplugin.h 0
 
 And its implementation in \c chartsplugin.cpp:
 
-\snippet tutorials/extending/chapter6-plugins/chartsplugin.cpp 0
+\snippet tutorials/extending/chapter6-plugins/import/chartsplugin.cpp 0
 
 Then, we write a \c .pro project file that defines the project as a plugin library
-and specifies with DESTDIR that library files should be built into a "lib" subdirectory:
+and specifies with DESTDIR that library files should be built into a \c {../Charts}
+directory.
 
-\quotefile tutorials/extending/chapter6-plugins/chapter6-plugins.pro
+\quotefile tutorials/extending/chapter6-plugins/import/import.pro
 
-Finally, we add a \l{qtqml-modules-qmldir.html}{qmldir} file that is
-parsed by the QML engine.  In this file, we specify that a plugin named
-"chapter6-plugin" (the name of the example project) can be found in the "lib" subdirectory:
+In this example, the \c Charts directory is located at the same level as the application
+that uses our new import module. This way, the QML engine will find our module
+as the default search path for QML imports includes the directory of the application
+executable. Alternatively, we could control what directories the \l {QML Import Path}
+{QML import path} contains, useful if there are multiple QML applications using the
+same QML imports.
 
-\quotefile tutorials/extending/chapter6-plugins/Charts/qmldir
+The \c .pro file also contains additional magic to ensure that the
+\l {Module Definition qmldir Files}{module definition qmldir file} is always copied
+to the same location as the plugin binary.
 
-Now we have a plugin, and instead of having a main.cpp and an executable, we can build
-the project and then load the QML file using the \l{Prototyping with qmlscene}{qmlscene tool},
-setting the import path to the current directory so that it finds the \c qmldir file:
+The \c qmldir file declares the module name and the plugin that is made available
+by the module:
+
+\quotefile tutorials/extending/chapter6-plugins/import/qmldir
+
+Now we have a QML module that can be imported to any application, provided that the
+QML engine knows where to find it. The example contains an executable that loads
+\c app.qml, which uses the \c {import Charts 1.0} statement. Alternatively, you can
+load the QML file using the \l{Prototyping with qmlscene}{qmlscene tool}, setting the
+import path to the current directory so that it finds the \c qmldir file:
 
 \code
     qmlscene -I . app.qml
@@ -434,7 +448,6 @@ setting the import path to the current directory so that it finds the \c qmldir
 
 The module "Charts" will be loaded by the QML engine, and the types provided by that
 module will be available for use in any QML document which imports it.
-
 */