path: root/src/quick/doc/src/qmltypereference.qdoc

/****************************************************************************
**
** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
** Contact: http://www.qt-project.org/
**
** This file is part of the documentation of the Qt Toolkit.
**
** $QT_BEGIN_LICENSE:FDL$
** 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.
**
** Other Usage
** Alternatively, this file may be used in accordance with the terms
** and conditions contained in a signed written agreement between you
** and Nokia.
**
**
**
**
**
** $QT_END_LICENSE$
**
****************************************************************************/

/*!
\page qtquick-qmltypereference.html
\title QML Types Provided by Qt Quick
\brief Description of the QML types provided by the Qt Quick module

This page contains links to documentation for every QML type provided by the
\c QtQuick QML module, organized according to category and purpose.

\section1 Importing QtQuick

The types provided by the QtQuick module are only available in a QML document
if that document imports the \c QtQuick namespace.

The current version of the QtQuick module is version 2.0, and thus it may be
imported via the following statement:

\qml
import QtQuick 2.0
\endqml

See the \l{qtquick-main.html}{QtQuick} module documentation for more
information about the concepts which are central to \c QtQuick.

\section1 Basic Types

There are a number of basic types that are
\l{qtqml-typesystem-basictypes.html#basic-types-provided-by-the-qml-language}
{supported by default in the QML language}.

In addition, the QtQuick module provides the following basic types:
\annotatedlist qtquickbasictypes

\section1 Object Types

All of the object types provided by QtQuick are based on the \l{Item} type,
which itself derives from \l{QML::QtObject}.  QML object types provided by
the \l{qtqml-typereference-topic.html#object-types}{QtQml module}
(such as \l{QML::QtObject} and \l{QML::Component}) are also available when
you import QtQuick.

\section2 Visual Types

\list
\li \l {Item} - Basic visual object type inherited by visual object types (visual items)
\li \l {Rectangle} - A rectangle type
\li \l {Image} - For incorporating bitmaps into a scene
\li \l {BorderImage} - Allows the use of images as borders
\li \l {AnimatedImage} - For playing animations stored as an animated GIF
\li \l {AnimatedSprite} - For playing animations stored as a series of frames
\li \l {SpriteSequence} - For playing and transitioning between multiple animations stored as a series of frames
\li \l {Text} - For inserting formatted text into a scene
\li \l {Window} - Provides a top-level window
\endlist

Visual Item Utility
\list
\li \l {Accessible} - Attached property to make components accessible
\li \l {Gradient} - For defining a color gradient
\li \l {GradientStop} - Used to define a color within a \l {Gradient}
\li \l {SystemPalette} - Provides access to the Qt palettes
\li \l {Screen} - Provides information about the screen on which an \l {Item} is displayed
\li \l {Sprite} - Specifies sprite animations for other Items to display
\li \l {FontLoader} - Loads fonts by name or URL
\endlist

Visual Item Generation

\list
\li \l {Repeater} - Uses a model to create multiple Item instances
\li \l {Loader} - Eases on-demand loading of Items
\endlist

Visual Item Transformations
\list
\li \l {Transform} - Allows specification of advanced transformations on Items
\li \l {Scale} - Assigns item scaling behaviors
\li \l {Rotation} - Assigns item rotation behaviors
\li \l {Translate} - Assigns item translation behaviors
\endlist


\section2 User Input

\list
\li \l {MouseArea} - Sets up an area for mouse interaction
\li \l {Keys} - Provides components with attached properties to handle key input.
\li \l {KeyNavigation} - Supports key navigation by arrow keys
\li \l {FocusScope} - Mediates keyboard focus changes
\li \l {Flickable} - Provides a surface that can be "flicked"
\li \l {PinchArea} - Enables simple pinch gesture handling
\li \l {MultiPointTouchArea} - Enables handling of multiple touch points
\li \l {Drag} - For specifying drag and drop events for visual items
\li \l {DropArea} - For specifying drag and drop event handling in an area
\li \l {TextInput} - Captures user key input
\li \l {TextEdit} - Displays multiple lines of editable formatted text
\endlist

Text Input Utility

\list
\li \l {IntValidator} - Validates values as integers
\li \l {DoubleValidator} - Validates real values
\li \l {RegExpValidator} - Validator for string regular expressions
\endlist

User Input Events
\list
\li \l {TouchPoint} - Describes a touch point in a MultiPointTouchArea
\li \l {PinchEvent} - Specifies information about a pinch event
\li \l {WheelEvent} - Provides information about a mouse wheel event
\li \l {MouseEvent} - Provides information about a mouse click event
\li \l {KeyEvent} - Provides information about a key press event
\li \l {DragEvent} -Provides information about a drag event
\endlist

\section2 Positioning

\list
\li \l {Positioner} - Attached property which provides information about where an Item has been positioned
\li \l {Column} - Arranges its children vertically
\li \l {Row} - Arranges its children horizontally
\li \l {Grid} - Positions its children in a grid
\li \l {Flow} - Positions its children with wrapping support
\li \l {LayoutMirroring} - Attached property used to mirror layout behavior
\endlist

\section2 States, Transitions and Animations

States
\list
\li \l {State} - Defines sets of configurations of objects and properties
\li \l {PropertyChanges} - Describes property changes within a state
\li \l {StateGroup} - Contains a set of states and state transitions
\li \l {StateChangeScript} - Allows script binding in a state
\li \l {ParentChange} - Re-parent an Item in a state change
\li \l {AnchorChanges} - Change the anchors of an item in a state
\endlist

Transitions and Animations
\list
\li \l {Transition} - Animates transitions during state changes
\li \l {ViewTransition} - Specifies items under transition in a view
\li \l {SequentialAnimation} - Runs animations sequentially
\li \l {ParallelAnimation} - Runs animations in parallel
\li \l {Behavior} - Specifies a default animation for property changes
\li \l {PropertyAction} - Sets immediate property changes during animation
\li \l {PauseAnimation} - Introduces a pause in an animation
\li \l {SmoothedAnimation} - Allows a property to smoothly track a value
\li \l {SpringAnimation} - Allows a property to track a value in a spring-like motion
\li \l {ScriptAction} - Runs scripts during an animation
\endlist

Type-specific Animations
\list
\li \l {PropertyAnimation} - Animates property changes
\li \l {NumberAnimation} - Animates properties of type qreal
\li \l {Vector3dAnimation} - Animates properties of type QVector3d
\li \l {ColorAnimation} - Animates color changes
\li \l {RotationAnimation} - Animates rotations
\li \l {ParentAnimation} - Animates parent changes
\li \l {AnchorAnimation} - Animates anchor changes
\li \l {PathAnimation} - Animates position along a path
\endlist

Lower-level Animation Types
\list
\li \l {PathInterpolator} - Allows manual animation along a path
\li \l {AnimationController} - Allows manual control of animation progress
\endlist

Animation paths
\list
\li \l {Path} - Defines a path used by \l {PathView}
\li \l {PathLine} - Defines a line in \l {Path}
\li \l {PathQuad} - Defines a quadratic Bezier curve in a \l {Path}
\li \l {PathCubic} - Defines a cubic Bezier curve in a \l {Path}
\li \l {PathArc} - Defines an arc in a \l {Path}
\li \l {PathCurve} - Defines a point on a Catmull-Rom curve in a \l {Path}
\li \l {PathSvg} - Defines a sub-path specified as a SVG path data string in a \l {Path}
\li \l {PathAttribute} - Allows the setting of attributes along a \l {Path}
\li \l {PathPercent} - Modifies the item distribution along a \l {Path}
\endlist

\section2 Model/View Types And Data Storage And Access

Models And Model Data
\list
\li \l {QtQuick2::ListModel}{ListModel} - Defines a list of data
\li \l {QtQuick2::ListElement}{ListElement} - Defines a data item in a \l {QtQuick2::ListModel}{ListModel}
\li \l {VisualItemModel} - Contains items that already defines its own visual delegate
\li \l {VisualDataModel} - Encapsulates a model and a delegate
\li \l {VisualDataGroup} -Encapsulates a filtered set of visual data items
\li \l {XmlListModel} - Specifies a model using XPath expressions
\li \l {XmlRole} - Specifies a role for an \l {XmlListModel}
\endlist

Views
\list
\li \l {ListView} - Provides a list visualization of a model
\li \l {GridView} - Provides a grid visualization of a model
\li \l {PathView} - Visualizes a model's contents along a path. See \l {Path Definition}{Path Elements} for more information.
\li \l {Package} - Collection that enables sharing of items within different views
\endlist

Data Storage
\list
\li \l {QtQuick.LocalStorage 2} - Module API providing simplified SQL access
\endlist

\section2 Graphical Effects

\list
\li \l {Flipable} - Provides a surface that produces "flipping" effects
\li \l {ShaderEffect} - Allows GLSL shaders to be used as graphical effects
\li \l {ShaderEffectSource} - Usable as a texture in ShaderEffect
\li \l {GridMesh} - Generates a grid mesh of vertices for use by ShaderEffect
\li The \l{QtQuick.Particles 2} module provides a set of Particle System types for QtQuick 2
\endlist

\section2 Convenience Types

\list
\li \l {Connections} - Explicitly connects signals and signal handlers
\li \l {Binding} - Binds any value to any property
\li \l {Timer} - Provides timed triggers
\li \l {WorkerScript} - Enables the use of threads in a Qt Quick application
\endlist

\section2 Canvas (similar to HTML5 canvas)

\list
\li \l {Canvas} - Provides a 2D canvas type similar to the HTML5 canvas
\li \l {Context2D} - Provides 2D context for shapes on a Canvas item
\li \l {CanvasGradient} - Allows specification of a gradient on a Canvas
\li \l {CanvasPixelArray} - Allows specification of a pixel array for use in a Canvas
\li \l {CanvasImageData} - Allows specification of image data for use in a Canvas
\li \l {TextMetrics} - Provides text and font measurement data for use in a Canvas
\endlist

*/

