English French [qt-devnet.developpez.com]

Qt Quick Tutorial: How to Follow Along

Required Software

The Quick Tutorial requires that Qt 4.7.0 and QtCreator 2.0 or newer have been installed. We can download Qt and QtCreator from here [qt.nokia.com]. We then follow the installation instructions [doc.qt.nokia.com].

Installing the Tutorial Sources

The sources of the tutorial are available for download here [gitorious.org]. Once the page opened, we right-click on the file qtdn-quick-tutorial.zip and select Save Link As… from the context menu. In the file-save dialog, we select the folder where to save the archive and click on “Save”.

We navigate to the folder containing the zip archive in a file browser and extract the zip archive. The extraction creates a directory QtDN_QuickTutorial, which contains a subdirectory for each module. These subdirectories contain all the files needed to run the examples of a module. We will refer to the folder QtDN_QuickTutorial as tutorial directory in text or $TUTORIAL_DIR in code.

Opening a Qt Quick Project in QtCreator

We load a Qt Quick project into QtCreator by selecting File | Open File or Project from the main menu or by pressing Ctrl+O. In the file-open dialog, we navigate to one of the subdirectories of the tutorial directory (for example, to BasicSteps). We select the QML project file ending in qmlproject (for example, BasicSteps.qmlproject) from the file list and click on the Open button. QtCreator loads the Qt Quick project.

For more detailed information about QtCreator see the official documentation [doc.trolltech.com].

Running Qt Quick Code

We normally run the QtQuick examples from QtCreator. Once we have loaded a QtQuick project in QtCreator, we run the QtQuick code by pressing Ctrl+R or by selecting Build | Run from the main menu. Both start the QML viewer (an executable called qmlviewer) and show the QML document that is currently shown in the editor window and has the keyboard focus (where the blinking cursor is).

Alternatively, we can view a QML document by running qmlviewer on the command line. The command

  1. $ qmlviewer BasicSteps_3.qml &

shows the QML document BasicSteps_3.qml in QML viewer.

Categories: