source: trunk/doc/src/declarative/qml-intro.qdoc

/****************************************************************************
**
** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies).
** All rights reserved.
** Contact: Nokia Corporation ([email protected])
**
** This file is part of the documentation of the Qt Toolkit.
**
** $QT_BEGIN_LICENSE:FDL$
** Commercial Usage
** Licensees holding valid Qt Commercial licenses may use this file 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.
**
** GNU Free Documentation License
** Alternatively, this file may be used under the terms of the GNU Free
** Documentation License version 1.3 as published by the Free Software
** Foundation and appearing in the file included in the packaging of this
** file.
**
** If you have questions regarding the use of this file, please contact
** Nokia at [email protected].
** $QT_END_LICENSE$
**
****************************************************************************/



/*!
\page qml-intro.html
\title Intro to Qt Quick

\section1 Overview

QML is a high level, scripted language. Its commands, more correctly \e elements,
leverage the power and efficiency of the Qt libraries to make easy to use
commands that perform intuitive functions. Draw a rectangle, display an image at
a position and so on. Behind these elements are complex C++ libraries that
efficiently perform the action. As with any graphical application, always
consider that this ability to easily build graphically rich applications means
that some care may be needed to prevent performance problems.

The language also allows more flexibility of these commands by using
Javascript rather than C++ to add new layers of logic to your application.
Javascript is easier to learn than C++ and can be embedded into the QML
files or imported from a separate file.

\bold{In QML the types of various 'objects' are referred to as \l {QML
Elements}{elements}}.

An element usually has various \e properties that help define the element. For
example, if we created an element called Circle then the radius of the circle
would be a property.


\section1 A First Look

The basic syntax of an \l{QML Elements}{element} is

\qml
SomeElement {
    id: myObject
    ... some other things here ...
}
\endqml

Here we are defining a new object. We specify its 'type' first as SomeElement.
Then within matching braces { ... } we specify the various parts of our 
element.

The \c id is a unique identifier for the element, it must start with a lower
case letter and only contain letters, numbers and underscores. It is this
particular object's name. If this SomeElement \l {QML Elements}{element} was
a Rectangle instead and it was one of many then the \e optional unique id
would allow us to manipulate each element individually.

Each visual element is ultimately based on, or inherits from, an element
called \l Item. \l Item has certain properties and actions that may be
useful. The properties have default values so you need only specify the
ones you will need.

Take a simple element such as a \l Rectangle. It has an \c id, we will call
it \e myRectangle, it has a \c width and a \c height. Imagine that we
want a rectangle that is 500 pixels by 400 pixels in the x and y directions
(horizontal by vertical).