|
|
- Accueil Actualités IT Pro
- Conception Cycle de vie du logiciel
- Java Plateforme et langage Java
- .NET Microsoft Framework .NET
- Dév. Web Développement Web et Webmarketing
- EDI Environnements de Développement Intégré
- Langages Langages de programmation applicatifs
- SGBD Systèmes de Gestion de Bases de Données
- Office Bureautique pour l'entreprise
- Solutions d'entreprise Autres logiciels pour l'entreprise
- Applications Applications logicielles
- Systèmes Logiciels et matériels systèmes
              
QML Tutorial 1 - Basic TypesThis first program is a very simple "Hello world" example that introduces some basic QML concepts. The picture below is a screenshot of this program.
Here is the QML code for the application: import QtQuick 1.0 Rectangle { id: page width: 500; height: 200 color: "lightgray" Text { id: helloText text: "Hello world!" y: 30 anchors.horizontalCenter: page.horizontalCenter font.pointSize: 24; font.bold: true } } WalkthroughImportFirst, we need to import the types that we need for this example. Most QML files will import the built-in QML types (like Rectangle, Image, ...) that come with Qt, using: import QtQuick 1.0 Rectangle elementRectangle { id: page width: 500; height: 200 color: "lightgray" We declare a root element of type Rectangle. It is one of the basic building blocks you can use to create an application in QML. We give it an id to be able to refer to it later. In this case, we call it "page". We also set the width, height and color properties. The Rectangle element contains many other properties (such as x and y), but these are left at their default values. Text elementText { id: helloText text: "Hello world!" y: 30 anchors.horizontalCenter: page.horizontalCenter font.pointSize: 24; font.bold: true } We add a Text element as a child of the root Rectangle element that displays the text 'Hello world!'. The y property is used to position the text vertically at 30 pixels from the top of its parent. The anchors.horizontalCenter property refers to the horizontal center of an element. In this case, we specify that our text element should be horizontally centered in the page element (see Anchor-Based Layout). The font.pointSize and font.bold properties are related to fonts and use the dot notation. Viewing the exampleTo view what you have created, run the QML Viewer tool (located in the bin directory) with your filename as the first argument. For example, to run the provided completed Tutorial 1 example from the install location, you would type: bin/qmlviewer $QTDIR/examples/declarative/tutorials/helloworld/tutorial1.qml [Previous: QML Tutorial] [Next: QML Tutorial 2 - QML Components] © 2008-2011 Nokia Corporation and/or its subsidiaries. Nokia, Qt and their respective logos are trademarks of Nokia Corporation in Finland and/or other countries worldwide. All other trademarks are property of their respective owners. Privacy Policy Licensees holding valid Qt Commercial licenses may use this document in accordance with the Qt Commercial License Agreement provided with the Software or, alternatively, in accordance with the terms contained in a written agreement between you and Nokia. Alternatively, this document may be used under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. |
