summaryrefslogtreecommitdiffstats
path: root/doc/src/declarative
diff options
context:
space:
mode:
authorBea Lam <bea.lam@nokia.com>2010-05-31 06:59:48 (GMT)
committerBea Lam <bea.lam@nokia.com>2010-05-31 07:00:42 (GMT)
commit4759e47a2444d481156ad1a789e5affbc92e1b58 (patch)
treed4c418c0da23c7ad4ab595475cd71a89075a2249 /doc/src/declarative
parente5cc765d2fa1ff68f1592ad475d6b8f4e5a6f667 (diff)
downloadQt-4759e47a2444d481156ad1a789e5affbc92e1b58.zip
Qt-4759e47a2444d481156ad1a789e5affbc92e1b58.tar.gz
Qt-4759e47a2444d481156ad1a789e5affbc92e1b58.tar.bz2
Various doc fixes and improvements
Diffstat (limited to 'doc/src/declarative')
-rw-r--r--doc/src/declarative/basictypes.qdoc67
-rw-r--r--doc/src/declarative/globalobject.qdoc2
-rw-r--r--doc/src/declarative/pics/repeater-modeldata.pngbin0 -> 2600 bytes
-rw-r--r--doc/src/declarative/qml-intro.qdoc26
4 files changed, 68 insertions, 27 deletions
diff --git a/doc/src/declarative/basictypes.qdoc b/doc/src/declarative/basictypes.qdoc
index 8db1c35..43ae214 100644
--- a/doc/src/declarative/basictypes.qdoc
+++ b/doc/src/declarative/basictypes.qdoc
@@ -46,9 +46,9 @@
QML has a set of primitive types, as listed below, that are used throughout
the \l {QML Elements}.
- The simpler types in this list can also be used for defining a new
- \c property in a component. See \l{Extending types from QML} for the
- list of types that can be used for custom properties.
+ Some of these types can also be used for defining
+ \c property values in QML. See \l{Extending types from QML} for the
+ list of types that can be used for \c property values.
\annotatedlist qmlbasictypes
*/
@@ -171,6 +171,13 @@
Rectangle { color: "#800000FF" }
\endqml
+ Or with the \l{Qt::rgba()}{Qt.rgba()}, \l{Qt::hsla()}{Qt.hsla()}, \l{Qt::darker()}{Qt.darker()},
+ \l{Qt::lighter()}{Qt.lighter()} or \l{Qt::tint()}{Qt.tint()} functions:
+
+ \qml
+ Rectangle { color: Qt.rgba(255, 0, 0, 1) }
+ \endqml
+
\sa {QML Basic Types}
*/
@@ -184,9 +191,17 @@
Example:
\qml
- Widget { pos: "0,20" }
+ MyItem { position: "0,20" }
\endqml
+ Or with the \l{Qt::point()}{Qt.point()} function:
+
+ \qml
+ MyItem { position: Qt.point(0, 20) }
+ \endqml
+
+ A point object has \c x and \c y attributes that contain the \c x and \c y values.
+
\sa {QML Basic Types}
*/
@@ -200,9 +215,17 @@
Example:
\qml
- Widget { size: "150x50" }
+ LayoutItem { preferredSize: "150x50" }
+ \endqml
+
+ Or with the \l{Qt::size()}{Qt.size()} function:
+
+ \qml
+ MyItem { position: Qt.size(150, 50) }
\endqml
+ A size object has \c width and \c height attributes that contain the \c width and \c height values.
+
\sa {QML Basic Types}
*/
@@ -216,9 +239,18 @@
Example:
\qml
- Widget { geometry: "50,50,100x100" }
+ MyItem { geometry: "50,50,100x100" }
\endqml
+ Or with the \l{Qt::rect()}{Qt.rect()} function:
+
+ \qml
+ MyItem { position: Qt.rect(50, 50, 100, 100) }
+ \endqml
+
+ A rect object has \c x, \c, y, \c width and \c height attributes that contain the
+ \c x, \c y, \c width and \c height values.
+
\sa {QML Basic Types}
*/
@@ -232,9 +264,12 @@
Example:
\qml
- DatePicker { minDate: "2000-01-01"; maxDate: "2020-12-31" }
+ MyDatePicker { minDate: "2000-01-01"; maxDate: "2020-12-31" }
\endqml
+ To read a date value returned from a C++ extension class, use
+ \l{Qt::formatDate()}{Qt.formatDate()} and \l{Qt::formatDateTime()}{Qt.formatDateTime()}.
+
\sa {QML Basic Types}
*/
@@ -248,9 +283,12 @@
Example:
\qml
- TimePicker { time: "14:22:15" }
+ MyTimePicker { time: "14:22:15" }
\endqml
+ To read a time value returned from a C++ extension class, use
+ \l{Qt::formatTime()}{Qt.formatTime()} and \l{Qt::formatDateTime()}{Qt.formatDateTime()}.
+
\sa {QML Basic Types}
*/
@@ -297,9 +335,9 @@
Actions are used like this:
\qml
- MouseArea { onClicked: MyItem.myaction.trigger() }
- State { name: "enabled"; when: MyItem.myaction.enabled == true }
- Text { text: MyItem.someaction.text }
+ MouseArea { onClicked: myaction.trigger() }
+ State { name: "enabled"; when: myaction.enabled == true }
+ Text { text: someaction.text }
\endqml
\sa {QML Basic Types}
@@ -327,7 +365,7 @@
]
}
\endqml
- \c Child1, \c Child2 and \c Child3 will all be added to the children list
+ \c child1, \c child2 and \c child3 will all be added to the children list
in the order in which they appear.
\sa {QML Basic Types}
@@ -345,7 +383,7 @@
Rotation { angle: 60; axis: "0,1,0" }
\endqml
- or with the \c{Qt.vector3d()} helper function:
+ or with the \c{Qt.vector3d()} function:
\qml
Rotation { angle: 60; axis: Qt.vector3d(0, 1, 0) }
@@ -357,5 +395,8 @@
Rotation { angle: 60; axis.x: 0; axis.y: 1; axis.z: 0 }
\endqml
+ A vector3d object has \c x, \c, y, and \c z attributes that contain the
+ \c x, \c y, \c z values.
+
\sa {QML Basic Types}
*/
diff --git a/doc/src/declarative/globalobject.qdoc b/doc/src/declarative/globalobject.qdoc
index 7d4f9b9..3121e95 100644
--- a/doc/src/declarative/globalobject.qdoc
+++ b/doc/src/declarative/globalobject.qdoc
@@ -49,7 +49,7 @@ Contains all the properties of the JavaScript global object, plus:
\section1 Qt Object
-The \l{qml-qt.html}{Qt object} provides useful enums and functions from Qt, for use in all QML
+The \l{Qt}{Qt object} provides useful enums and functions from Qt, for use in all QML
files.
\section1 XMLHttpRequest
diff --git a/doc/src/declarative/pics/repeater-modeldata.png b/doc/src/declarative/pics/repeater-modeldata.png
new file mode 100644
index 0000000..817f35b
--- /dev/null
+++ b/doc/src/declarative/pics/repeater-modeldata.png
Binary files differ
diff --git a/doc/src/declarative/qml-intro.qdoc b/doc/src/declarative/qml-intro.qdoc
index 64a4949..848e094 100644
--- a/doc/src/declarative/qml-intro.qdoc
+++ b/doc/src/declarative/qml-intro.qdoc
@@ -864,49 +864,49 @@ paused, and reaching the end of the media. They allow the developer to connect,
some QML that will handle this event.
-\section1 Analyzing An Example: Dial
+\section1 Analyzing An Example: Dial Control
-In the Qt \e {examples/declarative/toys} folder you will find a folder
-\e {dial} which contains the \e dial example.
+In the Qt \e {examples/declarative/ui-components} folder you will find a folder
+\e {dialcontrol} which contains the \e dialcontrol example.
\image qml-dial.png "QML Dial example with Slider"
In essence this small application has a sliding bar that you can slide using
a mouse, and a graphical dial that responds to the position of the slider.
-The code for the example is in two parts: Dial.qml and dial-example.qml.
+The code for the example is in two parts: Dial.qml and dialcontrol.qml.
-\e {Dial.qml} can be found in the \e content sub-directory. It defines a Dial
+\e {Dial.qml} can be found in the \e content sub-directory. It defines a \c Dial
component similar to an odometer. Eventually, the example will hook up a slider
component so that moving the slider will change the position of a needle on the
dial.
-The code for the Dial, identified by the name of the file, contains four images
+The code for the \c Dial, identified by the name of the file, contains four images
in overlapping order: the background (numbers and divisions), the shadow of the
needle, the needle itself, and finally the 'glass' overlay (containing
transparent layers).
-The needle_shadow.png image has a Rotation assigned to the \e transform
+The \c needle_shadow.png image has a \l Rotation assigned to the \e transform
attribute of the \l Image. The rotation is set to match the angle of the needle
image angle value \e {needleRotation.angle}. Both the needle and the
needle_shadow have the same default \e x and \e y values but the rotation origin
for the needle is slightly different so that a shadow will be evident as the
needle moves.
-\snippet ../../examples/declarative/toys/dial/content/Dial.qml needle_shadow
+\snippet ../../examples/declarative/ui-components/dialcontrol/content/Dial.qml needle_shadow
And the needle
-\snippet ../../examples/declarative/toys/dial/content/Dial.qml needle
+\snippet ../../examples/declarative/ui-components/dialcontrol/content/Dial.qml needle
The final image is the overlay which simply has a position defined.
-\snippet ../../examples/declarative/toys/dial/content/Dial.qml overlay
+\snippet ../../examples/declarative/ui-components/dialcontrol/content/Dial.qml overlay
-\e {dial-example.qml} in the \e {examples/declarative/toys/dial} directory is the
+\e {dialcontrol.qml} in the \e {examples/declarative/ui-components/dialcontrol} directory is the
main file of the example. It defines the visual environment that the Dial
will fit into. Because the \e Dial component and the images live in the \e
-content sub-directory we will have to import this into \e dial-example. So the
+content sub-directory we will have to import this into \e dialcontrol.qml. So the
start of the file looks like
\code
@@ -919,7 +919,7 @@ a gray color. Inside this rectangle is our component \e Dial and a \l Rectangle.
Inside the rectangle called 'container' is another rectangle with the
interesting name 'slider'.
-\snippet ../../examples/declarative/toys/dial/dial-example.qml 0
+\snippet ../../examples/declarative/ui-components/dialcontrol/dialcontrol.qml 0
The Dial component, named 'dial, is \e anchored to the center of the main
rectangle. The \c value attribute of 'dial' is set to a value based on the