/*!
    \qmlbasictype color
    \ingroup qtquickbasictypes
    \brief an ARGB color value.
    \target colorbasictypedocs

    The \c color type refers to an ARGB color value. It can be specified in a number of ways:

    \list
    \li By a \l{http://www.w3.org/TR/SVG/types.html#ColorKeywords}{SVG color name}, such as
        "red", "green" or "lightsteelblue".
    \li By a hexadecimal triplet or quad in the form \c "#RRGGBB" and \c "#AARRGGBB"
        respectively. For example, the color red corresponds to a triplet of \c "#FF0000"
        and a slightly transparent blue to a quad of \c "#800000FF".
    \li Using the \l{QML:Qt::rgba()}{Qt.rgba()}, \l{QML:Qt::hsla()}{Qt.hsla()},
        \l{QML:Qt::darker()}{Qt.darker()}, \l{QML:Qt::lighter()}{Qt.lighter()} or
        \l{QML:Qt::tint()}{Qt.tint()} functions.
    \endlist

    Example:

    \div{float-right}
    \inlineimage declarative-colors.png
    \enddiv
    \snippet qml/colors.qml colors

    Additionally, a color type has \c r, \c g, \c b and \c a properties that refer to the
    red, green, blue and alpha values of the color, respectively:

    \qml
    Text {
        color: "red"

        // prints "1 0 0 1"
        Component.onCompleted: console.log(color.r, color.g, color.b, color.a)
    }
    \endqml

    To test color values for equality, use the \l{QML:Qt::colorEqual()}{Qt.colorEqual()}
    function.  This allows colors to be accurately compared whether they are in property
    form or in any of the acceptable string specification forms.

    When integrating with C++, note that any QColor value
    \l{qtqml-cppintegration-data.html}{passed into QML from C++} is automatically
    converted into a \c color value, and vice-versa.

    This basic type is provided by the QtQuick import.

    \sa {QML Basic Types}
*/

