diff options
Diffstat (limited to 'examples')
17 files changed, 420 insertions, 81 deletions
diff --git a/examples/quick/accessibility/doc/src/accessibility.qdoc b/examples/quick/accessibility/doc/src/accessibility.qdoc index 99d930d87b..cb3ba4ae14 100644 --- a/examples/quick/accessibility/doc/src/accessibility.qdoc +++ b/examples/quick/accessibility/doc/src/accessibility.qdoc @@ -28,13 +28,14 @@ \title QtQuick Examples - Accessibility \example quick/accessibility \brief This example has accessible buttons. + \ingroup qtquickexamples Elements in this example are augmented with meta-data for accessiblity systems. For example, the button identifies itself and its functionality to the accessibility system: - \snippet examples/quick/accessibility/content/Button.qml button + \snippet quick/accessibility/content/Button.qml button As do Text elements inside the example: - \snippet examples/quick/accessibility/accessibility.qml text + \snippet quick/accessibility/accessibility.qml text */ diff --git a/examples/quick/animation/doc/src/animation.qdoc b/examples/quick/animation/doc/src/animation.qdoc index a5aa3dbf7b..e8a7686560 100644 --- a/examples/quick/animation/doc/src/animation.qdoc +++ b/examples/quick/animation/doc/src/animation.qdoc @@ -30,42 +30,43 @@ \example quick/animation \brief This is a collection of QML Animation examples. \image qml-animations-example.png + \ingroup qtquickexamples This is a collection of small QML examples relating to animation. Each example is a small QML file emphasizing a particular element or feature. ColorAnimation demonstrates using a color animation to fade a sky from day to night. - \snippet examples/quick/animation/basics/color-animation.qml 0 + \snippet quick/animation/basics/color-animation.qml 0 PropertyAnimation demonstrates using a number animation to bounce a circle up and down. - \snippet examples/quick/animation/basics/property-animation.qml 0 + \snippet quick/animation/basics/property-animation.qml 0 Behaviors demonstrates using behaviors to animate moving a rectangle to whereever you click. - \snippet examples/quick/animation/behaviors/behavior-example.qml 0 + \snippet quick/animation/behaviors/behavior-example.qml 0 Wiggly Text demonstrates using more complex behaviors to animate and wiggle some text around as you drag it. It does this by assigning a complex binding to each letter: - \snippet examples/quick/animation/behaviors/wigglytext.qml 0 + \snippet quick/animation/behaviors/wigglytext.qml 0 Then, it uses behaviors to animate the movement on each letter: - \snippet examples/quick/animation/behaviors/wigglytext.qml 1 + \snippet quick/animation/behaviors/wigglytext.qml 1 Tv Tennis demonstrates using more complex behaviors to get paddles following a ball for an infinite game. Again a binding which depends on other values is applied to the position and a behavior provided the animation. - \snippet examples/quick/animation/behaviors/tvtennis.qml 0 + \snippet quick/animation/behaviors/tvtennis.qml 0 Easing Curves shows off all the easing curves available in Qt Quick animations. States demonstrates how the properties of an item can vary between states. It defines several states: - \snippet examples/quick/animation/states/states.qml 0 + \snippet quick/animation/states/states.qml 0 Note that there is also the implicit 'base state' from properties set directly on elements. Transitions takes the States example and animates the property changes by setting transitions: - \snippet examples/quick/animation/states/transitions.qml 0 + \snippet quick/animation/states/transitions.qml 0 PathAnimation animates an image along a beizer curve using a PathAnimation. - \snippet examples/quick/animation/pathanimation/pathanimation.qml 0 + \snippet quick/animation/pathanimation/pathanimation.qml 0 PathInterpolator animates an image along the same beizer curve, using a PathInterpolator instead. - \snippet examples/quick/animation/pathinterpolator/pathinterpolator.qml 0 + \snippet quick/animation/pathinterpolator/pathinterpolator.qml 0 */ diff --git a/examples/quick/canvas/doc/src/canvas.qdoc b/examples/quick/canvas/doc/src/canvas.qdoc index 33ae83ef27..e756106823 100644 --- a/examples/quick/canvas/doc/src/canvas.qdoc +++ b/examples/quick/canvas/doc/src/canvas.qdoc @@ -30,17 +30,18 @@ \example quick/canvas \brief This is a collection of QML Canvas examples. \image qml-canvas-example.png + \ingroup qtquickexamples This is a collection of small QML examples relating to Canvas item. Each example is a small QML file emphasizing a particular element or feature. Red heart demonstrates using a bezierCurve API to stroke and fill a red heart. - \snippet examples/quick/canvas/bezierCurve/bezierCurve.qml 0 + \snippet quick/canvas/bezierCurve/bezierCurve.qml 0 Talk bubble demonstrates using a quadraticCurveTo API to stroke and fill a customized talk bubble: - \snippet examples/quick/canvas/quadraticCurveTo/quadraticCurveTo.qml 0 + \snippet quick/canvas/quadraticCurveTo/quadraticCurveTo.qml 0 This example also demonstrates the fillText API: - \snippet examples/quick/canvas/quadraticCurveTo/quadraticCurveTo.qml 1 + \snippet quick/canvas/quadraticCurveTo/quadraticCurveTo.qml 1 Squircle demonstrates using a collection of simple moveTo/lineTo path APIs to draw a smooth squircle. @@ -49,10 +50,10 @@ Smile face demonstrates using several complex path APIs to draw an fill a smile face. Clip demonstrates using clip API to clip a given image. - \snippet examples/quick/canvas/clip/clip.qml 0 + \snippet quick/canvas/clip/clip.qml 0 Tiger demonstrates using SVG path API to draw a tiger with a collection of SVG path strings. - \snippet examples/quick/canvas/tiger/tiger.qml 0 + \snippet quick/canvas/tiger/tiger.qml 0 */ diff --git a/examples/quick/doc/src/qml-extending.qdoc b/examples/quick/doc/src/qml-extending.qdoc new file mode 100644 index 0000000000..c2d22f18f9 --- /dev/null +++ b/examples/quick/doc/src/qml-extending.qdoc @@ -0,0 +1,322 @@ +/**************************************************************************** +** +** Copyright (C) 2012 Digia Plc and/or its subsidiary(-ies). +** Contact: http://www.qt-project.org/legal +** +** This file is part of the documentation of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:FDL$ +** Commercial License Usage +** Licensees holding valid commercial Qt licenses may use this file in +** accordance with the commercial license agreement provided with the +** Software or, alternatively, in accordance with the terms contained in +** a written agreement between you and Digia. For licensing terms and +** conditions see http://qt.digia.com/licensing. For further information +** use the contact form at http://qt.digia.com/contact-us. +** +** GNU Free Documentation License Usage +** 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. Please review the following information to ensure +** the GNU Free Documentation License version 1.3 requirements +** will be met: http://www.gnu.org/copyleft/fdl.html. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +/*! +\example qml/referenceexamples/adding +\title Extending QML - Adding Types Example +\brief Exporting C++ Classes +\ingroup qmlextendingexamples + +The Adding Types Example shows how to add a new element type, \c Person, to QML. +The \c Person type can be used from QML like this: + +\snippet qml/referenceexamples/adding/example.qml 0 + +\section1 Declare the Person class + +All QML elements map to C++ types. Here we declare a basic C++ Person class +with the two properties we want accessible on the QML type - name and shoeSize. +Although in this example we use the same name for the C++ class as the QML +element, the C++ class can be named differently, or appear in a namespace. + +\snippet qml/referenceexamples/adding/person.h 0 + +\section1 Define the Person class + +\snippet qml/referenceexamples/adding/person.cpp 0 + +The Person class implementation is quite basic. The property accessors simply +return members of the object instance. + +The \c main.cpp file also calls the \c qmlRegisterType() function to +register the \c Person type with QML as a type in the People library version 1.0, +and defines the mapping between the C++ and QML class names. + +\section1 Running the example + +The main.cpp file in the example includes a simple shell application that +loads and runs the QML snippet shown at the beginning of this page. +*/ + +/*! +\example qml/referenceexamples/properties +\title Extending QML - Object and List Property Types Example +\brief Exporting C++ Properties +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Adding Types Example} +\endlist + +The Object and List Property Types example shows how to add object and list +properties in QML. This example adds a BirthdayParty element that specifies +a birthday party, consisting of a celebrant and a list of guests. People are +specified using the People QML type built in the previous example. + +\snippet qml/referenceexamples/properties/example.qml 0 + +\section1 Declare the BirthdayParty + +The BirthdayParty class is declared like this: + +\snippet qml/referenceexamples/properties/birthdayparty.h 0 +\snippet qml/referenceexamples/properties/birthdayparty.h 1 +\snippet qml/referenceexamples/properties/birthdayparty.h 2 +\snippet qml/referenceexamples/properties/birthdayparty.h 3 + +The class contains a member to store the celebrant object, and also a +QList<Person *> member. + +In QML, the type of a list properties - and the guests property is a list of +people - are all of type QDeclarativeListProperty<T>. QDeclarativeListProperty is simple value +type that contains a set of function pointers. QML calls these function +pointers whenever it needs to read from, write to or otherwise interact with +the list. In addition to concrete lists like the people list used in this +example, the use of QDeclarativeListProperty allows for "virtual lists" and other advanced +scenarios. + +\section2 Define the BirthdayParty + +The implementation of BirthdayParty property accessors is straight forward. + +\snippet qml/referenceexamples/properties/birthdayparty.cpp 0 + +\section1 Running the example + +The main.cpp file in the example includes a simple shell application that +loads and runs the QML snippet shown at the beginning of this page. +*/ + +/*! +\example qml/referenceexamples/coercion +\title Extending QML - Inheritance and Coercion Example +\brief C++ Inheritance and Coercion +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Object and List Property Types Example} +\li \l {Extending QML - Adding Types Example} +\endlist + +The Inheritance and Coercion Example shows how to use base classes to assign +elements of more than one type to a property. It specializes the Person element +developed in the previous examples into two elements - a \c Boy and a \c Girl. + +\snippet qml/referenceexamples/coercion/example.qml 0 + +\section1 Declare Boy and Girl + +\snippet qml/referenceexamples/coercion/person.h 0 + +The Person class remains unaltered in this example and the Boy and Girl C++ +classes are trivial extensions of it. As an example, the inheritance used here +is a little contrived, but in real applications it is likely that the two +extensions would add additional properties or modify the Person classes +behavior. + +\section2 Define People as a base class + +The implementation of the People class itself has not changed since the the +previous example. However, as we have repurposed the People class as a common +base for Boy and Girl, we want to prevent it from being instantiated from QML +directly - an explicit Boy or Girl should be instantiated instead. + +\snippet qml/referenceexamples/coercion/main.cpp 0 + +While we want to disallow instantiating Person from within QML, it still needs +to be registered with the QML engine, so that it can be used as a property type +and other types can be coerced to it. + +\section2 Define Boy and Girl + +The implementation of Boy and Girl are trivial. + +\snippet qml/referenceexamples/coercion/person.cpp 1 + +All that is necessary is to implement the constructor, and to register the types +and their QML name with the QML engine. + +\section1 Running the example + +The BirthdayParty element has not changed since the previous example. The +celebrant and guests property still use the People type. + +\snippet qml/referenceexamples/coercion/birthdayparty.h 0 + +However, as all three types, Person, Boy and Girl, have been registered with the +QML system, on assignment QML automatically (and type-safely) converts the Boy +and Girl objects into a Person. + +The main.cpp file in the example includes a simple shell application that +loads and runs the QML snippet shown at the beginning of this page. +*/ + +/*! +\example qml/referenceexamples/default +\title Extending QML - Default Property Example +\brief Default Property +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Inheritance and Coercion Example} +\li \l {Extending QML - Object and List Property Types Example} +\li \l {Extending QML - Adding Types Example} +\endlist + +The Default Property Example is a minor modification of the +\l {Extending QML - Inheritance and Coercion Example} that simplifies the +specification of a BirthdayParty through the use of a default property. + +\snippet qml/referenceexamples/default/example.qml 0 + +\section1 Declaring the BirthdayParty class + +The only difference between this example and the last, is the addition of the +\c DefaultProperty class info annotation. + +\snippet qml/referenceexamples/default/birthdayparty.h 0 + +The default property specifies the property to assign to whenever an explicit +property is not specified, in the case of the BirthdayParty element the guest +property. It is purely a syntactic simplification, the behavior is identical +to specifying the property by name, but it can add a more natural feel in many +situations. The default property must be either an object or list property. + +\section1 Running the example + +The main.cpp file in the example includes a simple shell application that +loads and runs the QML snippet shown at the beginning of this page. +*/ + +/*! +\example qml/referenceexamples/grouped +\title Extending QML - Grouped Properties Example +\brief Grouped Properties +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Default Property Example} +\li \l {Extending QML - Inheritance and Coercion Example} +\li \l {Extending QML - Object and List Property Types Example} +\li \l {Extending QML - Adding Types Example} +\endlist + +*/ + +/*! +\example qml/referenceexamples/attached +\title Extending QML - Attached Properties Example +\brief Attached Properties +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Grouped Properties Example} +\li \l {Extending QML - Default Property Example} +\li \l {Extending QML - Inheritance and Coercion Example} +\li \l {Extending QML - Object and List Property Types Example} +\li \l {Extending QML - Adding Types Example} +\endlist + +*/ + +/*! +\example qml/referenceexamples/signal +\title Extending QML - Signal Support Example +\brief Signal Support +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Attached Properties Example} +\li \l {Extending QML - Grouped Properties Example} +\li \l {Extending QML - Default Property Example} +\li \l {Extending QML - Inheritance and Coercion Example} +\li \l {Extending QML - Object and List Property Types Example} +\li \l {Extending QML - Adding Types Example} +\endlist + +*/ + +/*! +\example qml/referenceexamples/methods +\title Extending QML - Methods Example +\brief Methods Support +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Default Property Example} +\li \l {Extending QML - Inheritance and Coercion Example} +\li \l {Extending QML - Object and List Property Types Example} +\li \l {Extending QML - Adding Types Example} +\endlist + +*/ + +/*! +\example qml/referenceexamples/valuesource +\title Extending QML - Property Value Source Example +\brief Property Value Source +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Signal Support Example} +\li \l {Extending QML - Attached Properties Example} +\li \l {Extending QML - Grouped Properties Example} +\li \l {Extending QML - Default Property Example} +\li \l {Extending QML - Inheritance and Coercion Example} +\li \l {Extending QML - Object and List Property Types Example} +\li \l {Extending QML - Adding Types Example} +\endlist + +*/ + +/*! +\example qml/referenceexamples/binding +\title Extending QML - Binding Example +\brief Binding +\ingroup qmlextendingexamples + +This example builds on: +\list +\li \l {Extending QML - Property Value Source Example} +\li \l {Extending QML - Signal Support Example} +\li \l {Extending QML - Attached Properties Example} +\li \l {Extending QML - Grouped Properties Example} +\li \l {Extending QML - Default Property Example} +\li \l {Extending QML - Inheritance and Coercion Example} +\li \l {Extending QML - Object and List Property Types Example} +\li \l {Extending QML - Adding Types Example} +\endlist + +*/ diff --git a/examples/quick/draganddrop/doc/src/draganddrop.qdoc b/examples/quick/draganddrop/doc/src/draganddrop.qdoc index f9008184df..d2180f6cee 100644 --- a/examples/quick/draganddrop/doc/src/draganddrop.qdoc +++ b/examples/quick/draganddrop/doc/src/draganddrop.qdoc @@ -29,6 +29,7 @@ \example quick/draganddrop \brief This is a collection of QML drag and drop examples \image qml-draganddrop-example.png + \ingroup qtquickexamples This is a collection of small QML examples relating to drag and drop functionality. @@ -36,12 +37,12 @@ It has a DragTile component which uses a MouseArea to move an item when dragged: - \snippet examples/quick/draganddrop/tiles/DragTile.qml 0 - \snippet examples/quick/draganddrop/tiles/DragTile.qml 1 + \snippet quick/draganddrop/tiles/DragTile.qml 0 + \snippet quick/draganddrop/tiles/DragTile.qml 1 And a DropTile component which the dragged tiles can be dropped onto: - \snippet examples/quick/draganddrop/tiles/DropTile.qml 0 + \snippet quick/draganddrop/tiles/DropTile.qml 0 The keys property of the DropArea will only allow an item with matching key in it's Drag.keys property to be dropped on it. @@ -51,7 +52,7 @@ It uses a VisualDataModel to move a delegate item to the position of another item it is dragged over. - \snippet examples/quick/draganddrop/views/gridview.qml 0 - \snippet examples/quick/draganddrop/views/gridview.qml 1 + \snippet quick/draganddrop/views/gridview.qml 0 + \snippet quick/draganddrop/views/gridview.qml 1 */ diff --git a/examples/quick/imageelements/doc/src/imageelements.qdoc b/examples/quick/imageelements/doc/src/imageelements.qdoc index d4f422f63b..da02a23fbc 100644 --- a/examples/quick/imageelements/doc/src/imageelements.qdoc +++ b/examples/quick/imageelements/doc/src/imageelements.qdoc @@ -27,8 +27,9 @@ /*! \title QML Examples - Image Elements \example quick/imageelements - \brief This is a collection of QML examples + \brief This is a collection of QML examples relating to image elements. \image qml-imageelements-example.png + \ingroup qtquickexamples This is a collection of small QML examples relating to image elements. @@ -39,21 +40,21 @@ 'Shadows' shows how to create a drop shadow effect for a rectangular item using a BorderImage: - \snippet examples/quick/imageelements/content/ShadowRectangle.qml delegate + \snippet quick/imageelements/content/ShadowRectangle.qml delegate 'AnimatedSprite' shows how to display a simple animation using an AnimatedSprite element: - \snippet examples/quick/imageelements/animatedsprite.qml sprite + \snippet quick/imageelements/animatedsprite.qml sprite The sprite animation will loop 3 times. 'SpriteSequence' demonstrates using a sprite sequence to draw an animated and interactive bear. The SpriteSequence defines 5 different sprites. The bear is initially in a 'still' state: - \snippet examples/quick/imageelements/spritesequence.qml still + \snippet quick/imageelements/spritesequence.qml still When the scene is clicked, an animation sets the sprite sequence to the 'falling' states and animates the bear's y property. - \snippet examples/quick/imageelements/spritesequence.qml animation + \snippet quick/imageelements/spritesequence.qml animation At the end of the animation the bear is set back to its initial state. */ diff --git a/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc b/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc index 28d2dd5a4b..697a0af0fe 100644 --- a/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc +++ b/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc @@ -29,6 +29,7 @@ \example quick/keyinteraction \brief This is a collection of QML keyboard interaction examples. \image qml-keyinteraction-example.png + \ingroup qtquickexamples This example demonstrates combining various methods of interacting with keyboard focus. */ diff --git a/examples/quick/modelviews/doc/src/modelviews.qdoc b/examples/quick/modelviews/doc/src/modelviews.qdoc index d365477a8b..8743b45643 100644 --- a/examples/quick/modelviews/doc/src/modelviews.qdoc +++ b/examples/quick/modelviews/doc/src/modelviews.qdoc @@ -28,55 +28,56 @@ /*! \title QtQuick Examples - ModelViews \example quick/modelviews - \brief This is a collection of QML drag and drop examples + \brief This is a collection of QML model/view examples \image qml-modelviews-example.png + \ingroup qtquickexamples This is a collection of small QML examples relating to model and view functionality. \section2 GridView and PathView demonstrate usage of these elements to display views. - \snippet examples/quick/modelviews/gridview/gridview-example.qml 0 + \snippet quick/modelviews/gridview/gridview-example.qml 0 \section2 Dynamic List demonstrates animation of runtime additions and removals to a ListView. The ListView.onAdd signal handler runs an animation when new items are added to the view, and the ListView.onRemove another when they are removed. - \snippet examples/quick/modelviews/listview/dynamiclist.qml 0 - \snippet examples/quick/modelviews/listview/dynamiclist.qml 1 + \snippet quick/modelviews/listview/dynamiclist.qml 0 + \snippet quick/modelviews/listview/dynamiclist.qml 1 \section2 Expanding Delegates demonstrates delegates that expand when activated. It has a complex delegate the size and appearance of which can change, displacing other items in the view. - \snippet examples/quick/modelviews/listview/expandingdelegates.qml 0 - \snippet examples/quick/modelviews/listview/expandingdelegates.qml 1 - \snippet examples/quick/modelviews/listview/expandingdelegates.qml 2 - \snippet examples/quick/modelviews/listview/expandingdelegates.qml 3 + \snippet quick/modelviews/listview/expandingdelegates.qml 0 + \snippet quick/modelviews/listview/expandingdelegates.qml 1 + \snippet quick/modelviews/listview/expandingdelegates.qml 2 + \snippet quick/modelviews/listview/expandingdelegates.qml 3 \section2 Highlight demonstrates adding a custom highlight to a ListView. \snippet examples/quick/modelviews/listview/highlight.qml 0 \section2 Highlight Ranges shows the three different highlight range modes of ListView. - \snippet examples/quick/modelviews/listview/highlightranges.qml 0 - \snippet examples/quick/modelviews/listview/highlightranges.qml 1 - \snippet examples/quick/modelviews/listview/highlightranges.qml 2 + \snippet quick/modelviews/listview/highlightranges.qml 0 + \snippet quick/modelviews/listview/highlightranges.qml 1 + \snippet quick/modelviews/listview/highlightranges.qml 2 \section2 Sections demonstrates the various section headers and footers available to ListView. - \snippet examples/quick/modelviews/listview/sections.qml 0 + \snippet quick/modelviews/listview/sections.qml 0 \section2 Packages demonstrates using Packages to transition delegates between two views. It has a Package which defines delegate items for each view and an item that can be transferred between delegates. - \snippet examples/quick/modelviews/package/Delegate.qml 0 + \snippet quick/modelviews/package/Delegate.qml 0 A VisualDataModel allows the individual views to access their specific items from the shared package delegate. - \snippet examples/quick/modelviews/package/view.qml 0 + \snippet quick/modelviews/package/view.qml 0 \section2 VisualItemModel uses a VisualItemModel for the model instead of a ListModel. - \snippet examples/quick/modelviews/visualitemmodel/visualitemmodel.qml 0 + \snippet quick/modelviews/visualitemmodel/visualitemmodel.qml 0 */ diff --git a/examples/quick/mousearea/doc/src/mousearea.qdoc b/examples/quick/mousearea/doc/src/mousearea.qdoc index 0a382cd93a..de9f600b94 100644 --- a/examples/quick/mousearea/doc/src/mousearea.qdoc +++ b/examples/quick/mousearea/doc/src/mousearea.qdoc @@ -27,8 +27,9 @@ /*! \title QtQuick Examples - MouseArea \example quick/mousearea - \brief This is a collection of QML Animation examples. + \brief This is an example of the MouseArea element in QML \image qml-mousearea-example.png + \ingroup qtquickexamples This example shows you how to respond to clicks and drags with a MouseArea. @@ -36,11 +37,11 @@ of that click which are available to QML. Signals are emitted by the MouseArea when clicks or other discrete operations occur within it - \snippet examples/quick/mousearea/mousearea.qml clicks + \snippet quick/mousearea/mousearea.qml clicks The MouseArea can also be used to drag elements around. By setting the parameters of the drag property, the target item will be dragged around if the user starts to drag within the MouseArea. - \snippet examples/quick/mousearea/mousearea.qml drag + \snippet quick/mousearea/mousearea.qml drag */ diff --git a/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc b/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc index 910072aee4..3cc0444c4e 100644 --- a/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc +++ b/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc @@ -28,7 +28,9 @@ /*! \title Scenegraph Painted Item Example + \brief Shows how to implement QPainter-based custom scenegraph items \example quick/painteditem/textballoons + \ingroup qtquickexamples The Painted Item example shows how to use the QML Scene Graph framework to implement custom scenegraph items using QPainter. @@ -56,7 +58,7 @@ is the base class for all QPainter based items in the QML Scene Graph framework. - \snippet examples/quick/painteditem/textballoons/textballoon.h 0 + \snippet quick/customitems/painteditem/textballoon.h 0 To implement a QQuickPaintedItem you must implement QQuickPaintedIem's pure virtual function \l {QQuickPaintedItem::}{paint()} which implements the @@ -67,13 +69,13 @@ We have to be sure to initialize the rightAligned property for a TextBalloon item. - \snippet examples/quick/painteditem/textballoons/textballoon.cpp 0 + \snippet quick/customitems/painteditem/textballoon.cpp 0 Then we implement the \c paint() function which is automatically called by the Scenegraph framework to paint the contents of the item. The function paints the item in local coordinates. - \snippet examples/quick/painteditem/textballoons/textballoon.cpp 1 + \snippet quick/customitems/painteditem/textballoon.cpp 1 We start with setting the pen and brush on the item to define the look of the item. After that we start drawing. Note that the \l {QQuickPaintedItem::}{boundingRect()} @@ -88,7 +90,7 @@ \section2 BalloonView - \snippet examples/quick/painteditem/textballoons/textballoons.qml 0 + \snippet quick/customitems/painteditem/textballoons.qml 0 The balloonModel contains two elements at application start which will be displayed by the balloonView. The balloonView alernates the TextBalloon @@ -96,7 +98,7 @@ \section2 Controls - \snippet examples/quick/painteditem/textballoons/textballoons.qml 1 + \snippet quick/customitems/painteditem/textballoons.qml 1 The controls part of the UI contains a rectangle with a MouseArea which changes color when the mouse hovers over it. This control 'button' adds diff --git a/examples/quick/positioners/doc/src/positioners.qdoc b/examples/quick/positioners/doc/src/positioners.qdoc index cd853d63e7..66cd6d9ee7 100644 --- a/examples/quick/positioners/doc/src/positioners.qdoc +++ b/examples/quick/positioners/doc/src/positioners.qdoc @@ -29,6 +29,7 @@ \example quick/positioners \brief This is a collection of QML Positioner examples. \image qml-positioners-example.png + \ingroup qtquickexamples This is a collection of small QML examples relating to positioners. Each example is a small QML file emphasizing a particular element or feature. @@ -37,16 +38,16 @@ It consists of a scene populated with items in a variety of positioners: Column, Row, Grid and Flow. Each positioner has animations described as Transitions. - \snippet examples/quick/positioners/positioners-transitions.qml move + \snippet quick/positioners/positioners-transitions.qml move The move transition specifies how items inside a positioner will animate when they are displaced by the appearance or disappearance of other items. - \snippet examples/quick/positioners/positioners-transitions.qml add + \snippet quick/positioners/positioners-transitions.qml add The add transition specifies how items will appear when they are added to a positioner. - \snippet examples/quick/positioners/positioners-transitions.qml populate + \snippet quick/positioners/positioners-transitions.qml populate The populate transition specifies how items will appear when their parent positioner is first created. Attached Properties shows how the Positioner attached property can be used to determine where an item is within a positioner. - \snippet examples/quick/positioners/positioners-attachedproperties.qml 0 + \snippet quick/positioners/positioners-attachedproperties.qml 0 */ diff --git a/examples/quick/righttoleft/doc/src/righttoleft.qdoc b/examples/quick/righttoleft/doc/src/righttoleft.qdoc index 04ac97fef9..f0b84f6f93 100644 --- a/examples/quick/righttoleft/doc/src/righttoleft.qdoc +++ b/examples/quick/righttoleft/doc/src/righttoleft.qdoc @@ -29,6 +29,7 @@ \example quick/righttoleft \brief This is a collection of QML Right to Left examples. \image qml-righttoleft-example.png + \ingroup qtquickexamples This is a collection of small QML examples relating to right to left(RTL) localization support. diff --git a/examples/quick/shadereffects/doc/src/shadereffects.qdoc b/examples/quick/shadereffects/doc/src/shadereffects.qdoc index f234e29a62..9755cb4a35 100644 --- a/examples/quick/shadereffects/doc/src/shadereffects.qdoc +++ b/examples/quick/shadereffects/doc/src/shadereffects.qdoc @@ -29,23 +29,24 @@ \example quick/shadereffects \image qml-shadereffects-example.png \brief This is a shader effects example + \ingroup qtquickexamples This example demonstrates a couple of visual effects that you can perform with shaders in QtQuick 2.0 ShaderEffects typically operate on other elements, using a ShaderEffectSource - \snippet examples/quick/shadereffects/shadereffects.qml source + \snippet quick/shadereffects/shadereffects.qml source In the above snippet, theItem is the id of a complex QML element in the file. ShaderEffects can use this ShaderEffectSource as a texture in their fragment shader. - \snippet examples/quick/shadereffects/shadereffects.qml fragment + \snippet quick/shadereffects/shadereffects.qml fragment You can use any custom property on the ShaderEffect in your shader. This makes animated shader code very easy. - \snippet examples/quick/shadereffects/shadereffects.qml properties + \snippet quick/shadereffects/shadereffects.qml properties ShaderEffects can also have a custom vertext shader. Setting the mesh property on ShaderEffect provides more vertices for you to manipulate, enabling many effects. - \snippet examples/quick/shadereffects/shadereffects.qml vertex + \snippet quick/shadereffects/shadereffects.qml vertex */ diff --git a/examples/quick/text/doc/src/text.qdoc b/examples/quick/text/doc/src/text.qdoc index 470db14d15..9776883ef1 100644 --- a/examples/quick/text/doc/src/text.qdoc +++ b/examples/quick/text/doc/src/text.qdoc @@ -27,8 +27,9 @@ /*! \title QML Examples - Text \example quick/text - \brief This is a collection of QML examples + \brief This is a collection of QML examples relating to text \image qml-text-example.png + \ingroup qtquickexamples This is a collection of small QML examples relating to text. Each example is a small QML file, usually containing or emphasizing a particular element or @@ -37,24 +38,24 @@ 'Hello' shows how to change and animate the letter spacing of a Text element. It uses a sequential animation to first animate the font.letterSpacing property from 0 to 50 over 3 seconds and then move the text to a random position on screen: - \snippet examples/quick/text/fonts/hello.qml letterspacing + \snippet quick/text/fonts/hello.qml letterspacing 'Fonts' shows different ways of using fonts with the Text element. Simply by name, using the font.family property directly: - \snippet examples/quick/text/fonts/fonts.qml name + \snippet quick/text/fonts/fonts.qml name or using a FontLoader element: - \snippet examples/quick/text/fonts/fonts.qml fontloader + \snippet quick/text/fonts/fonts.qml fontloader or using a FontLoader and specifying a local font file: - \snippet examples/quick/text/fonts/fonts.qml fontloaderlocal + \snippet quick/text/fonts/fonts.qml fontloaderlocal or finally using a FontLoader and specifying a remote font file: - \snippet examples/quick/text/fonts/fonts.qml fontloaderremote + \snippet quick/text/fonts/fonts.qml fontloaderremote 'Available Fonts' shows how to use the QML global Qt object and a list view to display all the fonts available on the system. The ListView element uses the list of fonts available as its model: - \snippet examples/quick/text/fonts/availableFonts.qml model + \snippet quick/text/fonts/availableFonts.qml model Inside the delegate, the font family is set with the modelData: - \snippet examples/quick/text/fonts/availableFonts.qml delegate + \snippet quick/text/fonts/availableFonts.qml delegate 'Banner' is a simple example showing how to create a banner using a row of text elements and a NumberAnimation. @@ -65,5 +66,5 @@ 'Text Layout' shows how to create a more complex layout for a text element. This example lays out the text in two columns using the onLineLaidOut handler that allows you to position and resize each line: - \snippet examples/quick/text/styledtext-layout.qml layout + \snippet quick/text/styledtext-layout.qml layout */ diff --git a/examples/quick/threading/doc/src/threading.qdoc b/examples/quick/threading/doc/src/threading.qdoc index 1756d9e1bd..7328a91612 100644 --- a/examples/quick/threading/doc/src/threading.qdoc +++ b/examples/quick/threading/doc/src/threading.qdoc @@ -29,6 +29,7 @@ \example quick/threading \brief This is a collection of QML Multithreading examples. \image qml-threading-example.png + \ingroup qtquickexamples Threaded ListModel contains a ListView and a ListModel. The ListModel is updated asynchronusly in another thread, and the results propagate back to the main thread. A timer requests updates from the worker thread periodically: diff --git a/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc b/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc index 1f7c2a851d..c7193b4b34 100644 --- a/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc +++ b/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc @@ -34,21 +34,21 @@ Multipoint Flames demonstrates distinguishing different fingers in a MultiPointTouchArea, by assigning a different colored flame to each touch point. The MultipointTouchArea sets up multiple touch points: - \snippet examples/quick/touchinteraction/multipointtouch/multiflame.qml 0 + \snippet quick/touchinteraction/multipointtouch/multiflame.qml 0 The flames are then simply bound to the coordiates of the touch point, and whether it is currently pressed, like so: - \snippet examples/quick/touchinteraction/multipointtouch/multiflame.qml 1 + \snippet quick/touchinteraction/multipointtouch/multiflame.qml 1 Bear-Whack demonstrates using a MultiPointTouchArea to add multiple finger support to a simple game. The interaction with the game is done through a SpriteGoal that follows the TouchPoint. The TouchPoints added to the MultiPointTouchArea are a component with all this logic embedded into it: - \snippet examples/quick/touchinteraction/multipointtouch/bearwhack/content/AugmentedTouchPoint.qml 0 + \snippet quick/touchinteraction/multipointtouch/bearwhack/content/AugmentedTouchPoint.qml 0 Flick Resize uses a PinchArea to allow Pinch-to-Resize behavior. This is easily achieved just by listening to the PinchArea signals and responding to user input. - \snippet examples/quick/touchinteraction/pincharea/flickresize.qml 0 + \snippet quick/touchinteraction/pincharea/flickresize.qml 0 Flickable is a simple example demonstrating the Flickable element. The element inside the flickable is very big, but the flickable itself is very small: - \snippet examples/quick/touchinteraction/flickable/basic-flickable.qml 0 + \snippet quick/touchinteraction/flickable/basic-flickable.qml 0 Corkboards shows a more complex Flickable usecase, with elements on the flickable that respond to mouse and keyboard interaction. This doesn't require special code, the QtQuick elements automatically cooperate with Flickable for accepting the touch events. diff --git a/examples/quick/ui-components/slideswitch/doc/src/example-slideswitch.qdoc b/examples/quick/ui-components/slideswitch/doc/src/example-slideswitch.qdoc index 2f8729af73..c694e9ad63 100644 --- a/examples/quick/ui-components/slideswitch/doc/src/example-slideswitch.qdoc +++ b/examples/quick/ui-components/slideswitch/doc/src/example-slideswitch.qdoc @@ -30,6 +30,8 @@ \page qmlexampletoggleswitch.html tutorial \title QML Example - Toggle Switch \brief A reusable switch component made in QML + \ingroup qtquickexamples + This example shows how to create a reusable switch component in QML. The code for this example can be found in the \c examples/tutorials/ui-components/slideswitch directory. @@ -46,12 +48,12 @@ The elements that compose the switch are: \endlist \section1 Switch.qml -\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 0 +\snippet quick/ui-components/slideswitch/content/Switch.qml 0 \section1 Walkthrough \section2 Interface -\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 1 +\snippet quick/ui-components/slideswitch/content/Switch.qml 1 This property is the interface of the switch. By default, the switch is off and this property is \c false. It can be used to activate/disactivate the switch or to query its current state. @@ -74,14 +76,14 @@ Item { the text will only be visible when the switch is on. \section2 Images and user interaction -\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 4 +\snippet quick/ui-components/slideswitch/content/Switch.qml 4 First, we create the background image of the switch. In order for the switch to toggle when the user clicks on the background, we add a \l{MouseArea} as a child item of the image. A \c MouseArea has a \c onClicked property that is triggered when the item is clicked. For the moment we will just call a \c toggle() function. We will see what this function does in a moment. -\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 5 +\snippet quick/ui-components/slideswitch/content/Switch.qml 5 Then, we place the image of the knob on top of the background. The interaction here is a little more complex. We want the knob to move with the finger when it is clicked. That is what the \c drag @@ -89,7 +91,7 @@ property of the \c MouseArea is for. We also want to toggle the switch if the kn in the \c dorelease() function that is called in the \c onReleased property. \section2 States -\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 6 +\snippet quick/ui-components/slideswitch/content/Switch.qml 6 We define the two states of the switch: \list @@ -103,13 +105,13 @@ For more information on states see \l{Qt Quick States}. We add two JavaScript functions to our switch: -\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 2 +\snippet quick/tutorials/ui-components/slideswitch/content/Switch.qml 2 This first function is called when the background image or the knob are clicked. We simply want the switch to toggle between the two states (\e on and \e off). -\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 3 +\snippet quick/ui-components/slideswitch/content/Switch.qml 3 This second function is called when the knob is released and we want to make sure that the knob does not end up between states (neither \e on nor \e off). If it is the case call the \c toggle() function otherwise we do nothing. @@ -117,7 +119,7 @@ This second function is called when the knob is released and we want to make sur For more information on scripts see \l{Using JavaScript Expressions in QML}. \section2 Transition -\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 7 +\snippet quick/ui-components/slideswitch/content/Switch.qml 7 At this point, when the switch toggles between the two states the knob will instantly change its \c x position between 1 and 78. In order for the the knob to move smoothly we add a transition that will animate the \c x property with an easing curve for a duration of 200ms. @@ -126,5 +128,5 @@ For more information on transitions see \l{Animation and Transitions in Qt Quick \section1 Usage The switch can be used in a QML file, like this: -\snippet examples/tutorials/ui-components/slideswitch/slideswitch.qml 0 +\snippet quick/ui-components/slideswitch/slideswitch.qml 0 */ |