aboutsummaryrefslogtreecommitdiffstats
path: root/examples/quick
diff options
context:
space:
mode:
authorJerome Pasion <jerome.pasion@digia.com>2014-05-28 16:19:08 +0200
committerThe Qt Project <gerrit-noreply@qt-project.org>2014-06-05 12:02:01 +0200
commit5f99a6388abf87c34e052f3d7e266c48852a52dd (patch)
treeb88dc0b9dc36c477d6716edf932eb328d413ad68 /examples/quick
parentc9553ad7d8041c7b0fd769dc8cd0f5335d9408a3 (diff)
Doc: Updated "Qt Quick Examples" pages.
-added instructions about running the example (using \include) -used the example names as sections in the collection pages -general editing and documentation polishing -updated copyright information Change-Id: I044f29fcc1921a541040505d5821acb06dc4cb35 Reviewed-by: Sze Howe Koh <szehowe.koh@gmail.com> Reviewed-by: Jerome Pasion <jerome.pasion@digia.com>
Diffstat (limited to 'examples/quick')
-rw-r--r--examples/quick/animation/doc/src/animation.qdoc73
-rw-r--r--examples/quick/canvas/doc/src/canvas.qdoc44
-rw-r--r--examples/quick/draganddrop/doc/src/draganddrop.qdoc28
-rw-r--r--examples/quick/externaldraganddrop/doc/src/externaldraganddrop.qdoc14
-rw-r--r--examples/quick/imageelements/doc/src/imageelements.qdoc44
-rw-r--r--examples/quick/keyinteraction/doc/src/keyinteraction.qdoc12
-rw-r--r--examples/quick/localstorage/doc/src/localstorage.qdoc12
-rw-r--r--examples/quick/mousearea/doc/src/mousearea.qdoc25
-rw-r--r--examples/quick/positioners/doc/src/positioners.qdoc33
-rw-r--r--examples/quick/quick-accessibility/doc/src/accessibility.qdoc17
-rw-r--r--examples/quick/righttoleft/doc/src/righttoleft.qdoc19
-rw-r--r--examples/quick/shadereffects/doc/src/shadereffects.qdoc30
-rw-r--r--examples/quick/text/doc/src/text.qdoc55
-rw-r--r--examples/quick/threading/doc/src/threading.qdoc33
-rw-r--r--examples/quick/touchinteraction/doc/src/touchinteraction.qdoc50
-rw-r--r--examples/quick/views/doc/src/views.qdoc69
-rw-r--r--examples/quick/window/doc/src/window.qdoc59
17 files changed, 435 insertions, 182 deletions
diff --git a/examples/quick/animation/doc/src/animation.qdoc b/examples/quick/animation/doc/src/animation.qdoc
index 34a1eeb488..c76a53723b 100644
--- a/examples/quick/animation/doc/src/animation.qdoc
+++ b/examples/quick/animation/doc/src/animation.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -32,44 +32,81 @@
\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 type or feature.
+ \e Animation is a collection of small QML examples relating to animation.
+ Each example is a small QML file emphasizing a particular type or feature.
- ColorAnimation demonstrates using a color animation to fade a sky from day to night.
+ For more information about animations, visit
+ \l{Important Concepts in Qt Quick - States, Transitions and Animations}.
+
+ \include examples-run.qdocinc
+
+ \section1 ColorAnimation
+
+ \e ColorAnimation uses color animations to fade a sky from day to
+ night.
\snippet animation/basics/color-animation.qml 0
- PropertyAnimation demonstrates using a number animation to bounce a circle up and down.
+ \section1 PropertyAnimation
+
+ \e PropertyAnimation uses number animations to bounce a
+ circle up and down.
\snippet animation/basics/property-animation.qml 0
- Animators demonstrates using a animators to bounce an icon up and down.
+ \section1 Animators
+
+ \e Animators uses animators to bounce an icon up and down.
\snippet animation/basics/animators.qml 0
- Behaviors demonstrates using behaviors to animate moving a rectangle to whereever you click.
+ \section1 Behaviors
+
+ \e Behaviors uses behaviors to move a rectangle to where you click.
\snippet 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:
+ \section1 Wiggly Text
+
+ \e{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 animation/behaviors/wigglytext.qml 0
- Then, it uses behaviors to animate the movement on each letter:
+
+ Then, it uses behaviors to animate the movement of each letter:
\snippet 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.
+ \section1 Tv Tennis
+
+ \e{Tv Tennis} uses complex behaviors to make the paddles follow a ball to
+ simulate an infinite tennis game. Again, a binding which depends on other
+ values is applied to the position and a behavior provided the animation.
\snippet animation/behaviors/tvtennis.qml 0
- Easing Curves shows off all the easing curves available in Qt Quick animations.
+ \section1 Easing Curves
+
+ \e{Easing Curves} shows off all the easing curves available in Qt Quick
+ animations.
+
+ \section1 States
+
+ \e States demonstrates how the properties of an item can vary between
+ \l{Qt Quick States}{states}.
- States demonstrates how the properties of an item can vary between states.
It defines several states:
\snippet animation/states/states.qml 0
- Note that there is also the implicit 'base state' from properties set directly on objects.
- Transitions takes the States example and animates the property changes by setting transitions:
+ \section1 Transitions
+
+ \e Transitions takes the States example and animates the property changes
+ by setting transitions:
\snippet animation/states/transitions.qml 0
- PathAnimation animates an image along a beizer curve using a PathAnimation.
+ \section1 PathAnimation
+
+ \e PathAnimation animates an image along a bezier curve using a
+ \l PathAnimation.
\snippet animation/pathanimation/pathanimation.qml 0
- PathInterpolator animates an image along the same beizer curve, using a PathInterpolator instead.
+ \section1 PathInterpolator
+
+ \e PathInterpolator animates an image along the same bezier curve, using a
+ \l PathInterpolator instead.
\snippet animation/pathinterpolator/pathinterpolator.qml 0
*/
diff --git a/examples/quick/canvas/doc/src/canvas.qdoc b/examples/quick/canvas/doc/src/canvas.qdoc
index f3eb78e1d1..2c4bd1f752 100644
--- a/examples/quick/canvas/doc/src/canvas.qdoc
+++ b/examples/quick/canvas/doc/src/canvas.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -32,27 +32,49 @@
\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 type or feature.
+ \e Canvas is a collection of small QML examples relating to the \l Canvas
+ type. Each example is a small QML file emphasizing a particular type or
+ feature.
- Red heart demonstrates using a bezierCurve API to stroke and fill a red heart.
+ \include examples-run.qdocinc
+
+ \section1 Red heart
+
+ \e{Red heart} uses the bezier curve API to stroke and fill a red heart.
\snippet canvas/bezierCurve/bezierCurve.qml 0
- Talk bubble demonstrates using a quadraticCurveTo API to stroke and fill a customized talk bubble:
+ \section1 Talk bubble
+
+ \e{Talk bubble} uses the quadraticCurveTo() API to stroke and fill a
+ customized talk bubble:
\snippet canvas/quadraticCurveTo/quadraticCurveTo.qml 0
- This example also demonstrates the fillText API:
+
+ This example also demonstrates the fillText() API:
\snippet canvas/quadraticCurveTo/quadraticCurveTo.qml 1
- Squircle demonstrates using a collection of simple moveTo/lineTo path APIs to draw a smooth squircle.
+ \section1 Squircle
+
+ \e Squircle uses a collection of simple moveTo() and lineTo() path APIs to
+ draw a smooth squircle.
- Rounded rectangle demonstrates using a collection if lineTo/arcTo path APIs to draw a rounded rectangle.
+ \section1 Rounded rectangle
- Smile face demonstrates using several complex path APIs to draw an fill a smile face.
+ \e{Rounded rectangle} uses a collection of lineTo() and arcTo() path APIs to
+ draw a rounded rectangle.
- Clip demonstrates using clip API to clip a given image.
+ \section1 Smile face
+
+ \e{Smile face} uses several paths to draw and fill a smiling face.
+
+ \section1 Clip
+
+ \e Clip uses the clip API to clip a given image.
\snippet canvas/clip/clip.qml 0
- Tiger demonstrates using SVG path API to draw a tiger with a collection of SVG path strings.
+ \section1 Tiger
+
+ \e Tiger uses the SVG path API to draw a tiger with a collection
+ of SVG path strings.
\snippet canvas/tiger/tiger.qml 0
*/
diff --git a/examples/quick/draganddrop/doc/src/draganddrop.qdoc b/examples/quick/draganddrop/doc/src/draganddrop.qdoc
index 2c62e271e6..909f2676bd 100644
--- a/examples/quick/draganddrop/doc/src/draganddrop.qdoc
+++ b/examples/quick/draganddrop/doc/src/draganddrop.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -31,11 +31,19 @@
\image qml-draganddrop-example.png
\ingroup qtquickexamples
- This is a collection of small QML examples relating to drag and drop functionality.
+ \e{Drag and Drop} is a collection of small QML examples relating to drag
+ and drop functionality. For more information, visit the \l{Drag and Drop}
+ page.
- \section2 Tiles adds drag and drop to simple rectangles, which you can drag into a specific grid.
+ \include examples-run.qdocinc
- It has a DragTile component which uses a MouseArea to move an item when dragged:
+ \section1 Tiles
+
+ \e Tiles adds drag and drop to simple rectangles, which you can drag into a
+ specific grid.
+
+ It has a DragTile component which uses a MouseArea to move an item when
+ dragged:
\snippet draganddrop/tiles/DragTile.qml 0
\snippet draganddrop/tiles/DragTile.qml 1
@@ -44,15 +52,15 @@
\snippet 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.
+ The keys property of the DropArea will only allow an item with a matching
+ key in its Drag.keys property to be dropped on it.
- \section2 GridView adds drag and drop to a GridView, allowing you to reorder the list.
+ \section1 GridView
- It uses a DelegateModel to move a delegate item to the position of another item
- it is dragged over.
+ \e GridView adds drag and drop to a \l GridView, allowing you to reorder the
+ list. It also uses a \l DelegateModel to move a delegate item to the
+ position of another item it is dragged over.
\snippet draganddrop/views/gridview.qml 0
\snippet draganddrop/views/gridview.qml 1
*/
-
diff --git a/examples/quick/externaldraganddrop/doc/src/externaldraganddrop.qdoc b/examples/quick/externaldraganddrop/doc/src/externaldraganddrop.qdoc
index 1251e6e1eb..51e5eddf04 100644
--- a/examples/quick/externaldraganddrop/doc/src/externaldraganddrop.qdoc
+++ b/examples/quick/externaldraganddrop/doc/src/externaldraganddrop.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -27,12 +27,18 @@
/*!
\title Qt Quick Examples - externaldraganddrop
\example externaldraganddrop
- \brief This is an example of drag and drop between Qml and other applications
+ \brief This is an example of drag-and-drop among QML applications.
\image qml-dnd2-example.png
\ingroup qtquickexamples
- This example shows you how to respond to do drag and drop using MouseArea and DropArea.
+ \e externaldraganddrop demonstrates how to perform drag and
+ drop with \l MouseArea and \l DropArea.
- Drag text between boxes, out of boxes into other applications, and from other applications into the boxes. Use option/ctrl to copy rather than move text when dragging between boxes.
+ The example allows you to drag the text to other boxes, out of boxes into
+ other applications, and from other applications into the boxes. Use the
+ option or CTRL keys to copy rather than move text when dragging between
+ boxes.
+
+ \include examples-run.qdocinc
*/
diff --git a/examples/quick/imageelements/doc/src/imageelements.qdoc b/examples/quick/imageelements/doc/src/imageelements.qdoc
index d88201faf9..07c09a02db 100644
--- a/examples/quick/imageelements/doc/src/imageelements.qdoc
+++ b/examples/quick/imageelements/doc/src/imageelements.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -31,29 +31,43 @@
\image qml-imageelements-example.png
\ingroup qtquickexamples
- This is a collection of small QML examples relating to image types.
+ \e{Image Elements} is a collection of small QML examples relating to image
+ types. For more information, visit \l{Use Case - Visual Elements In QML}.
- 'BorderImage' shows off the various scaling modes of the BorderImage item
- by setting its horizontalTileMode and verticalTileMode properties.
+ \include examples-run.qdocinc
- 'Image' shows off the various fill modes of the Image item.
+ \section1 BorderImage
- 'Shadows' shows how to create a drop shadow effect for a rectangular item
- using a BorderImage:
+ \e BorderImage shows off the various scaling modes of the \l BorderImage
+ type by setting its horizontalTileMode and verticalTileMode properties.
+
+ \section1 Image
+
+ \e Image shows off the various fill modes of the \l Image type.
+
+ \section1 Shadows
+
+ \e Shadows shows how to create a drop shadow effect for a rectangular item
+ using a \l BorderImage:
\snippet imageelements/content/ShadowRectangle.qml shadow
- 'AnimatedSprite' shows how to display a simple animation using an
- AnimatedSprite object:
+ \section1 AnimatedSprite
+
+ \e AnimatedSprite shows how to display a simple animation using an
+ \l AnimatedSprite object:
\snippet imageelements/animatedsprite.qml sprite
- The sprite animation will loop 3 times.
+ The sprite animation will loop three times.
+
+ \section1 SpriteSequence
- '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:
+ \e SpriteSequence demonstrates using a sprite sequence to draw an animated
+ and interactive bear. The \l SpriteSequence object defines five different
+ sprites. The bear is initially in a \e still state:
\snippet 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.
+ \e falling states and animates the bear's y property.
\snippet 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 d29536c66c..fa9fdcfde0 100644
--- a/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc
+++ b/examples/quick/keyinteraction/doc/src/keyinteraction.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -31,5 +31,13 @@
\image qml-keyinteraction-example.png
\ingroup qtquickexamples
- This example demonstrates combining various methods of interacting with keyboard focus.
+ \e{Keyboard Focus in Qt Quick} combines various methods of
+ handling keyboard focus. For more information, visit
+ \l{Keyboard Focus in Qt Quick}.
+
+ \include examples-run.qdocinc
+
+ Using the keyboard arrow keys, the focus shifts to the menus and
+ the \l GridView.
+
*/
diff --git a/examples/quick/localstorage/doc/src/localstorage.qdoc b/examples/quick/localstorage/doc/src/localstorage.qdoc
index 0a5d1cd6fd..3e2fd7f006 100644
--- a/examples/quick/localstorage/doc/src/localstorage.qdoc
+++ b/examples/quick/localstorage/doc/src/localstorage.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -30,9 +30,13 @@
\brief A collection of QML local storage examples.
\image qml-localstorage-example.png
- This is a collection of small QML examples relating to local storage functionality.
+ \e{Local Storage} is a collection of small QML examples relating to
+ Qt Quick's \l{local storage} functionality.
- \e {Hello World} demonstrates creating a simple SQL table and doing insert/select operations.
+ \include examples-run.qdocinc
-*/
+ \section1 Hello World
+ \e {Hello World} demonstrates creating a simple SQL table and doing
+ insert and select operations.
+*/
diff --git a/examples/quick/mousearea/doc/src/mousearea.qdoc b/examples/quick/mousearea/doc/src/mousearea.qdoc
index 091be69e5d..827e5497ee 100644
--- a/examples/quick/mousearea/doc/src/mousearea.qdoc
+++ b/examples/quick/mousearea/doc/src/mousearea.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -27,20 +27,27 @@
/*!
\title Qt Quick Examples - MouseArea
\example mousearea
- \brief This is an example of the MouseArea type in QML
+ \brief This is an example of the MouseArea type in QML.
\image qml-mousearea-example.png
\ingroup qtquickexamples
- This example shows you how to respond to clicks and drags with a MouseArea.
+ \e MouseArea example shows how to respond to clicks and drags with a
+ \l MouseArea. For more information, visit
+ \l{Important Concepts In Qt Quick - User Input}.
- When you click inside the red square, the Text type will list several properties
- of that click which are available to QML.
+ \include examples-run.qdocinc
- Signals are emitted by the MouseArea when clicks or other discrete operations occur within it
+ \section1 MouseArea Behavior
+
+ When you click inside the red square, the \l Text type will list several
+ properties of that click which are available to QML.
+
+ Signals are emitted by the MouseArea when clicks or other discrete
+ operations occur within it.
\snippet mousearea/mousearea.qml clicks
- The MouseArea can also be used to drag items 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.
+ \l MouseArea can also be used to drag items around. By setting the
+ parameters of the drag property, the target item will be dragged around if
+ the user starts to drag within the mouse area boundary.
\snippet mousearea/mousearea.qml drag
-
*/
diff --git a/examples/quick/positioners/doc/src/positioners.qdoc b/examples/quick/positioners/doc/src/positioners.qdoc
index 794b3b25f9..4acd42821a 100644
--- a/examples/quick/positioners/doc/src/positioners.qdoc
+++ b/examples/quick/positioners/doc/src/positioners.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -31,22 +31,35 @@
\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 type or feature.
+ \e Positioners is a collection of small QML examples relating to
+ positioners. Each example is a small QML file emphasizing a particular type
+ or feature. For more information, visit
+ \l{Important Concepts In Qt Quick - Positioning}.
- Transitions shows animated transitions when showing or hiding items in a positioner.
- 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.
+ \include examples-run.qdocinc
+
+ \section1 Transitions
+
+ \e Transitions shows animated transitions when showing or hiding items in a
+ positioner. It consists of a scene populated with items in a variety of
+ positioners: \l Column, \l Row, \l Grid, and \l Flow. Each positioner has
+ animations described as Transitions.
\snippet 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.
+ The move transition specifies how items inside a positioner will animate
+ when they are displaced by the appearance or disappearance of other items.
\snippet positioners/positioners-transitions.qml add
- The add transition specifies how items will appear when they are added to a positioner.
+ The add transition specifies how items will appear when they are added to a
+ positioner.
\snippet positioners/positioners-transitions.qml populate
- The populate transition specifies how items will appear when their parent positioner is first created.
+ The populate transition specifies how items will appear when their parent
+ positioner is first created.
+
+ \section1 Attached Properties
- Attached Properties shows how the Positioner attached property can be used to determine where an item is within a positioner.
+ \e{Attached Properties} shows how the Positioner attached property can be
+ used to determine where an item is within a positioner.
\snippet positioners/positioners-attachedproperties.qml 0
*/
diff --git a/examples/quick/quick-accessibility/doc/src/accessibility.qdoc b/examples/quick/quick-accessibility/doc/src/accessibility.qdoc
index 5ad60d1c0f..da89333835 100644
--- a/examples/quick/quick-accessibility/doc/src/accessibility.qdoc
+++ b/examples/quick/quick-accessibility/doc/src/accessibility.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -27,14 +27,21 @@
/*!
\title Qt Quick Examples - Accessibility
\example quick-accessibility
- \brief This example has accessible buttons.
+ \brief This example demonstrates the implementation of accessible buttons.
\ingroup qtquickexamples
- Types in this example are augmented with meta-data for accessiblity systems.
+ \e Accessibility demonstrates QML types that are augmented with meta-data
+ for accessibility systems. For more information, visit the
+ \l{Accessibility} page.
- For example, the button identifies itself and its functionality to the accessibility system:
+ \include examples-run.qdocinc
+
+ \section1 Implementing Accessible Buttons
+
+ The button identifies itself and its functionality to the
+ accessibility system:
\snippet quick-accessibility/content/Button.qml button
- As do Text types inside the example:
+ Similarly, \l Text types inside the example also identify themselves:
\snippet quick-accessibility/accessibility.qml text
*/
diff --git a/examples/quick/righttoleft/doc/src/righttoleft.qdoc b/examples/quick/righttoleft/doc/src/righttoleft.qdoc
index 6a207f7233..1671f9b1ad 100644
--- a/examples/quick/righttoleft/doc/src/righttoleft.qdoc
+++ b/examples/quick/righttoleft/doc/src/righttoleft.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -31,9 +31,18 @@
\image qml-righttoleft-example.png
\ingroup qtquickexamples
- This is a collection of small QML examples relating to right to left(RTL) localization support.
+ \e{Right to Left} is a collection of small QML examples relating to
+ right to left (RTL) localization support. For more information,
+ visit \l{Right-to-left User Interfaces}.
- Layout direction shows RTL layouting.
- Layout mirroring shows automatic mirroring of horizontal layouts in RTL locales.
- Text Alignment shows automatic mirroring of text alignment in RTL locales.
+ These are the examples in Right to Left:
+ \list
+ \li \e{Layout Direction} - shows RTL layout direction
+ \li \e{Layout Mirroring} - shows automatic mirroring of horizontal layouts
+ in RTL locales
+ \li \e{Text Alignment} - shows automatic mirroring of text alignment in RTL
+ locales
+ \endlist
+
+ \include examples-run.qdocinc
*/
diff --git a/examples/quick/shadereffects/doc/src/shadereffects.qdoc b/examples/quick/shadereffects/doc/src/shadereffects.qdoc
index 3d5f42eacc..448ee9f3e3 100644
--- a/examples/quick/shadereffects/doc/src/shadereffects.qdoc
+++ b/examples/quick/shadereffects/doc/src/shadereffects.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -28,24 +28,34 @@
\title Qt Quick Examples - Shader Effects
\example shadereffects
\image qml-shadereffects-example.png
- \brief This is a shader effects example
+ \brief This is a shader effects example.
\ingroup qtquickexamples
This example demonstrates a couple of visual effects that you can perform
- with shaders in \l {Qt Quick}.
+ with shaders in Qt Quick. For more information, visit
+ \l{Important Concepts In Qt Quick - Graphical Effects}
- ShaderEffects typically operate on other types, using a ShaderEffectSource
+ \include examples-run.qdocinc
+
+ \section1 Using ShaderEffect
+
+ The \l ShaderEffect type typically operates on other types, using a
+ \l ShaderEffectSource:
\snippet shadereffects/shadereffects.qml source
- In the above snippet, theItem is the id of a complex QML object in the file.
- ShaderEffects can use this ShaderEffectSource as a texture in their fragment shader.
+ In the above snippet, \c theItem is the ID of a complex QML object in the
+ file.
+
+ ShaderEffects can use this ShaderEffectSource as a texture in their fragment
+ shader:
\snippet shadereffects/shadereffects.qml fragment
- You can use any custom property on the ShaderEffect in your shader. This makes
- animated shader code very easy.
+ You can use any custom property on the ShaderEffect in your shader. This
+ makes animated shader code very easy:
\snippet 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.
+ ShaderEffects can also have a custom vertext shader. Setting the mesh
+ property on ShaderEffect provides more vertices for you to manipulate,
+ enabling more effects.
\snippet shadereffects/shadereffects.qml vertex
*/
diff --git a/examples/quick/text/doc/src/text.qdoc b/examples/quick/text/doc/src/text.qdoc
index 3a300fbcf3..8ef79ab9d9 100644
--- a/examples/quick/text/doc/src/text.qdoc
+++ b/examples/quick/text/doc/src/text.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -27,44 +27,61 @@
/*!
\title Qt Quick Examples - Text
\example text
- \brief This is a collection of QML examples relating to text
+ \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 type or
+ \e Text is a collection of small QML examples relating to text. Each example
+ is a small QML file, usually containing or emphasizing a particular type or
feature. You can run and observe the behavior of each example.
- 'Hello' shows how to change and animate the letter spacing of a Text type.
- 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:
+ \section1 Hello
+
+ \e Hello shows how to change and animate the letter spacing of a \l Text
+ type. It uses a sequential animation to first animate the font.letterSpacing
+ property from \c 0 to \c 50 over three seconds and then move the text to a
+ random position on screen:
\snippet text/fonts/hello.qml letterspacing
- 'Fonts' shows different ways of using fonts with the Text type.
+ \section1 Fonts
+
+ \e Fonts shows different ways of using fonts with the \l Text type.
Simply by name, using the font.family property directly:
\snippet text/fonts/fonts.qml name
- or using a FontLoader type:
+
+ or using a \l FontLoader type:
\snippet text/fonts/fonts.qml fontloader
+
or using a FontLoader and specifying a local font file:
\snippet text/fonts/fonts.qml fontloaderlocal
+
or finally using a FontLoader and specifying a remote font file:
\snippet text/fonts/fonts.qml fontloaderremote
- 'Available Fonts' shows how to use the QML \l{QtQml::Qt}{Qt} global object and a list view
- to display all the fonts available on the system.
- The ListView type uses the list of fonts available as its model:
+ \section1 Available Fonts
+
+ \e{Available Fonts} shows how to use the QML \l{QtQml::Qt}{Qt} global object
+ and a list view to display all the fonts available on the system.
+ The \l ListView type uses the list of fonts available as its model:
\snippet text/fonts/availableFonts.qml model
+
Inside the delegate, the font family is set with the modelData:
\snippet text/fonts/availableFonts.qml delegate
- 'Banner' is a simple example showing how to create a banner using a row of text
- types and a NumberAnimation.
+ \section1 Banner
+
+ \e Banner is a simple example showing how to create a banner using a row of
+ text types and a \l NumberAnimation.
+
+ \section1 Img tag
+
+ \e{Img tag} shows different ways of displaying images in text objects using
+ the \c{<img>} tag.
- 'Img tag' shows different ways of displaying images in a text types using
- the <img> tag.
+ \section1 Text Layout
- 'Text Layout' shows how to create a more complex layout for a text item.
- This example lays out the text in two columns using the onLineLaidOut handler
- that allows you to position and resize each line:
+ \e{Text Layout} shows how to create a more complex layout for a text item.
+ This example lays out the text in two columns using the onLineLaidOut
+ handler that allows you to position and resize each line:
\snippet text/styledtext-layout.qml layout
*/
diff --git a/examples/quick/threading/doc/src/threading.qdoc b/examples/quick/threading/doc/src/threading.qdoc
index 1cced3b9d3..1695a2da6f 100644
--- a/examples/quick/threading/doc/src/threading.qdoc
+++ b/examples/quick/threading/doc/src/threading.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -27,23 +27,42 @@
/*!
\title Qt Quick Examples - Threading
\example threading
- \brief This is a collection of QML Multithreading examples.
+ \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:
+ \e Threading is a collection of QML multithreading examples.
+
+ \include examples-run.qdocinc
+
+ \section1 Threaded ListModel
+
+ \e{Threaded ListModel} contains a \l ListView and a \l ListModel.
+ The ListModel object is updated asynchronously in another thread, and the
+ results propagate back to the main thread. A timer requests updates from the
+ worker thread periodically:
\snippet threading/threadedlistmodel/timedisplay.qml 0
- Inside the worker thread, the ListModel is synchronized once the data is finished loading:
+ Inside the worker thread, the ListModel is synchronized once the data is
+ finished loading:
\snippet threading/threadedlistmodel/dataloader.js 0
- WorkerScript contains an example of using a WorkerScript to offload expensive calculations into another thread. This keeps the UI from being blocked. This example calculates numbers in Pascal's Triangle, and not in a very optimal way, so it will often take several seconds to complete the calculation. By doing this in a WorkerScript in another thread, the UI is not blocked during this time.
+ \section1 WorkerScript
+
+ \e WorkerScript contains an example of using a \l WorkerScript to offload
+ expensive calculations into another thread. This keeps the UI from being
+ blocked. This example calculates numbers in Pascal's Triangle, and not in a
+ very optimal way, so it will often take several seconds to complete the
+ calculation. By doing this in a WorkerScript in another thread, the UI is
+ not blocked during this time.
When the UI needs another value, a request is sent to the WorkerScript:
\snippet threading/workerscript/workerscript.qml 0
+
The workerscript then is free to take a really long time to calculate it:
\snippet threading/workerscript/workerscript.js 0
- When it's done, the result returns to the main scene via the WorkerScript type:
+
+ When it's done, the result returns to the main scene via the WorkerScript
+ type:
\snippet threading/workerscript/workerscript.qml 1
*/
diff --git a/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc b/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc
index 09a5f51105..245cd00592 100644
--- a/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc
+++ b/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -27,29 +27,53 @@
/*!
\title Qt Quick Examples - Touch Interaction
\example touchinteraction
- \brief This is a collection of QML Touch Interaction examples.
+ \brief A collection of QML Touch Interaction examples.
\image qml-touchinteraction-example.png
- This is a collection of small QML examples relating to touch interaction methods.
+ \e{Touch Interaction} is a collection of small QML examples relating to
+ touch interaction methods. For more information, visit
+ \l{Important Concepts In Qt Quick - User Input}.
+
+ \include examples-run.qdocinc
+
+ \section1 Multipoint Flames
+
+ \e{Multipoint Flames} demonstrates distinguishing different fingers in a
+ \l MultiPointTouchArea, by assigning a different colored flame to each touch
+ point.
- 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 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:
+
+ The flames are then simply bound to the coordinates of the touch point, and
+ whether it is currently pressed, as follows:
\snippet 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:
+ \section1 Bear-Whack
+
+ \e{Bear-Whack} demonstrates using \l 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 the relevant logic
+ embedded into it:
\snippet touchinteraction/multipointtouch/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.
+ \section1 Flick Resize
+
+ \e{Flick Resize} uses a \l PinchArea to implement a \e{pinch-to-resize}
+ behavior. This is easily achieved by listening to the PinchArea signals and
+ responding to user input.
\snippet touchinteraction/pincharea/flickresize.qml 0
- Flickable is a simple example demonstrating the Flickable type. The object inside the flickable is very big, but the flickable itself is very small:
+ \section1 Flickable
+
+ \e Flickable is a simple example demonstrating the \l Flickable type.
\snippet touchinteraction/flickable/basic-flickable.qml 0
- Corkboards shows a more complex Flickable usecase, with types on the flickable that respond to mouse and keyboard interaction.
- This doesn't require special code, the Qt Quick types automatically cooperate with Flickable for accepting the touch events.
+ \section1 Corkboards
+
+ \e Corkboards shows another use for \l Flickable, with QML types within the
+ flickable object that respond to mouse and keyboard interaction. This
+ behavior does not require special code as the Qt Quick types already
+ cooperate with the Flickable type for accepting touch events.
*/
diff --git a/examples/quick/views/doc/src/views.qdoc b/examples/quick/views/doc/src/views.qdoc
index 2d664c9bd9..d25d9f40c9 100644
--- a/examples/quick/views/doc/src/views.qdoc
+++ b/examples/quick/views/doc/src/views.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -28,55 +28,86 @@
/*!
\title Qt Quick Examples - Views
\example views
- \brief This is a collection of QML model/view 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. They demonstrate how to show data from a model using the \l {Qt Quick} view types.
+ \e Views is a collection of small QML examples relating to model and view
+ functionality. They demonstrate how to show data from a model using the
+ Qt Quick view types. For more information, visit the
+ \l{Models and Views in Qt Quick} page.
- \section2 GridView and PathView demonstrate usage of these types to display views.
+ \include examples-run.qdocinc
+
+ \section1 GridView and PathView
+
+ \e GridView and \e PathView demonstrate usage of these types to display
+ views.
\snippet views/gridview/gridview-example.qml 0
- \section2 Dynamic List demonstrates animation of runtime additions and removals to a ListView.
+ \section1 Dynamic List
+
+ \e{Dynamic List} demonstrates animation of runtime additions and removals to
+ a \l 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.
+ 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 views/listview/dynamiclist.qml 0
\snippet views/listview/dynamiclist.qml 1
- \section2 Expanding Delegates demonstrates delegates that expand when activated.
+ \section2 Expanding Delegates
- It has a complex delegate the size and appearance of which can change, displacing
- other items in the view.
+ \e{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 views/listview/expandingdelegates.qml 0
\snippet views/listview/expandingdelegates.qml 1
\snippet views/listview/expandingdelegates.qml 2
\snippet views/listview/expandingdelegates.qml 3
- \section2 Highlight demonstrates adding a custom highlight to a ListView.
+ \section1 Highlight
+
+ \e Highlight demonstrates adding a custom highlight to a \l ListView.
\snippet views/listview/highlight.qml 0
- \section2 Highlight Ranges shows the three different highlight range modes of ListView.
+ \section1 Highlight Ranges
+
+ \e{Highlight Ranges} shows the three different highlight range modes of
+ ListView.
\snippet views/listview/highlightranges.qml 0
\snippet views/listview/highlightranges.qml 1
\snippet views/listview/highlightranges.qml 2
- \section2 Sections demonstrates the various section headers and footers available to ListView.
+ \section1 Sections
+
+ \e Sections demonstrates the various section headers and footers available
+ to \l ListView.
\snippet views/listview/sections.qml 0
- \section2 Packages demonstrates using Packages to transition delegates between two views.
+ \section1 Packages
+
+ \e Packages uses the \l Package type 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.
+ It has a Package object which defines delegate items for each view and an
+ item that can be transferred between delegates.
\snippet views/package/Delegate.qml 0
- A DelegateModel allows the individual views to access their specific items from
- the shared package delegate.
+ A \l DelegateModel allows the individual views to access their specific
+ items from the shared package delegate.
\snippet views/package/view.qml 0
- \section2 ObjectModel uses an ObjectModel for the model instead of a ListModel.
+ \section1 ObjectModel
+
+ \e ObjectModel uses an ObjectModel for the model instead of a \l ListModel.
\snippet views/objectmodel/objectmodel.qml 0
+
+ \section1 Display Margins
+
+ \e{Display Margins} uses delegates to display items and implements a simple
+ header and footer components.
*/
diff --git a/examples/quick/window/doc/src/window.qdoc b/examples/quick/window/doc/src/window.qdoc
index 07d2f115c1..7725f39a46 100644
--- a/examples/quick/window/doc/src/window.qdoc
+++ b/examples/quick/window/doc/src/window.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 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.
@@ -31,22 +31,35 @@
\image qml-window-example.png
\ingroup qtquickexamples
- This example shows you how to create a Window in QML, how to control its
- \l {QQuickWindow::visibility} {visibility}, how to present a splash screen
- during application startup, and how to access the properties of the
- \l Screen. It also demonstrates how to package QML into
- \l {The Qt Resource System} {resources} and provide an
- \l {Setting the Application Icon} {icon} to create a standalone QML desktop application.
+ \e{Window and Screen} shows how to:
+
+ \list
+ \li create a window in QML
+ \li control its \l {QQuickWindow::visibility} {visibility}
+ \li present a splash screen during application startup
+ \li access the properties of the \l Screen
+ \endlist
+
+ It also demonstrates how to package QML into \l {The Qt Resource System}
+ {resources} and provide an \l {Setting the Application Icon} {icon} to
+ create a standalone QML desktop application.
+
+ \include examples-run.qdocinc
+
+ \section1 Window Implementation
+
+ A splash screen can be created with the \l {Qt::SplashScreen}
+ {Qt.SplashScreen} flag, and should be \l {Qt::ApplicationModal}
+ {ApplicationModal} to prevent interaction with the main window. If the
+ splash window is also transparent, and showing a partially transparent
+ image, then it will look like a shaped window.
- A splash screen can be created with the \l {Qt::SplashScreen} {Qt.SplashScreen} flag,
- and should be \l {Qt::ApplicationModal} {ApplicationModal} to prevent interaction
- with the main window. If the splash window is also transparent, and showing a
- partially transparent image, then it will look like a shaped window.
\snippet window/Splash.qml splash-properties
In this example a \l Timer will automatically dismiss the splash screen,
but in a real application you might want to connect to a signal from the
application logic to hide the splash when initialization is complete.
+
\snippet window/Splash.qml timer
The main window in this example is the control window, with some buttons
@@ -54,18 +67,22 @@
window. Each checkbox has a binding to the property whose state it is
displaying, and also an onClicked handler to change the state. This is the
typical pattern to create a two-way binding while avoiding binding loops.
+
\snippet window/window.qml windowedCheckbox
- The \l Screen has several properties which are generally useful to applications
- which need to rotate some content when the screen orientation changes, to position
- windows on the screen or to convert real units to logical pixel units. ScreenInfo.qml
- (which is displayed inline in window.qml, or can be run by itself with qmlscene)
- simply displays the property values, while the splash screen uses them to
- center the window on the screen.
+ \l Screen has several properties which are generally useful to
+ applications which need to rotate some content when the screen orientation
+ changes, to position windows on the screen or to convert real units to
+ logical pixel units. ScreenInfo.qml (which is displayed inline in
+ window.qml, or can be run by itself with qmlscene) simply displays the
+ property values, while the splash screen uses them to center the window on
+ the screen.
+
\snippet window/Splash.qml screen-properties
- If a Window is nested inside an \l Item or another Window, the inner window
- becomes "transient for" the outer one (see \l Window for more explanation).
- But if you want to create multiple top-level windows as unrelated peers, you
- can create them inside a non-visual \l QtObject root item, as this example does.
+ If a \l Window is nested inside an \l Item or another Window, the inner
+ window becomes \e{transient for} the outer one (see \l Window for more
+ explanation). But if you want to create multiple top-level windows as
+ unrelated peers, you can create them inside a non-visual \l QtObject root
+ item, as this example does.
*/