diff options
author | Martin Jones <martin.jones@nokia.com> | 2009-11-26 15:47:44 +1000 |
---|---|---|
committer | Martin Jones <martin.jones@nokia.com> | 2009-11-26 15:47:44 +1000 |
commit | bf8eb1f56fc2945e3d10e22e259fe80115c0c22f (patch) | |
tree | bce3a150c603bc2c35497c9932871c37df496dc7 | |
parent | 674fb96b9e0ba14765039dab21aa99032bd2e82f (diff) | |
parent | 33a6e1e08b0a542fc631f28ddc269cec2fec97ce (diff) | |
download | qt4-tools-bf8eb1f56fc2945e3d10e22e259fe80115c0c22f.tar.gz |
Merge branch 'kinetic-declarativeui' of git@scm.dev.nokia.troll.no:qt/kinetic into kinetic-declarativeui
-rw-r--r-- | doc/src/declarative/advtutorial.qdoc | 2 | ||||
-rw-r--r-- | doc/src/declarative/advtutorial4.qdoc | 4 | ||||
-rw-r--r-- | doc/src/declarative/anchor-layout.qdoc | 2 | ||||
-rw-r--r-- | doc/src/declarative/examples.qdoc | 26 | ||||
-rw-r--r-- | doc/src/declarative/qmlstates.qdoc | 17 | ||||
-rw-r--r-- | doc/src/declarative/qtdeclarative.qdoc | 17 |
6 files changed, 48 insertions, 20 deletions
diff --git a/doc/src/declarative/advtutorial.qdoc b/doc/src/declarative/advtutorial.qdoc index 60dc0e6c9d..1456eae971 100644 --- a/doc/src/declarative/advtutorial.qdoc +++ b/doc/src/declarative/advtutorial.qdoc @@ -47,7 +47,7 @@ This tutorial goes step-by-step through creating a full application using just Q It is assumed that you already know basic QML (such as from doing the simple tutorial) and the focus is on showing how to turn that knowledge into a complete and functioning application. -This tutorial involves a significant amount of javascript to implement the game logic. An understanding of javascript is helpful to understand the javascript parts of this tutorial, but if you don't understand javascript you can still get a feel for how to integrate QML elements with backend logic which creates and controls them. From the QML perspective, there is little difference between integrating with backend logic written in C++ and backend logic written in javascript. +This tutorial involves a significant amount of JavaScript to implement the game logic. An understanding of JavaScript is helpful to understand the JavaScript parts of this tutorial, but if you don't understand JavaScript you can still get a feel for how to integrate QML elements with backend logic which creates and controls them. From the QML perspective, there is little difference between integrating with backend logic written in C++ and backend logic written in JavaScript. In this tutorial we recreate, step by step, the Same Game demo in $QTDIR/demos/declarative/samegame.qml. The results of the individual steps are in the $QTDIR/examples/declarative/tutorials/samegame directory. diff --git a/doc/src/declarative/advtutorial4.qdoc b/doc/src/declarative/advtutorial4.qdoc index aaa7293dd3..96e72fc3ee 100644 --- a/doc/src/declarative/advtutorial4.qdoc +++ b/doc/src/declarative/advtutorial4.qdoc @@ -126,7 +126,7 @@ if they exit this dialog without entering it they have a way to opt out of posti \snippet declarative/tutorials/samegame/samegame4/content/samegame.js 2 -For offline storage, we use the HTML 5 offline storage javascript API to maintain a persistant SQL database unique to this application. This first line in this function calls the function for the web-based high scores, described later, if it has been setup. Next we create an offline storage database for the high scores using openDatabase and prepare the data and SQL query that we want to use to save it. The offline storage API uses SQL queries for data manipulation and retrival, and in the db.transaction call we use three SQL queries to initialize the database (if necessary), and then add to and retrieve high scores. To use the returned data, we turn it into a string with one line per row returned, and show a dialog containing that string. For a more detailed explanation of the offline storage API in QML, consult the global object documentation. +For offline storage, we use the HTML 5 offline storage JavaScript API to maintain a persistant SQL database unique to this application. This first line in this function calls the function for the web-based high scores, described later, if it has been setup. Next we create an offline storage database for the high scores using openDatabase and prepare the data and SQL query that we want to use to save it. The offline storage API uses SQL queries for data manipulation and retrival, and in the db.transaction call we use three SQL queries to initialize the database (if necessary), and then add to and retrieve high scores. To use the returned data, we turn it into a string with one line per row returned, and show a dialog containing that string. For a more detailed explanation of the offline storage API in QML, consult the global object documentation. This is one way of storing and displaying high scores locally, but not the only way. A more complex alternative would have been to create a high score dialog component, and pass the results to it for processing and display (instead of resusing the Dialog). This would allow a more themable dialog that could present the high scores better. If your QML is the UI for a C++ application, you could also have passed the score to a C++ function to store it locally in a variety of ways, including a simple format without SQL or in another SQL database. @@ -141,7 +141,7 @@ if the player entered their name we can send the data to the web service in the \snippet declarative/tutorials/samegame/samegame4/content/samegame.js 1 -This is the same \c XMLHttpRequest() as you'll find in browser javascript, and can be used in the same way to dynamically get XML +This is the same \c XMLHttpRequest() as you'll find in browser JavaScript, and can be used in the same way to dynamically get XML or QML from the web service to display the high scores. We don't worry about the response in this case, we just post the high score data to the web server. If it had returned a QML file (or a URL to a QML file) you could instantiate it in much the same way as you did the blocks. diff --git a/doc/src/declarative/anchor-layout.qdoc b/doc/src/declarative/anchor-layout.qdoc index 503b88128c..4766236a8e 100644 --- a/doc/src/declarative/anchor-layout.qdoc +++ b/doc/src/declarative/anchor-layout.qdoc @@ -44,7 +44,7 @@ \target anchor-layout \title Anchor-based Layout in QML -In addition to the more traditional \l Grid, \l Row, and \l Column, QML also provides a way to layout items using the concept of anchors. Each item can be thought of as having a set of 6 invisible "anchor lines": \e left, \e horizontalCenter, \e right, \e top, \e verticalCenter, and \e bottom. +In addition to the more traditional \l Grid, \l Row, and \l Column, QML also provides a way to layout items using the concept of \e anchors. Each item can be thought of as having a set of 6 invisible "anchor lines": \e left, \e horizontalCenter, \e right, \e top, \e verticalCenter, and \e bottom. \image edges_qml.png diff --git a/doc/src/declarative/examples.qdoc b/doc/src/declarative/examples.qdoc index 7950f66446..3288e1777c 100644 --- a/doc/src/declarative/examples.qdoc +++ b/doc/src/declarative/examples.qdoc @@ -43,33 +43,31 @@ \page qmlexamples.html \title QML Examples and Walkthroughs -\section1 Running Examples +\section1 Running Examples and Demos -A \l {qmlviewer}{viewer} application is included that allows you to quickly explore many of the -examples. It has some useful options, revealed by: +You can find many simple examples in the \c examples/declarative +sub-directory that show how to use various aspects of QML. In addition, the +\c demos/declarative sub-directory contains more sophisticated demos of large +applications. These demos are intended to show integrated functionality +rather than being instructive on specifice elements. + +To run the examples and demos, use the included \l {qmlviewer}{qmlviewer} +application. It has some useful options, revealed by: \code bin/qmlviewer -help \endcode -There are several illustrative QML examples available. From your build -directory, +For example, from your build directory, run: \code - bin/qmlviewer $QT_SOURCE_DIR/demos/declarative/flickr/flickr-desktop.qml + bin/qmlviewer $QTDIR/demos/declarative/flickr/flickr-desktop.qml \endcode or \code - bin/qmlviewer $QT_SOURCE_DIR/demos/declarative/samegame/samegame.qml + bin/qmlviewer $QTDIR/demos/declarative/samegame/samegame.qml \endcode -Many other simple examples can be found under the \c examples/declarative sub -directory. Some can be run directly using the viewer like those above, and -others require you to build and run an executable. More sophisticated demos of -large applications can be found under the \c demos/declarative sub directory. -These are intended to show more integrated functionality rather than to be -instructive on specific elements. - \section1 Examples These will be documented, and demonstrate how to achieve various things in QML. diff --git a/doc/src/declarative/qmlstates.qdoc b/doc/src/declarative/qmlstates.qdoc index 245a57fdaf..abf3c93c4c 100644 --- a/doc/src/declarative/qmlstates.qdoc +++ b/doc/src/declarative/qmlstates.qdoc @@ -29,7 +29,7 @@ In QML: \o A state can affect the properties of other objects, not just the object owning the state (and not just that object's children). \endlist -Here is an example of using states. In the default state \c myRect is positioned at 0,0. In the 'moved' state it is positioned at 50,50. Clicking within the mouse region changes the state from the default state to the 'moved' state. +Here is an example of using states. In the default state \c myRect is positioned at 0,0. In the 'moved' state it is positioned at 50,50. Clicking within the mouse region changes the state from the default state to the 'moved' state, thus moving the rectangle. \qml Item { @@ -60,7 +60,20 @@ Item { } \endqml -State changes can be animated using \l{state-transitions}{transitions}. +State changes can be animated using \l{state-transitions}{Transitions}. + +For example, adding this code to the above \c {Item {}} element animates the transition to the "moved" state: + +\qml + transitions: [ + Transition { + NumberAnimation { matchProperties: "x,y"; duration: 500 } + } + ] +\endqml + +See \l{state-transitions}{Transitions} for more information. + Other things you can do in a state change: \list diff --git a/doc/src/declarative/qtdeclarative.qdoc b/doc/src/declarative/qtdeclarative.qdoc index 5947429000..6a94b6ecfb 100644 --- a/doc/src/declarative/qtdeclarative.qdoc +++ b/doc/src/declarative/qtdeclarative.qdoc @@ -47,4 +47,21 @@ \brief The Qt Declarative module provides a declarative framework for building highly dynamic, custom user interfaces. +To include the definitions of the module's classes, use the +following directive: + +\code +#include <QtDeclarative> +\endcode + +To link against the module, add this line to your \l qmake \c +.pro file: + +\code +QT += declarative +\endcode + +For more information on the Qt Declarative module, see the +\l{declarativeui.html}{Declarative UI} documentation. + */ |