summaryrefslogtreecommitdiffstats
path: root/doc/src/declarative
diff options
context:
space:
mode:
authorAaron Kennedy <aaron.kennedy@nokia.com>2009-05-05 07:23:31 (GMT)
committerAaron Kennedy <aaron.kennedy@nokia.com>2009-05-05 07:23:31 (GMT)
commit48568f402055dc5ea2bf59224ff06b3050c1927d (patch)
tree3ecacd5292e8b0660252d27cc018afbfcd056f3e /doc/src/declarative
parent61b44e83eab8631ea38155082ebe9fde7490eb55 (diff)
downloadQt-48568f402055dc5ea2bf59224ff06b3050c1927d.zip
Qt-48568f402055dc5ea2bf59224ff06b3050c1927d.tar.gz
Qt-48568f402055dc5ea2bf59224ff06b3050c1927d.tar.bz2
Doc
Diffstat (limited to 'doc/src/declarative')
-rw-r--r--doc/src/declarative/qmlforcpp.qdoc774
-rw-r--r--doc/src/declarative/qtdeclarative.qdoc2
-rw-r--r--doc/src/declarative/scenegraph.qdoc13
3 files changed, 243 insertions, 546 deletions
diff --git a/doc/src/declarative/qmlforcpp.qdoc b/doc/src/declarative/qmlforcpp.qdoc
index f0675fe..282f261 100644
--- a/doc/src/declarative/qmlforcpp.qdoc
+++ b/doc/src/declarative/qmlforcpp.qdoc
@@ -1,15 +1,14 @@
/*!
\page qmlforcpp.html
\target qmlforcpp
- \title Qt Declarative Markup Language For C++ Programmers
+ \title QML for C++ Programmers
This page describes the QML format and how to use and extend it from C++.
- The QML syntax declaratively describes in XML how to construct an in memory
- object tree. QML is usually used to describe a visual scene graph - using
- \l {graphicsview}{GraphicsView} or the \l {fxprimitives}{Fx Primitives} - but it is not conceptually
- limited to this: the QML format is an abstract XML description of \b any
- object tree.
+ The QML syntax declaratively describes how to construct an in memory
+ object tree. QML is usually used to describe a visual scene graph
+ but it is not conceptually limited to this: the QML format is an abstract
+ description of \b any object tree.
QML also includes property bindings. Bindings are ECMAScript expressions
of a properties value. Whenever the value of the expression changes -
@@ -27,58 +26,40 @@
The following code uses the C++ interface to create 100 red rectangles
based on a simple declarative component description.
- \raw html
- <table border="0">
- <tr>
- <td>
- \endraw
+
\code
- QmlComponent redRectangle("<Rect color=\"red\" width=\"100\" height=\"100\" />");
+ QmlComponent redRectangle("Rect { color: \"red\"; width: 100; height: 100 }");
for (int ii = 0; ii < 100; ++ii) {
QObject *rectangle = redRectangle.create();
// ... do something with the rectangle ...
}
\endcode
- \raw html
- </td>
- </tr>
- </table>
- \endraw
- Each independent XML file describes a QML component, but it is
- also possible to create sub-components within a QML file as will be
- shown later.
+ Each independent file describes a QML component, but it is also possible to
+ create sub-components within a QML file as will be shown later.
\section1 QML Format 101
This is some sample QML code.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <Image id="myRect" x="10" y="10" width="100" height="100" src="background.png">
- <Text width="100">
- <height>50</height>
- <color>white</color>
- <font.fontSize>16</font.fontSize>
- Hello world!
- </Text>
- </Image>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
-
- In QML, XML tags and attributes correspond to Qt objects and properties.
- The general rule of thumb is any tag or attribute name that starts with a
- capital letter refers to a class, and names that start with a lower case
- letter to properties. It is not possible to access a property that starts
- with a capital letter from QML.
+ Image {
+ id: myRect
+ x: 10
+ y: 10
+ width: 100
+ height: 100
+ src: "background.png"
+
+ Text {
+ height: 50
+ width: 100
+ color: "white"
+ font.fontSize: 16
+ text: "Hello world!"
+ }
+ }
+ \endcode
The QML snippet shown above instantiates one \c Image instance and one
\c Text instance and sets properties on both. \b Everything in QML
@@ -86,50 +67,18 @@
assigning a property a value. QML relies heavily on Qt's meta object system
and can only instantiate classes that derive from QObject.
- Setting properties can be done in two ways: as an XML attribute directly on
- the class tag that created the the object, or as sub-tags.
- Although syntactically different, their behaviour is identical. The two QML
- snippets below behave exactly the same.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
- \code
- <Rect x="10" y="10" />
- \endcode
-\raw HTML
- </td>
- <td>
-\endraw
- \code
- <Rect>
- <x>10</x>
- <y>10</y>
- </Rect>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
- Arbitrary mixing and matching between the two is allowed.
-
QML can set properties that are more complex than just simple types like
- integers and strings. Properties can be object pointers or Qt interface pointers
- or even lists of object or Qt interface pointers! QML is typesafe, and will
- ensure that only the valid types are assigned to properties.
+ integers and strings. Properties can be object pointers or Qt interface
+ pointers or even lists of object or Qt interface pointers! QML is typesafe,
+ and will ensure that only the valid types are assigned to properties.
Assigning an object to a property is as simple as assigning a basic
integer. Attempting to assign an object to a property when type coercian
fails will produce an error. The following shows an example of valid and of
invalid QML and the corresponding C++ classes.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
+ \table
+ \row \o
\code
class Image : public QObject
{
@@ -142,86 +91,33 @@
...
};
\endcode
-\raw HTML
- </td>
- <td>
-\endraw
- \code
- <!-- OK -->
- <Image>
- <filter>
- <ImageFilter />
- </filter>
- </Image>
-
- <!-- NOT OK: Image cannot be cast into ImageFilter -->
- <Image>
- <filter>
- <Image />
- </filter>
- </Image>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ \o \code
+ // OK
+ Image {
+ filter: ImageFilter {}
+ }
- Classes can also define an optional default property. The default property
- is used for assignment if no explicit property has been specified.
- In the example below, the string "Hello World!" will be assigned to
- the \c Text element's default property - which happens to be the \c text
- property. Both lines do the same thing, one explicitly and one implicitly.
-
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
- \code
- <Text text="Hello World!" />
- <Text>Hello World!</Text>
- \endcode
-\raw HTML
- </td>
- <td>
-\endraw
- \code
- class Text : public QObject
- {
- ...
- Q_PROPERTY(QString text READ text WRITE setText)
- Q_CLASSINFO("DefaultProperty", "text")
- };
+ // NOT OK: Image cannot be cast into ImageFilter
+ Image {
+ filter: Image {}
+ }
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ \endtable
+ Classes can also define an optional default property. The default property
+ is used for assignment if no explicit property has been specified.
Any object property can be the default, even complex properties like lists
of objects. The default property of the \c Rect class is the \c children
property, a list of \c Item's. In the following example, as both \c Image
and \c Text inherit from \c Item the \c Image and \c Text instances are
added to the parent's \c children property.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <Rect>
- <Image />
- <Text />
- </Rect>
+ Rect {
+ Image {}
+ Text {}
+ }
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
Properties that return read-only object pointers can be used recursively.
This can be used, for example, to group properties together. The
@@ -230,11 +126,8 @@
QML makes it easy to interact with these grouped properties, as the
following shows - everything you would expect to work, just does.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
+ \table
+ \row \o
\code
class Text : public ...
{
@@ -250,67 +143,36 @@
Q_PROPERTY(int size READ size WRITE setSize);
};
\endcode
-\raw HTML
- </td>
- <td>
-\endraw
+ \o
\code
- <Text font.family="helvetica">
- <font>
- <bold>true</bold>
- <italic>true</italic>
- </font>
- <font.size>12</font.size>
- </Text>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ Text {
+ font.family: "helvetica"
+ font.size: 12
+ font {
+ bold: true
+ italic: true
+ }
+ }
+ \endcode
+ \endtable
\section1 Defining QML Types
The QML engine has no intrinsic knowledge of any class types. Instead
the programmer must define the C++ types, and their corresponding QML
- name. There are three ways of adding known types to the QML engine:
- \list
- \o
+ name.
+
\code
#define QML_DECLARE_TYPE(T)
#define QML_DEFINE_TYPE(T,QmlName)
\endcode
+
Adding these macros to your library or executable automatically makes the
C++ type \a T available from the declarative markup language under the
name \a QmlName. Of course there's nothing stopping you using the same
- name for both the C++ and the QML name!<br>
- Most types are added to the QML engine using these macros. The only
- requirement is that \a T inherits QObject and has a default constructor.
- \o
- \code
- #define QML_DEFINE_CUSTOM_PARSER(QmlName, CustomParserClass)
- \endcode
- Custom parsers define a way to translate between declarative XML and an
- object instance in the case the default object model lets you down. Free
- form lists (\c {<ListModel>} are an example of a custom parser.
- Custom parsers implement the \l QmlCustomParser interface.
-
- Custom parsers give a developer very fine grain control over how a type is
- instantiated from the XML that describes it. During the
- compilation phase, the custom parser is presented with the XML via a
- QXmlStreamReader and must
- compile this down into an opaque blob that is returned to the compiler.
- When, at runtime, the type is instantiated, the opaque blob is passed into
- the custom parser, which must return a QObject derived type.
-
- \o QML::ClassFactory
-
- The QML engine calls the class factory as a last resort when trying to
- create a type. The class factory returns a \l QmlComponent instance for
- the type if it can create it. This allows "on the fly" types to be created.
- For example, a class factory is used to support automatic instantiation of
- .qml template files.
- \endlist
+ name for both the C++ and the QML name!
+ Any type can be added to the QML engine using these macros. The only
+ requirements are that \a T inherits QObject and that it has a default constructor.
\section1 Property Binding
@@ -321,31 +183,32 @@
Property bindings are ECMAScript expressions and can be applied to any
object property. C++ classes don't have to do anything special to get
- binding support other than define appropriate properties. Property binding
- expressions are differentiated from regular constant literals by surrounding
- them in braces.
+ binding support other than define appropriate properties. When a non-literal
+ property assignment appears in a QML file, it is automatically treated as a
+ property binding.
Here's a simple example that stacks a red, blue and green rectangle.
Bindings are used to ensure that the height of each is kept equal to it's
parent's. Were the root rectangle's height property to change, the child
rectangles height would be updated automatically.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
+
\code
- <Rect color="red" width="100">
- <Rect color="blue" width="50" height="{parent.height}">
- <Rect color="green" width="25" height="{parent.height}">
- </Rect>
- </Rect>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ Rect {
+ color: "red"
+ width: 100
+ Rect {
+ color: "blue"
+ width: 50
+ height: parent.height
+ Rect {
+ color: "green"
+ width: 25
+ height: parent.height
+ }
+ }
+ }
+ \endcode
+
Binding expressions execute in a context. A context behaves as a scope and
defines how the expression resolves property and variable names. Although
the two expressions in the last example are the same, the value of \c parent
@@ -371,24 +234,14 @@
the case of grouped properties - the object context is that of the
instantiated object, the consequences of which are shown below.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <!-- OK --> <!-- NOT OK: Text has no italic property -->
- <Text> <Text>
- <font> <font>
- <bold>{font.italic}</bold> <bold>{italic}</bold>
- </font> </font>
- </Text> </Text>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ // OK // NOT OK
+ Text { Text {
+ font { font {
+ bold: font.italic bold: italic
+ } }
+ } }
+ \endcode
The second context is the "component context". Each QML component (and
consequently each QML file) is created in its own unique binding context.
@@ -396,21 +249,14 @@
object - but in this case it is the component's root object. An example
will illustrate best - the resultant text will read "background.png".
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <Image src="background.png">
- <Text text="{src}" />
- </Image>
+ Image {
+ src: "background.png"
+ Text {
+ text: src
+ }
+ }
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
If the name is not found in either of these contexts, the context heirarchy
is searched parent-by-parent until the name is either found, or the
@@ -421,23 +267,22 @@
parent, rather than fixing them all to a single common point. Here's the
example rewritten to do just that.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <Rect color="red" width="100">
- <Rect color="blue" width="50" height="{parent.height}">
- <Rect color="green" width="25" height="{parent.parent.height}">
- </Rect>
- </Rect>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ Rect {
+ color: "red"
+ width: 100
+ Rect {
+ color: "blue"
+ width: 50
+ height: parent.height
+ Rect {
+ color: "green"
+ width: 25
+ height: parent.parent.height
+ }
+ }
+ }
+ \endcode
Clearly this sort of fragile relationship is undesirable and unmanageable -
moving the green rectangle to be a sibling of the blue or introducing a
@@ -450,28 +295,26 @@
property. Every object automatically has this magical property (if the
object also has an actual property called \c id, that gets set too). As
an id allows an object to be referenced directly, it must be unique within
- a component. Any number of id's can exist, but they must all begin with
- a capital letter. An id of "Root" is valid, while an id of "root" is not.
- \note This is not technically true - lowercase id names do work, but are
- slower. Support will probably be removed for them eventually.
-
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
- \code
- <Rect id="Root" color="red" width="{GreenRect.width + 75}">
- <Rect color="blue" width="{GreenRect.width + 25}" height="{Root.height}">
- <Rect id="GreenRect" color="green" width="25" height="{Root.height}">
- </Rect>
- </Rect>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ a component. By convention, id's should start with an uppercase letter.
+
+ \code
+ Rect {
+ id: Root
+ color: "red"
+ width: GreenRect.width + 75
+ height: Root.height
+ Rect {
+ color: "blue"
+ width: GreenRect.width + 25
+ Rect {
+ id: GreenRect
+ color: "green"
+ width: 25
+ height: Root.height
+ }
+ }
+ }
+ \endcode
To relate id's back to QmlBindContext, id's exist as properties on the
component context.
@@ -483,11 +326,6 @@
the expression will not be updated if the value changes. The following is
an example of a QML friendly property declaration.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
class Example : public QObject
{
@@ -500,11 +338,6 @@
void sampleChanged(int);
};
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
While generally no changes are needed to a C++ class to use property
binding, sometimes more advanced interaction between the binding engine and
@@ -523,19 +356,12 @@
easily associate ECMAScript with signals. Consider the following example,
in which Button is a made-up type with a clicked() signal.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <Button text="Hello world!" onClicked="print(text)" />
+ Button {
+ text: "Hello world!"
+ onClicked: print(text)
+ }
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
Clicking on the button causes "Hello world!" to be printed to the console
(or lost forever if you're running Windows).
@@ -558,23 +384,15 @@
below, as long as you remember to name the parameters of your signal
in C++ (see QMetaMethod::parameterNames()).
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
+ \table
+ \row \o
\code
- <Example>
- <onDoSomething>
- for(var ii = 0; ii &lt; count; ++ii)
- print(message)
- </onDoSomething>
- </Example>
- \endcode
-\raw HTML
- </td>
- <td>
-\endraw
+ Example {
+ onDoSomething: for(var ii = 0; ii &lt; count; ++ii)
+ print(message)
+ }
+ \endcode
+ \o
\code
class Example : public QObject
{
@@ -583,11 +401,7 @@
void doSomething(int count, const QString &message);
};
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ \endtable
Just like property bindings, signal scripts are executed in a context. The
signal script context is identical in scope to the "object context" under
@@ -599,41 +413,23 @@
default method is defined just like a default property, though the special
"DefaultMethod" class info.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
Q_CLASSINFO("DefaultMethod", "myMethod(int)");
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
This is useful in achieving several use cases, like that below which moves
the button when it is clicked.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <Button id="MyButton">
- <onClicked>
- <NumericAnimation target="{MyButton}" property="x" to="100" />
- </onClicked>
- </Button>
+ Button {
+ id: MyButton
+ onClicked: NumericAnimation {
+ target: MyButton
+ property: "x"
+ to: 100
+ }
+ }
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
-
If the class itself actually defines a property called "on<Name>", this will
be assigned the string value and the signal handling behaviour will be
@@ -648,65 +444,44 @@
Qt's QGridLayout is one such example.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <QGridLayout>
- <QLabel QGridLayout.row="0" QGridLayout.column="0" text="Name:"/>
- <QLineEdit QGridLayout.row="0" QGridLayout.column="1" />
-
- <QLabel QGridLayout.row="1" QGridLayout.column="0" text="Occupation:"/>
- <QLineEdit QGridLayout.row="1" QGridLayout.column="1" />
- </QGridLayout>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ QGridLayout {
+ QLabel {
+ QGridLayout.row: 0
+ QGridLayout.column: 0
+ text: "Name:"
+ }
+ QLineEdit {
+ QGridLayout.row: 0
+ QGridLayout.column: 1
+ }
+
+ QLabel {
+ QGridLayout.row: 1
+ QGridLayout.column: 0
+ text: "Occupation:"
+ }
+ QLineEdit {
+ QGridLayout.row: 1
+ QGridLayout.column: 1
+ }
+ }
+ \endcode
- Attached properties are identified by the use of a class name, in the
+ Attached properties are identified by the use of a type name, in the
case shown \c QGridLayout, as a grouped property specifier. To prevent
ambiguity with actual class instantiations, attached properties must
always be specified to include a period but can otherwise be used just like
regular properties.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
- \code
- <!-- OK --> <!-- NOT OK: Creates a QGridLayout, rather than assigning attached property -->
- <QLabel> <QLabel>
- <QGridLayout.row>0</QGridLayout.row> <QGridLayout>
- </QLabel> <row>0</row>
- </QGridLayout>
- </QLabel>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
-
C++ types provide attached properties by declaring the public function \c qmlAttachedProperties like this example.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
+ \table
+ \row \o
\code
static QObject *Type::qmlAttachedProperties(QObject *);
\endcode
-\raw HTML
- </td>
- <td>
-\endraw
+ \o
\code
class Example : public QObject
{
@@ -715,18 +490,14 @@
static QObject *qmlAttachedProperties(QObject *);
};
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ \endtable
When an attached property is accessed, the QML engine will call this method
to create an attachment object, passing in the object instance that the
attached property applies to. The attachment object should define all
the attached properties, and is generally parented to the provided object
- instance to avoid memory leaks. The QML engine does not save this object,
- so it is necessary for the attached property function to ensure that
+ instance to avoid memory leaks. The QML engine does not saves this object,
+ so it is not necessary for the attached property function to ensure that
multiple calls for the same instance object return the same attached object.
While conceptually simple, implementing an attachment object is not quite
@@ -737,23 +508,15 @@
that \b any object can attach \b any attached property. The following is
perfectly valid, although the attached property has no actual effect:
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <FancyGridLayout>
- <Item>
- <Button QGridLayout.row="1" />
- </Item>
- </FancyGridLayout>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ FancyGridLayout {
+ Item {
+ Button {
+ QGridLayout.row: 1
+ }
+ }
+ }
+ \endcode
The property has no effect because the (made-up) FancyGridLayout type defines the meaning
of the \c row attached property only to apply to its direct children. It
@@ -769,29 +532,17 @@
\section1 Property Value Sources
Intrinsically, the QML engine can assign a property either a static value,
- such as a number of object tree, or a property binding. It is possible for
+ such as a number or an object tree, or a property binding. It is possible for
advanced users to extend the engine to assign other "types" of values to
properties. These "types" are known as property value sources.
- Consider the following \l {fxprimitives}{Fx Primitives} example.
+ Consider the following example.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
- <Rect width="100" height="100" color="red">
- <x>
- <NumericAnimation running="true" repeat="true" from="0" to="100" />
- </x>
- </Rect>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ Rect {
+ x: NumericAnimation { running: true; repeat; true; from: 0; to: 100; }
+ }
+ \endcode
Here the \c x property of the rectangle will be animated from 0 to 100.
To support this, the NumericAnimation class inherits the
@@ -805,26 +556,17 @@
QML is designed to allow you to build fully working types without writing
a line of C++ code. This is, for example, used extensively when designing
- applications using the \l {fxprimitives}{Fx Primitives}. To create new types, it is
+ applications using the Fluid UI primitives. To create new types, it is
necessary to be able to define new signals, slots and properties in QML.
- \note slots are not yet supported
-
- Any object is extensible in this way under QML, using the special
- \c properties and \c signals properties. Like \c id, these two properties
- are automatically available on all types under QML and accessible from
- other QML files or directly from C++.
-
In this example, a Button is extended to have an additional
"text2" property (which always returns "Hello world!") and an additional
signal "clicked2" that is also emitted when the button is clicked. Not
a very useful extension, but an extension nonetheless.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
+ \table
+ \row
+ \o
\code
QmlComponent component(xmlData);
QObject *object = component.create();
@@ -833,44 +575,36 @@
// Will be emitted whenever the button is clicked
QObject::connect(object, SIGNAL(clicked2()), this, SLOT(...));
\endcode
-\raw HTML
- </td>
- <td>
-\endraw
+ \o
\code
- <Button text="Hello!">
- <properties>
- <Property name="text2" type="string" />
- </properties>
- <signals>
- <Signal name="clicked2" />
- </signals>
- <text2>Hello world!</text2>
- <onClicked>clicked2.emit()</onClicked>
- </Button>
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
-
- Any number of properties and signals can be added to an existing type. The
- \c Property and \c Signal elements have the following properties that can
- be set:
- \table
- \header \o Tag \o Property \o Description
- \row \o Property \o name \o The name of the property
- \row \o Property \o type \o The type of the property. The available types are: \list \o int \o bool \o double \o real \o string \o color \o date \o variant \endlist The default is variant.
- \row \o Property \o value \o The initial value of the property. Setting this is just a shortcut for setting the property normally, as shown in the example above.
- \row \o Property \o onValueChanged \o A special signal property that is emitted each time the property value changes.
- \row \o Property \o default \o Set this as the object's default property
- \row \o Signal \o name \o The name of the signal.
+ Button {
+ property string text2
+ signal clicked2
+
+ text: "Hello!"
+ text2: "Hello world!"
+ onClicked: clicked2.emit()
+ }
+ \endcode
\endtable
- If the type itself actually defines a property called \c properties or
- \c signals, the respective extension will be disabled for that type and
- the types own properties will be set.
+ The general syntax for defining new properties and signals is:
+
+ \list
+ \o
+ \code
+ [default] property <type> <name> [: <default value>]
+ \endcode
+
+ Where type can be one of \e int, \e bool, \e double, \e real, \e string,
+ \e color, \e date, \e var or \e variant.
+
+ \o
+ \code
+ signal <name>
+ \endcode
+ Currently only parameterless signals are supported.
+ \endlist
\section1 Parser Status
@@ -890,11 +624,6 @@
these notifications, all a class has to do is to inherit the interface, and
notify the Qt meta system using the Q_INTERFACES() macro. For example,
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
class Example : public QObject, public QmlParserStatus
{
@@ -907,11 +636,6 @@
}
};
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
\section1 Extended Type Definitions
@@ -935,29 +659,17 @@
property or slots on the extension object is used instead.
When an extended type is installed, the
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
\code
#define QML_DEFINE_EXTENDED_TYPE(T,QmlName,ExtendedTypeName)
\endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
macro should be used instead of the regular \c QML_DEFINE_TYPE.
This example shows the addition of a read-only \c textLength property to
QLabel being implemented as an extension.
-\raw HTML
- <table border="0">
- <tr>
- <td>
-\endraw
+ \table
+ \row
+ \o
\code
class QLabelExtension : public QObject
{
@@ -971,19 +683,17 @@
};
QML_DEFINE_EXTENDED_TYPE(QLabel,QLabel,QLabelExtension);
\endcode
-\raw HTML
- </td>
- <td>
-\endraw
+ \o
\code
- <QLabel id="Label1" text="Hello World!" />
- <QLabel text="{'Label1 text length:' + Label1.textLength}" />
- \endcode
-\raw HTML
- </td>
- </tr>
- </table>
-\endraw
+ QLabel {
+ id: Label1
+ text: "Hello World!"
+ }
+ QLabel {
+ text: "Label1 text length: " + Label1.textLength
+ }
+ \endcode
+ \endtable
Attributes defined through extensions are inherited, just like attributes
defined on a normal class. Any types that inherit from \c QLabel, will
diff --git a/doc/src/declarative/qtdeclarative.qdoc b/doc/src/declarative/qtdeclarative.qdoc
index 666c8ae..67605dc 100644
--- a/doc/src/declarative/qtdeclarative.qdoc
+++ b/doc/src/declarative/qtdeclarative.qdoc
@@ -65,7 +65,7 @@
\o \l {qmlexamples}{Examples}
\o \l {tutorial}{Tutorial: 'Hello World'}
\o \l {tutorials-declarative-contacts.html}{Tutorial: 'Introduction to QML'}
- \o \l {qmlforcpp}{Qt Declarative Markup Language For C++ Programmers}
+ \o \l {qmlforcpp}{QML For C++ Programmers}
\endlist
Core Features:
diff --git a/doc/src/declarative/scenegraph.qdoc b/doc/src/declarative/scenegraph.qdoc
deleted file mode 100644
index 2340324..0000000
--- a/doc/src/declarative/scenegraph.qdoc
+++ /dev/null
@@ -1,13 +0,0 @@
-/*!
- \page graphicsview.html
- \target graphicsview
- \title GraphicsView
-
-*/
-
-/*!
- \page fxprimitives.html
- \target fxprimitives
- \title FX Primitives
-
-*/