/*!
    \qmlbasictype font
    \ingroup qtquickbasictypes
    \brief a font value with the properties of QFont.
    \target fontbasictypedocs

    The \c font type refers to a font value with the properties of QFont.

    The most commonly used properties are:

    \list
    \li \l string \c font.family
    \li \l bool \c font.bold
    \li \l bool \c font.italic
    \li \l bool \c font.underline
    \li \l real \c font.pointSize
    \li \l int \c font.pixelSize
    \endlist

    If both \c pointSize and a \c pixelSize are specified, \c pixelSize will be used.

    The following properties are also available:

    \list
    \li \l enumeration \c font.weight
    \li \l bool \c font.overline
    \li \l bool \c font.strikeout
    \li \l enumeration \c font.capitalization
    \li \l real \c font.letterSpacing
    \li \l real \c font.wordSpacing
    \endlist

    Example:
    \qml
    Text { font.family: "Helvetica"; font.pointSize: 13; font.bold: true }
    \endqml

    When integrating with C++, note that any QFont value
    \l{qtqml-cppintegration-data.html}{passed into QML from C++} is automatically
    converted into a \c font value, and vice-versa.

    This basic type is provided by the QtQuick import.

    Font weighting is classified on a scale from 0 to 99, where a weight of 0 is ultralight,
    and 99 is extremely black. The following values are supported:

    \table
    \row
        \li \c Font.Light
        \li 25
    \row
        \li \c Font.Normal
        \li 50
    \row
        \li \c Font.DemiBold
        \li 63
    \row
        \li \c Font.Bold
        \li 75
    \row
        \li \c Font.Black
        \li 87
    \endtable

    Capitalization supports the following values:

    \table
    \row
        \li \c Font.MixedCase
        \li No capitalization change is applied.
    \row
        \li \c Font.AllUppercase
        \li Alters the text to be rendered in all uppercase type.
    \row
        \li \c Font.AllLowercase
        \li Alters the text to be rendered in all lowercase type.
    \row
        \li \c Font.SmallCaps
        \li Alters the text to be rendered in small-caps type.
    \row
        \li \c Font.Capitalize
        \li Alters the text to be rendered with the first character of each word as an uppercase character.
    \endtable

    \sa {QML Basic Types}
*/

