diff options
author | Leena Miettinen <riitta-leena.miettinen@theqtcompany.com> | 2015-11-02 13:21:31 +0100 |
---|---|---|
committer | Leena Miettinen <riitta-leena.miettinen@theqtcompany.com> | 2015-11-03 09:26:49 +0000 |
commit | 95c7d6fed5c47ecab1d3e56fef9e0ab8755f2a60 (patch) | |
tree | e74bf3a446d68c6f91ad35eadcd300436883763d /doc/examples | |
parent | e2b8a1cb118723bc4e37bf1758ed72e1c00ae559 (diff) | |
download | qt-creator-95c7d6fed5c47ecab1d3e56fef9e0ab8755f2a60.tar.gz |
Doc: update the Transitions example to use UI forms
Move the instructions for creating the project into an
include file that can be used for all Qt Quick Application
tutorials.
Change-Id: I02385f68f23ef2d3ee98b754344781ae1819203c
Reviewed-by: Tim Jenssen <tim.jenssen@theqtcompany.com>
Diffstat (limited to 'doc/examples')
-rw-r--r-- | doc/examples/transitions/MainForm.ui.qml | 117 | ||||
-rw-r--r-- | doc/examples/transitions/main.cpp | 52 | ||||
-rw-r--r-- | doc/examples/transitions/main.qml | 140 | ||||
-rw-r--r-- | doc/examples/transitions/qml.qrc | 7 | ||||
-rw-r--r-- | doc/examples/transitions/qt-logo.png | bin | 0 -> 5149 bytes | |||
-rw-r--r-- | doc/examples/transitions/states.svg | 93 | ||||
-rw-r--r-- | doc/examples/transitions/transitions.pro | 15 |
7 files changed, 247 insertions, 177 deletions
diff --git a/doc/examples/transitions/MainForm.ui.qml b/doc/examples/transitions/MainForm.ui.qml new file mode 100644 index 0000000000..a209dd5621 --- /dev/null +++ b/doc/examples/transitions/MainForm.ui.qml @@ -0,0 +1,117 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** 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 The Qt Company Ltd 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.5 +import QtQuick.Controls 1.4 +import QtQuick.Layouts 1.2 + +Item { + width: 640 + height: 480 + property alias bottomLeftRect: bottomLeftRect + property alias middleRightRect: middleRightRect + property alias topLeftRect: topLeftRect + property alias icon: icon + property alias mouseArea1: mouseArea1 + property alias mouseArea2: mouseArea2 + property alias mouseArea3: mouseArea3 + + Rectangle { + id: topLeftRect + width: 46 + height: 55 + color: "#00000000" + radius: 6 + anchors.left: parent.left + anchors.leftMargin: 10 + anchors.top: parent.top + anchors.topMargin: 20 + border.color: "#808080" + + MouseArea { + id: mouseArea1 + anchors.fill: parent + } + } + + Rectangle { + id: middleRightRect + x: 6 + y: 6 + width: 46 + height: 55 + color: "#00000000" + radius: 6 + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: 10 + MouseArea { + id: mouseArea2 + anchors.fill: parent + } + border.color: "#808080" + } + + Rectangle { + id: bottomLeftRect + x: 0 + y: 4 + width: 46 + height: 55 + color: "#00000000" + radius: 6 + anchors.bottom: parent.bottom + anchors.bottomMargin: 20 + MouseArea { + id: mouseArea3 + anchors.fill: parent + } + anchors.left: parent.left + border.color: "#808080" + anchors.leftMargin: 10 + } + + Image { + id: icon + x: 10 + y: 20 + source: "qt-logo.png" + } +} diff --git a/doc/examples/transitions/main.cpp b/doc/examples/transitions/main.cpp new file mode 100644 index 0000000000..1f6684a668 --- /dev/null +++ b/doc/examples/transitions/main.cpp @@ -0,0 +1,52 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** 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 The Qt Company Ltd 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$ +** +****************************************************************************/ + +#include <QGuiApplication> +#include <QQmlApplicationEngine> + +int main(int argc, char *argv[]) +{ + QGuiApplication app(argc, argv); + + QQmlApplicationEngine engine; + engine.load(QUrl(QStringLiteral("qrc:/main.qml"))); + + return app.exec(); +} diff --git a/doc/examples/transitions/main.qml b/doc/examples/transitions/main.qml index c4ccfe0c5e..f7595d05c8 100644 --- a/doc/examples/transitions/main.qml +++ b/doc/examples/transitions/main.qml @@ -1,91 +1,63 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** 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 The Qt Company Ltd 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.5 import QtQuick.Controls 1.4 +import QtQuick.Dialogs 1.2 ApplicationWindow { - id: page visible: true - width: 360 - height: 360 - color: "#343434" title: qsTr("Transitions") + width: 330 + height: 330 - menuBar: MenuBar { - Menu { - title: qsTr("File") - MenuItem { - text: qsTr("&Open") - onTriggered: console.log("Open action triggered"); - } - MenuItem { - text: qsTr("Exit") - onTriggered: Qt.quit(); - } - } - } - - Image { - id: icon - x: 10 - y: 20 - source: "states.svg" - } - - Rectangle { - id: topLeftRect - x: 10 - y: 20 - width: 44 - height: 44 - color: "#00000000" - radius: 6 - opacity: 1 - anchors.left: parent.left - anchors.leftMargin: 10 - anchors.top: parent.top - anchors.topMargin: 20 - border.color: "#808080" - - MouseArea { - id: mouseArea1 - anchors.fill: parent + MainForm { + anchors.fill: parent + id: page + mouseArea1 { onClicked: stateGroup.state = ' ' } - } - - Rectangle { - id: middleRightRect - width: 44 - height: 44 - color: "#00000000" - radius: 6 - anchors.right: parent.right - anchors.rightMargin: 10 - anchors.verticalCenter: parent.verticalCenter - border.color: "#808080" - - MouseArea { - id: mouseArea2 - anchors.fill: parent + mouseArea2 { onClicked: stateGroup.state = 'State1' } - } - - Rectangle { - id: bottomLeftRect - width: 44 - height: 44 - color: "#00000000" - radius: 6 - border.width: 1 - anchors.leftMargin: 10 - anchors.bottom: parent.bottom - anchors.bottomMargin: 20 - anchors.left: parent.left - border.color: "#808080" - - MouseArea { - id: mouseArea3 - anchors.fill: parent + mouseArea3 { onClicked: stateGroup.state = 'State2' } } @@ -97,18 +69,18 @@ ApplicationWindow { name: "State1" PropertyChanges { - target: icon - x: middleRightRect.x - y: middleRightRect.y + target: page.icon + x: page.middleRightRect.x + y: page.middleRightRect.y } }, State { name: "State2" PropertyChanges { - target: icon - x: bottomLeftRect.x - y: bottomLeftRect.y + target: page.icon + x: page.bottomLeftRect.x + y: page.bottomLeftRect.y } } ] @@ -137,4 +109,4 @@ ApplicationWindow { } ] } -} + } diff --git a/doc/examples/transitions/qml.qrc b/doc/examples/transitions/qml.qrc new file mode 100644 index 0000000000..e39f0cf331 --- /dev/null +++ b/doc/examples/transitions/qml.qrc @@ -0,0 +1,7 @@ +<RCC> + <qresource prefix="/"> + <file>main.qml</file> + <file>MainForm.ui.qml</file> + <file>qt-logo.png</file> + </qresource> +</RCC> diff --git a/doc/examples/transitions/qt-logo.png b/doc/examples/transitions/qt-logo.png Binary files differnew file mode 100644 index 0000000000..14ddf2a028 --- /dev/null +++ b/doc/examples/transitions/qt-logo.png diff --git a/doc/examples/transitions/states.svg b/doc/examples/transitions/states.svg deleted file mode 100644 index 566acfada0..0000000000 --- a/doc/examples/transitions/states.svg +++ /dev/null @@ -1,93 +0,0 @@ -<?xml version="1.0" encoding="UTF-8" standalone="no"?> -<svg - xmlns:dc="http://purl.org/dc/elements/1.1/" - xmlns:cc="http://creativecommons.org/ns#" - 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" - height="44px" - version="1.1" - viewBox="0 0 44 44" - width="44px" - x="0px" - y="0px" - id="svg2" - inkscape:version="0.47 r22583" - sodipodi:docname="qt.svg"> - <metadata - id="metadata18"> - <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> - <defs - id="defs16"> - <inkscape:perspective - sodipodi:type="inkscape:persp3d" - inkscape:vp_x="0 : 22 : 1" - inkscape:vp_y="0 : 1000 : 0" - inkscape:vp_z="44 : 22 : 1" - inkscape:persp3d-origin="22 : 14.666667 : 1" - id="perspective2836" /> - </defs> - <sodipodi:namedview - pagecolor="#ffffff" - bordercolor="#666666" - borderopacity="1" - objecttolerance="10" - gridtolerance="10" - guidetolerance="10" - inkscape:pageopacity="0" - inkscape:pageshadow="2" - inkscape:window-width="1920" - inkscape:window-height="1020" - id="namedview14" - showgrid="false" - inkscape:zoom="21.454545" - inkscape:cx="49.412871" - inkscape:cy="21.894358" - inkscape:window-x="-4" - inkscape:window-y="-4" - inkscape:window-maximized="1" - inkscape:current-layer="g3" /> - <g - transform="matrix(0.18308778,0,0,0.18308778,6.6100946,3.2385199)" - id="g3"> - <path - d="M 43.09,0.3586 C 40.94,0.0036 38.84,-0.0824 36.81,0.0776 31.968136,0.39505671 27.122677,0.73638425 22.28,1.0696 9.62,2.0816 0,12.4996 0,26.8896 l 0,169.7 14.19,13.2 28.87,-209.42 0.03,-0.011 z" - style="fill:#006225" - id="path5" - sodipodi:nodetypes="cccccccc" /> - <path - d="m 174.4,160 c 0,12.5 -7.75,24.07 -17.57,25.77 L 14.23,209.73 V 25.93 C 14.23,9.21 27.57,-2.27 43.12,0.3 l 131.3,21.52 v 138.2 z" - style="fill:#80c342" - id="path7" /> - <path - d="m 154.9,80.96 -12.96,-0.598 0,0.278 6.945,0.32 6.016,0 z" - style="fill:#006225" - id="path11" /> - <path - d="m 144.6,135.6 c 0.66,0.328 1.43,0.476 2.351,0.476 0.161,0 0.329,-0.004 0.497,-0.016 2.55,-0.148 5.32,-0.933 8.343,-2.308 h -6.015 c -1.821,0.832 -3.532,1.457 -5.176,1.848 z" - style="fill:#006225" - id="path13" /> - <path - id="path17" - style="fill:#ffffff" - d="m 91.15,132.4 c 2.351,-6.051 3.511,-17.91 3.511,-35.62 0,-15.89 -1.148,-26.82 -3.484,-32.81 -2.336,-6.027 -5.832,-9.281 -10.52,-9.691 -0.359,-0.031 -0.714,-0.051 -1.058,-0.051 -4.34,0 -7.68,2.535 -10.01,7.625 -2.52,5.543 -3.793,17.04 -3.793,34.44 0,16.82 1.238,28.75 3.734,35.75 2.356,6.672 5.879,9.976 10.5,9.976 0.207,0 0.41,-0.008 0.621,-0.019 4.633,-0.293 8.121,-3.496 10.49,-9.602 m 17.98,3.75 c -4.117,9.707 -10.39,16.06 -18.99,19 0.867,4.449 2.176,7.441 3.922,9.019 1.351,1.211 3.433,1.821 6.222,1.821 0.805,0 1.668,-0.055 2.59,-0.157 v 13.12 l -5.961,0.782 c -1.758,0.23 -3.426,0.343 -5.004,0.343 -5.218,0 -9.445,-1.265 -12.62,-3.824 -4.207,-3.379 -7.308,-9.894 -9.297,-19.54 -9.136,-1.945 -16.26,-7.754 -21.19,-17.5 -5.004,-9.902 -7.551,-24.39 -7.551,-43.34 0,-20.43 3.484,-35.51 10.34,-45.07 5.789,-8.07 13.86,-12.04 24.02,-12.04 1.629,0 3.309,0.102 5.043,0.305 11.95,1.375 20.62,7.016 26.26,16.79 5.535,9.562 8.254,23.27 8.254,41.26 0,16.48 -2,29.45 -6.043,39.02 z M 130.4,45.91 l 11.52,1.238 0,20.21 12.96,0.914 0,12.68 -12.96,-0.598 0,46.33 c 0,4.032 0.445,6.625 1.34,7.789 0.8,1.067 2.046,1.594 3.71,1.594 0.161,0 0.329,-0.004 0.497,-0.016 2.55,-0.148 5.32,-0.933 8.343,-2.308 v 11.65 c -5.136,2.258 -10.18,3.598 -15.12,4.02 -0.718,0.055 -1.41,0.086 -2.078,0.086 -4.48,0 -7.906,-1.301 -10.25,-3.934 -2.73,-3.051 -4.09,-7.949 -4.09,-14.67 V 79.535 L 118.046,79.25 V 65.66 l 7.586,0.547 4.773,-20.3 z" /> - <path - d="m 100.3,166 c 0.809,0 1.672,-0.055 2.59,-0.157 H 98.054 C 98.73,165.949 99.507,166 100.3,166 z" - style="fill:#006225" - id="path19" /> - <path - id="path21" - style="fill:#006225" - d="m 84.85,63.98 c 2.336,5.997 3.484,16.92 3.484,32.81 0,17.7 -1.16,29.57 -3.512,35.62 -1.894,4.879 -4.527,7.902 -7.863,9.07 0.965,0.368 1.992,0.551 3.078,0.551 0.207,0 0.41,-0.008 0.621,-0.019 4.633,-0.293 8.121,-3.496 10.49,-9.602 2.351,-6.051 3.511,-17.91 3.511,-35.62 0,-15.89 -1.148,-26.82 -3.484,-32.81 -2.336,-6.027 -5.832,-9.281 -10.52,-9.691 -0.359,-0.031 -0.714,-0.051 -1.058,-0.051 -1.09,0 -2.117,0.16 -3.082,0.481 h -0.004 c 3.601,1.121 6.379,4.215 8.336,9.261 z m -2.344,114.3 c -0.113,-0.05 -0.227,-0.105 -0.336,-0.16 -0.012,-0.004 -0.023,-0.012 -0.035,-0.015 -0.102,-0.051 -0.207,-0.106 -0.309,-0.157 -0.019,-0.011 -0.039,-0.019 -0.058,-0.031 -0.09,-0.051 -0.184,-0.098 -0.278,-0.148 -0.027,-0.016 -0.054,-0.036 -0.086,-0.051 -0.082,-0.043 -0.164,-0.09 -0.242,-0.137 -0.039,-0.023 -0.078,-0.047 -0.113,-0.07 -0.07,-0.039 -0.145,-0.082 -0.215,-0.125 -0.047,-0.031 -0.094,-0.059 -0.14,-0.09 -0.059,-0.039 -0.118,-0.074 -0.176,-0.113 -0.059,-0.039 -0.114,-0.075 -0.168,-0.114 -0.051,-0.031 -0.102,-0.066 -0.149,-0.097 -0.066,-0.047 -0.132,-0.094 -0.195,-0.137 -0.039,-0.027 -0.078,-0.055 -0.113,-0.082 -0.078,-0.055 -0.153,-0.113 -0.231,-0.172 -0.023,-0.016 -0.05,-0.035 -0.078,-0.055 -0.098,-0.078 -0.199,-0.156 -0.297,-0.234 -4.207,-3.379 -7.308,-9.894 -9.297,-19.54 -9.136,-1.945 -16.26,-7.754 -21.19,-17.5 -5.004,-9.902 -7.551,-24.39 -7.551,-43.34 0,-20.43 3.484,-35.51 10.34,-45.07 5.789,-8.07 13.86,-12.04 24.02,-12.04 h -6.351 c -10.15,0.008 -18.22,3.977 -24,12.04 -6.855,9.563 -10.34,24.64 -10.34,45.07 0,18.95 2.547,33.44 7.551,43.34 4.934,9.75 12.05,15.56 21.19,17.5 1.989,9.641 5.09,16.16 9.297,19.54 3.176,2.559 7.403,3.824 12.62,3.824 0.098,0 0.199,0 0.297,-0.004 h 5.539 c -3.406,-0.05 -6.383,-0.66 -8.906,-1.828 L 82.498,178.28 z M 128.4,145.6 c -2.73,-3.051 -4.09,-7.949 -4.09,-14.67 V 79.57 l -6.226,-0.285 v -13.59 h -6.016 v 3.035 c 0.871,3.273 1.555,6.82 2.063,10.64 l 4.164,0.192 v 51.36 c 0,6.723 1.367,11.62 4.09,14.67 2.343,2.633 5.765,3.934 10.25,3.934 h 6.015 c -4.48,0 -7.906,-1.301 -10.25,-3.934 z m 2.043,-99.66 -6.016,0 -4.668,19.88 5.911,0.422 4.773,-20.3 z" /> - </g> -</svg> diff --git a/doc/examples/transitions/transitions.pro b/doc/examples/transitions/transitions.pro new file mode 100644 index 0000000000..f8ec75d4a9 --- /dev/null +++ b/doc/examples/transitions/transitions.pro @@ -0,0 +1,15 @@ +TEMPLATE = app + +QT += qml quick + +CONFIG += c++11 + +SOURCES += main.cpp + +RESOURCES += qml.qrc + +# Additional import path used to resolve QML modules in Qt Creator's code model +QML_IMPORT_PATH = + +# Default rules for deployment. +include(deployment.pri) |