aboutsummaryrefslogtreecommitdiffstats
path: root/src/qml/doc/src/qmllanguageref/documents/topic.qdoc
blob: aa13229165f92aa0377c201b79634c4002f1263a (plain)
1
2
3
4
5
6
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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
/****************************************************************************
**
** 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:FDL$
** Commercial License Usage
** Licensees holding valid commercial Qt licenses may use this file in
** accordance with the commercial license agreement provided with the
** Software or, alternatively, in accordance with the terms contained in
** a written agreement between you and Digia.  For licensing terms and
** conditions see http://qt.digia.com/licensing.  For further information
** use the contact form at http://qt.digia.com/contact-us.
**
** GNU Free Documentation License Usage
** 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.  Please review the following information to ensure
** the GNU Free Documentation License version 1.3 requirements
** will be met: http://www.gnu.org/copyleft/fdl.html.
** $QT_END_LICENSE$
**
****************************************************************************/
/*!
\page qtqml-documents-topic.html
\title QML Documents
\brief Description of QML documents

A QML document is a string which conforms to QML document syntax.  A document
defines a QML object type.  A document is generally loaded from a \c ".qml"
file stored either locally or remotely, but can be constructed manually in
code.  An instance of the object type defined by a document may be created
using a \l Component in QML code, or a \l QQmlComponent in C++.
Alternatively, if the object type is explicitly exposed to the QML type system
with a particular type name, the type may be used directly in object
declarations in other documents.

The ability to define re-usable QML object types in documents is an important
enabler to allow clients to write modular, highly readable and maintainable
code.

Since Qt 5.4, a document can also have the file extension \c ".ui.qml". The QML
engine handles these files like standard .qml files and ignores the \c .ui part
of the extension. Qt Creator handles those files as
\l{Qt Creator: Qt Quick UI Forms}{UI forms} for the Qt Quick Designer. The files
can contain only a subset of the QML language that is defined by Qt Creator.

\section1 Structure of a QML Document

A QML document consists of two sections: the imports section, and the object
declaration section.  The imports section in a document contains import
statements that define which QML object types and JavaScript resources the
document is able to use.  The object declaration section defines the object
tree to be created when instantiating the object type defined by the document.

An example of a simple document is as follows:

\qml
import QtQuick 2.0

Rectangle {
    width: 300
    height: 200
    color: "blue"
}
\endqml

See the \l {qtqml-documents-structure.html}{Structure of a QML Document}
for more information on the topic.

\section2 Syntax of the QML Language

The object declaration section of the document must specify a valid object
hierarchy with appropriate \l {qtqml-syntax-basics.html}{QML syntax}.  An
object declaration may include the specification of custom
\l{qtqml-syntax-objectattributes.html}{object attributes}.  Object method
attributes may be specified as JavaScript functions, and object property
attributes may be assigned \l{qtqml-syntax-propertybinding.html}
{property binding expressions}.

Please see the documentation about the \l{qtqml-syntax-basics.html}
{syntax of QML} for more information about valid syntax, and see the
documentation about \l{qtqml-javascript-topic.html}
{integrating QML and JavaScript} for in-depth information on that topic.

\section1 Defining Object Types through QML Documents

As described briefly in the previous section, a document implicitly defines
a QML object type.  One of the core principles of QML is the ability to define
and then re-use object types.  This improves the maintainability of QML code,
increases the readability of object hierarchy declarations, and promotes
separation between UI definition and logic implementation.

In the following example, the client developer defines a \c Button type with
a document in a file:

\snippet ../quick/doc/snippets/qml/qml-extending-types/components/Button.qml 0

The \c Button type can then be used in an application:

\table
\row
\li \snippet ../quick/doc/snippets/qml/qml-extending-types/components/application.qml 0
\li \image button-types.png
\endtable

Please see the documentation about \l{qtqml-documents-definetypes.html}
{defining object types in documents} for in-depth information on the
topic.

\section1 Resource Loading and Network Transparency

It is important to note that QML is network-transparent.  Applications can
import documents from remote paths just as simply as documents from local
paths.  In fact, any \c url property may be assigned a remote or local URL,
and the QML engine will handle any network communication involved.

Please see the \l{qtqml-documents-networktransparency.html}
{Network Transparency} documentation for more information about network
transparency in imports.

\section1 Scope and Naming Resolution

Expressions in documents usually involve objects or properties of objects,
and since multiple objects may be defined and since different objects may have
properties with the same name, some predefined symbol resolution semantics must
be defined by QML.  Please see the page on \l{qtqml-documents-scope.html}
{scope and symbol resolution} for in-depth information about the topic.

*/