/*!
    \qmlbasictype vector2d
    \ingroup qtquickbasictypes

    \brief A vector2d type has x and y attributes.

    A \c vector2d type has \c x and \c y attributes, otherwise
    it is similar to the \c vector3d type.  Please see the
    documentation about the \c vector3d type for more information.

    To create a \c vector2d value, specify it as a "x,y" string,
    or define the components individually, or compose it with
    the Qt.vector2d() function.

    This basic type is provided by the QtQuick import.

    \sa {QML Basic Types}
*/

/*!
    \qmlbasictype vector3d
    \ingroup qtquickbasictypes
    \brief a value with x, y, and z attributes.

    The \c vector3d type refers to a value with \c x, \c y, and \c z attributes.

    To create a \c vector3d value, specify it as a "x,y,z" string:

    \qml
    Rotation { angle: 60; axis: "0,1,0" }
    \endqml

    or with the \l{QML:Qt::vector3d()}{Qt.vector3d()} function:

    \qml
    Rotation { angle: 60; axis: Qt.vector3d(0, 1, 0) }
    \endqml

    or as separate \c x, \c y, and \c z components:

    \qml
    Rotation { angle: 60; axis.x: 0; axis.y: 1; axis.z: 0 }
    \endqml

    When integrating with C++, note that any QVector3D value
    \l{qtqml-cppintegration-data.html}{passed into QML from C++} is automatically
    converted into a \c vector3d value, and vice-versa.

    This basic type is provided by the QtQuick import.

    \sa {QML Basic Types}
*/

/*!
    \qmlbasictype vector4d
    \ingroup qtquickbasictypes

    \brief A vector4d type has x, y, z and w attributes.

    A \c vector4d type has \c x, \c y, \c z and \c w attributes,
    otherwise it is similar to the \c vector3d type.  Please see the
    documentation about the \c vector3d type for more information.

    To create a \c vector4d value, specify it as a "x,y,z,w" string,
    or define the components individually, or compose it with
    the Qt.vector4d() function.

    This basic type is provided by the QtQuick import.

    \sa {QML Basic Types}
*/

/*!
    \qmlbasictype quaternion
    \ingroup qtquickbasictypes

    \brief A quaternion type has scalar, x, y, and z attributes.

    A \c quaternion type has \c scalar, \c x, \c y and \c z attributes,
    otherwise it is similar to the \c vector3d type.  Please see the
    documentation about the \c vector3d type for more information.

    To create a \c quaternion value, specify it as a "scalar,x,y,z" string,
    or define the components individually, or compose it with
    the Qt.quaternion() function.

    This basic type is provided by the QtQuick import.

    \sa {QML Basic Types}
*/

/*!
    \qmlbasictype matrix4x4
    \ingroup qtquickbasictypes

    \brief A matrix4x4 type is a 4-row and 4-column matrix

    A \c matrix4x4 type has sixteen values, but these values are
    largely opaque to QML.  Values of this type can be composed with
    the Qt.matrix4x4() function.

    This basic type is provided by the QtQuick import.

    \sa {QML Basic Types}
*/