qtquick-creating.qdoc 5.89 KB
Newer Older
1
2
/****************************************************************************
**
3
** Copyright (c) 2013 Digia Plc and/or its subsidiary(-ies).
hjk's avatar
hjk committed
4
** Contact: http://www.qt-project.org/legal
5
**
hjk's avatar
hjk committed
6
** This file is part of Qt Creator
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
**
**
** 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.
**
**
****************************************************************************/

// **********************************************************************
// NOTE: the sections are not ordered by their logical order to avoid
// reshuffling the file each time the index order changes (i.e., often).
// Run the fixnavi.pl script to adjust the links to the index order.
// **********************************************************************

/*!

    \contentspage index.html
    \previouspage creator-visual-editor.html
    \page quick-projects.html
    \nextpage creator-using-qt-quick-designer.html

    \title Creating Qt Quick Projects

    \image qmldesigner-new-project.png "New File or Project dialog"

    When you create a new Qt Quick project from scratch, you have the following
    options:

    \list

41
        \li \gui {Qt Quick Application} creates a Qt Quick application project
42
            that can contain both QML and C++ code. The project includes a
43
            QDeclarativeView. You can build the application and deploy it to
44
45
46
47
48
49
50
            desktop and mobile target platforms.

            You can select a template that uses either the built-in QML elements
            or Qt Quick components for a particular platform. The built-in QML
            elements enable you to create cross-platform applications with a
            custom look and feel, whereas the components provide the look and
            feel for a particular platform.
51

52
53
54
55
56
57
58
59
            The Qt Quick 1 Application wizard imports Qt Quick 1.1, and
            therefore, you can use it without changes to develop for platforms
            that run Qt 4.7.4 (such as MeeGo). To develop for platforms that run
            Qt 4.7.3 (such as Maemo), you must change the import statement to
            import Qt Quick 1.0.

            The Qt Quick 2 Application wizard imports Qt Quick 2.0. Use it to
            develop for platforms that run Qt 5.
60
        \li \gui {Qt Quick UI} creates a Qt Quick UI project with a single QML
61
            file that contains the main view. You can review Qt Quick UI
62
63
            projects in a \l{Previewing QML Files}{preview tool} and you need
            not build them. You do not
64
            need to have the development environment installed on your
65
            computer to create and run this type of project.
66

67
68
        \li \gui {Qt Quick Application (from Existing QML File)} converts
            existing Qt Quick applications to Qt Quick application projects.
69
            This enables you to run them from \QC and to deploy them to mobile
70
71
            devices.

72
        \li \gui {Qt Quick Extension Plugins} (in the \gui Libraries category)
73
74
75
76
77
            create C++ plugins that make it possible to offer extensions that
            can be loaded dynamically into Qt Quick applications. Select
            \gui {Qt Quick 1 Extension Plugin} to create extensions for
            Qt Quick 1 applications and \gui {Qt Quick 2 Extension Plugin} to
            create extensions for Qt Quick 2 applications.
78
79
80
81
82

    \endlist

    \section1 Creating Qt Quick UI Projects

83
84
    Select \gui File > \gui {New File or Project} > \gui Applications > \gui {Qt Quick 1 UI}
    or \gui {Qt Quick 2 UI} > \gui Choose and follow the instructions of the wizard.
85
86
87
88
89

    \QC creates the following files:

    \list

90
        \li .qmlproject project file defines that all QML, JavaScript, and image
91
92
93
            files in the project folder belong to the project. Therefore, you do
            not need to individually list all the files in the project.

94
        \li .qml file defines an element, such as a component, screen, or the
95
96
97
98
99
            whole application UI.

    \endlist

    The \c import statement in the beginning of the .qml file specifies the
100
    \l{http://qt-project.org/doc/qt-4.8/qdeclarativemodules.html}{Qt modules} to
101
102
103
104
105
106
107
108
    import. Each Qt module contains a set of default elements. Specify a version
    to get the features you want.

    To use JavaScript and image files in the application, copy them to the
    project folder.

    \section1 Creating Qt Quick Applications

109
110
111
112
    Select \gui File > \gui {New File or Project} > \gui Applications >
    \gui {Qt Quick Application 1 (Built-in Elements)} or \gui {Qt Quick
    Application 2 (Built-in Elements)} > \gui Choose, and follow the
    instructions of the wizard.
113

114
115
116
    \note The SDK for a particular target platform might install additional
    templates for that platform. For example, the \gui {Qt Quick Application for
    MeeGo Harmattan} template is installed as part of the MeeGo Harmattan tool
117
118
    chain and the BlackBerry 10 and QNX templates are installed as part of the BlackBerry 10 NDK,
    BlackBerry NDK, or QNX SDK.
119
120

    \QC creates the necessary boilerplate files. Some of the files are
121
    specific to a particular target platform.
122
123
124
125

    \section1 Importing QML Applications

    If you have existing QML applications that you want to run in \QC or deploy
126
127
128
    to mobile devices, select \gui File > \gui {New File or Project} > \gui Applications >
    \gui {Qt Quick 1 Application (from Existing QML file} or \gui {Qt Quick 2 Application
    (from Existing QML File)} > \gui Choose to import the main .qml file in your project.
129

130
    \image qmldesigner-import-project.png "Select Existing QML File dialog"
131

132
133
    All the other files in the project are automatically added to the
    application project.
134
135
136
137
    \QC adds references to the QML files to a project and creates the additional
    files necessary for deploying applications to mobile devices.

*/