aboutsummaryrefslogtreecommitdiffstats
path: root/doc/src/examples
diff options
context:
space:
mode:
Diffstat (limited to 'doc/src/examples')
-rw-r--r--doc/src/examples/advtutorial.qdoc74
-rw-r--r--doc/src/examples/dynamicview-tutorial.qdoc66
-rw-r--r--doc/src/examples/example-slideswitch.qdoc20
-rw-r--r--doc/src/examples/example-textballoons.qdoc10
4 files changed, 85 insertions, 85 deletions
diff --git a/doc/src/examples/advtutorial.qdoc b/doc/src/examples/advtutorial.qdoc
index fb5134ddf4..bcf819aef1 100644
--- a/doc/src/examples/advtutorial.qdoc
+++ b/doc/src/examples/advtutorial.qdoc
@@ -53,13 +53,13 @@ control QML elements.
Tutorial chapters:
\list 1
-\li \l {declarative/tutorials/samegame/samegame1}{Creating the Game Canvas and Blocks}
-\li \l {declarative/tutorials/samegame/samegame2}{Populating the Game Canvas}
-\li \l {declarative/tutorials/samegame/samegame3}{Implementing the Game Logic}
-\li \l {declarative/tutorials/samegame/samegame4}{Finishing Touches}
+\li \l {examples/tutorials/samegame/samegame1}{Creating the Game Canvas and Blocks}
+\li \l {examples/tutorials/samegame/samegame2}{Populating the Game Canvas}
+\li \l {examples/tutorials/samegame/samegame3}{Implementing the Game Logic}
+\li \l {examples/tutorials/samegame/samegame4}{Finishing Touches}
\endlist
-All the code in this tutorial can be found in Qt's \c examples/declarative/tutorials/samegame
+All the code in this tutorial can be found in Qt's \c examples/examples/tutorials/samegame
directory.
*/
@@ -71,7 +71,7 @@ directory.
\previouspage QML Advanced Tutorial
\nextpage QML Advanced Tutorial 2 - Populating the Game Canvas
-\example declarative/tutorials/samegame/samegame1
+\example examples/tutorials/samegame/samegame1
\section2 Creating the application screen
@@ -83,7 +83,7 @@ To begin with, we create our Same Game application with a main screen like this:
This is defined by the main application file, \c samegame.qml, which looks like this:
-\snippet declarative/tutorials/samegame/samegame1/samegame.qml 0
+\snippet examples/tutorials/samegame/samegame1/samegame.qml 0
This gives you a basic game window that includes the main canvas for the
blocks, a "New Game" button and a score display.
@@ -101,7 +101,7 @@ The \c Button item in the code above is defined in a separate component file nam
To create a functional button, we use the QML elements \l Text and \l MouseArea inside a \l Rectangle.
Here is the \c Button.qml code:
-\snippet declarative/tutorials/samegame/samegame1/Button.qml 0
+\snippet examples/tutorials/samegame/samegame1/Button.qml 0
This essentially defines a rectangle that contains text and can be clicked. The \l MouseArea
has an \c onClicked() handler that is implemented to emit the \c clicked() signal of the
@@ -111,7 +111,7 @@ In Same Game, the screen is filled with small blocks when the game begins.
Each block is just an item that contains an image. The block
code is defined in a separate \c Block.qml file:
-\snippet declarative/tutorials/samegame/samegame1/Block.qml 0
+\snippet examples/tutorials/samegame/samegame1/Block.qml 0
At the moment, the block doesn't do anything; it is just an image. As the
tutorial progresses we will animate and give behaviors to the blocks.
@@ -141,7 +141,7 @@ elements to get started. Next, we will populate the game canvas with some blocks
\previouspage QML Advanced Tutorial 1 - Creating the Game Canvas and Blocks
\nextpage QML Advanced Tutorial 3 - Implementing the Game Logic
-\example declarative/tutorials/samegame/samegame2
+\example examples/tutorials/samegame/samegame2
\section2 Generating the blocks in JavaScript
@@ -156,7 +156,7 @@ create the blocks in JavaScript.
Here is the JavaScript code for generating the blocks, contained in a new
file, \c samegame.js. The code is explained below.
-\snippet declarative/tutorials/samegame/samegame2/samegame.js 0
+\snippet examples/tutorials/samegame/samegame2/samegame.js 0
The \c startNewGame() function deletes the blocks created in the previous game and
calculates the number of rows and columns of blocks required to fill the game window for the new game.
@@ -192,14 +192,14 @@ Now we need to call the JavaScript code in \c samegame.js from our QML files.
To do this, we add this line to \c samegame.qml which imports
the JavaScript file as a \l{Modules#QML Modules}{module}:
-\snippet declarative/tutorials/samegame/samegame2/samegame.qml 2
+\snippet examples/tutorials/samegame/samegame2/samegame.qml 2
This allows us to refer to any functions within \c samegame.js using "SameGame"
as a prefix: for example, \c SameGame.startNewGame() or \c SameGame.createBlock().
This means we can now connect the New Game button's \c onClicked handler to the \c startNewGame()
function, like this:
-\snippet declarative/tutorials/samegame/samegame2/samegame.qml 1
+\snippet examples/tutorials/samegame/samegame2/samegame.qml 1
So, when you click the New Game button, \c startNewGame() is called and generates a field of blocks, like this:
@@ -217,7 +217,7 @@ Now, we have a screen of blocks, and we can begin to add the game mechanics.
\previouspage QML Advanced Tutorial 2 - Populating the Game Canvas
\nextpage QML Advanced Tutorial 4 - Finishing Touches
-\example declarative/tutorials/samegame/samegame3
+\example examples/tutorials/samegame/samegame3
\section2 Making a playable game
@@ -241,7 +241,7 @@ As this is a tutorial about QML, not game design, we will only discuss \c handle
To make it easier for the JavaScript code to interface with the QML elements, we have added an Item called \c gameCanvas to \c samegame.qml. It replaces the background as the item which contains the blocks. It also accepts mouse input from the user. Here is the item code:
-\snippet declarative/tutorials/samegame/samegame3/samegame.qml 1
+\snippet examples/tutorials/samegame/samegame3/samegame.qml 1
The \c gameCanvas item is the exact size of the board, and has a \c score property and a \l MouseArea to handle mouse clicks.
The blocks are now created as its children, and its dimensions are used to determine the board size so that
@@ -251,7 +251,7 @@ Note that it can still be accessed from the script.
When clicked, the \l MouseArea calls \c{handleClick()} in \c samegame.js, which determines whether the player's click should cause any blocks to be removed, and updates \c gameCanvas.score with the current score if necessary. Here is the \c handleClick() function:
-\snippet declarative/tutorials/samegame/samegame3/samegame.js 1
+\snippet examples/tutorials/samegame/samegame3/samegame.js 1
Note that if \c score was a global variable in the \c{samegame.js} file you would not be able to bind to it. You can only bind to QML properties.
@@ -259,17 +259,17 @@ Note that if \c score was a global variable in the \c{samegame.js} file you woul
When the player clicks a block and triggers \c handleClick(), \c handleClick() also calls \c victoryCheck() to update the score and to check whether the player has completed the game. Here is the \c victoryCheck() code:
-\snippet declarative/tutorials/samegame/samegame3/samegame.js 2
+\snippet examples/tutorials/samegame/samegame3/samegame.js 2
This updates the \c gameCanvas.score value and displays a "Game Over" dialog if the game is finished.
The Game Over dialog is created using a \c Dialog element that is defined in \c Dialog.qml. Here is the \c Dialog.qml code. Notice how it is designed to be usable imperatively from the script file, via the functions and signals:
-\snippet declarative/tutorials/samegame/samegame3/Dialog.qml 0
+\snippet examples/tutorials/samegame/samegame3/Dialog.qml 0
And this is how it is used in the main \c samegame.qml file:
-\snippet declarative/tutorials/samegame/samegame3/samegame.qml 2
+\snippet examples/tutorials/samegame/samegame3/samegame.qml 2
We give the dialog a \l {Item::z}{z} value of 100 to ensure it is displayed on top of our other components. The default \c z value for an item is 0.
@@ -278,7 +278,7 @@ We give the dialog a \l {Item::z}{z} value of 100 to ensure it is displayed on t
It's not much fun to play Same Game if all the blocks are the same color, so we've modified the \c createBlock() function in \c samegame.js to randomly create a different type of block (for either red, green or blue) each time it is called. \c Block.qml has also changed so that each block contains a different image depending on its type:
-\snippet declarative/tutorials/samegame/samegame3/Block.qml 0
+\snippet examples/tutorials/samegame/samegame3/Block.qml 0
\section2 A working game
@@ -290,7 +290,7 @@ Here is a screenshot of what has been accomplished so far:
This is what \c samegame.qml looks like now:
-\snippet declarative/tutorials/samegame/samegame3/samegame.qml 0
+\snippet examples/tutorials/samegame/samegame3/samegame.qml 0
The game works, but it's a little boring right now. Where are the smooth animated transitions? Where are the high scores?
If you were a QML expert you could have written these in the first iteration, but in this tutorial they've been saved
@@ -305,7 +305,7 @@ until the next chapter - where your application becomes alive!
\contentspage QML Advanced Tutorial
\previouspage QML Advanced Tutorial 3 - Implementing the Game Logic
-\example declarative/tutorials/samegame/samegame4
+\example examples/tutorials/samegame/samegame4
\section2 Adding some flair
@@ -324,7 +324,7 @@ In \c BoomBlock.qml, we apply a \l SpringAnimation behavior to the \c x and \c y
block will follow and animate its movement in a spring-like fashion towards the specified position (whose
values will be set by \c samegame.js).Here is the code added to \c BoomBlock.qml:
-\snippet declarative/tutorials/samegame/samegame4/content/BoomBlock.qml 1
+\snippet examples/tutorials/samegame/samegame4/content/BoomBlock.qml 1
The \c spring and \c damping values can be changed to modify the spring-like effect of the animation.
@@ -341,7 +341,7 @@ animate the opacity value so that it gradually fades in and out, instead of abru
visible and invisible. To do this, we'll apply a \l Behavior on the \c opacity property of the \c Image
element in \c BoomBlock.qml:
-\snippet declarative/tutorials/samegame/samegame4/content/BoomBlock.qml 2
+\snippet examples/tutorials/samegame/samegame4/content/BoomBlock.qml 2
Note the \c{opacity: 0} which means the block is transparent when it is first created. We could set the opacity
in \c samegame.js when we create and destroy the blocks,
@@ -367,14 +367,14 @@ To fade out, we set \c dying to true instead of setting opacity to 0 when a bloc
Finally, we'll add a cool-looking particle effect to the blocks when they are destroyed. To do this, we first add a \l Particles element in
\c BoomBlock.qml, like so:
-\snippet declarative/tutorials/samegame/samegame4/content/BoomBlock.qml 3
+\snippet examples/tutorials/samegame/samegame4/content/BoomBlock.qml 3
To fully understand this you should read the \l Particles documentation, but it's important to note that \c emissionRate is set
to zero so that particles are not emitted normally.
Also, we extend the \c dying State, which creates a burst of particles by calling the \c burst() method on the particles element. The code for the states now look
like this:
-\snippet declarative/tutorials/samegame/samegame4/content/BoomBlock.qml 4
+\snippet examples/tutorials/samegame/samegame4/content/BoomBlock.qml 4
Now the game is beautifully animated, with subtle (or not-so-subtle) animations added for all of the
player's actions. The end result is shown below, with a different set of images to demonstrate basic theming:
@@ -391,32 +391,32 @@ To do this, we will show a dialog when the game is over to request the player's
This requires a few changes to \c Dialog.qml. In addition to a \c Text element, it now has a
\c TextInput child item for receiving keyboard text input:
-\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 0
+\snippet examples/tutorials/samegame/samegame4/content/Dialog.qml 0
\dots 4
-\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 2
+\snippet examples/tutorials/samegame/samegame4/content/Dialog.qml 2
\dots 4
-\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 3
+\snippet examples/tutorials/samegame/samegame4/content/Dialog.qml 3
We'll also add a \c showWithInput() function. The text input will only be visible if this function
is called instead of \c show(). When the dialog is closed, it emits a \c closed() signal, and
other elements can retrieve the text entered by the user through an \c inputText property:
-\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 0
-\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 1
+\snippet examples/tutorials/samegame/samegame4/content/Dialog.qml 0
+\snippet examples/tutorials/samegame/samegame4/content/Dialog.qml 1
\dots 4
-\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 3
+\snippet examples/tutorials/samegame/samegame4/content/Dialog.qml 3
Now the dialog can be used in \c samegame.qml:
-\snippet declarative/tutorials/samegame/samegame4/samegame.qml 0
+\snippet examples/tutorials/samegame/samegame4/samegame.qml 0
When the dialog emits the \c closed signal, we call the new \c saveHighScore() function in \c samegame.js, which stores the high score locally in an SQL database and also send the score to an online database if possible.
The \c nameInputDialog is activated in the \c victoryCheck() function in \c samegame.js:
-\snippet declarative/tutorials/samegame/samegame4/content/samegame.js 3
+\snippet examples/tutorials/samegame/samegame4/content/samegame.js 3
\dots 4
-\snippet declarative/tutorials/samegame/samegame4/content/samegame.js 4
+\snippet examples/tutorials/samegame/samegame4/content/samegame.js 4
\section3 Storing high scores offline
@@ -424,7 +424,7 @@ Now we need to implement the functionality to actually save the High Scores tabl
Here is the \c saveHighScore() function in \c samegame.js:
-\snippet declarative/tutorials/samegame/samegame4/content/samegame.js 2
+\snippet examples/tutorials/samegame/samegame4/content/samegame.js 2
First we call \c sendHighScore() (explained in the section below) if it is possible to send the high scores to an online database.
@@ -443,7 +443,7 @@ If the player entered their name we can send the data to the web service us
If the player enters a name, we send the data to the service using this code in \c samegame.js:
-\snippet declarative/tutorials/samegame/samegame4/content/samegame.js 1
+\snippet examples/tutorials/samegame/samegame4/content/samegame.js 1
The \l XMLHttpRequest in this code is the same as the \c XMLHttpRequest() as you'll find in standard browser JavaScript, and can be used in the same way to dynamically get XML
or QML from the web service to display the high scores. We don't worry about the response in this case - we just post the high
diff --git a/doc/src/examples/dynamicview-tutorial.qdoc b/doc/src/examples/dynamicview-tutorial.qdoc
index 210a762442..b50dc1e39e 100644
--- a/doc/src/examples/dynamicview-tutorial.qdoc
+++ b/doc/src/examples/dynamicview-tutorial.qdoc
@@ -39,13 +39,13 @@ data to dynamically sort all items in a view.
Tutorial chapters:
\list 1
-\li \l {declarative/tutorials/dynamicview/dynamicview1}{A Simple ListView and Delegate}
-\li \l {declarative/tutorials/dynamicview/dynamicview2}{Dragging View Items}
-\li \l {declarative/tutorials/dynamicview/dynamicview3}{Moving Dragged Items}
-\li \l {declarative/tutorials/dynamicview/dynamicview4}{Sorting Items}
+\li \l {examples/tutorials/dynamicview/dynamicview1}{A Simple ListView and Delegate}
+\li \l {examples/tutorials/dynamicview/dynamicview2}{Dragging View Items}
+\li \l {examples/tutorials/dynamicview/dynamicview3}{Moving Dragged Items}
+\li \l {examples/tutorials/dynamicview/dynamicview4}{Sorting Items}
\endlist
-All the code in this tutorial can be found in Qt's \c examples/declarative/tutorials/dynamicview
+All the code in this tutorial can be found in Qt's \c examples/examples/tutorials/dynamicview
directory.
*/
@@ -57,19 +57,19 @@ directory.
\previouspage QML Dynamic View Ordering Tutorial
\nextpage QML Dynamic View Ordering Tutorial 2 - Dragging View Items
-\example declarative/tutorials/dynamicview/dynamicview1
+\example examples/tutorials/dynamicview/dynamicview1
We begin our application by defining a ListView, a model which will provide data to the view, and a
delegate which provides a template for constructing items in the view.
The code for the ListView and delegate looks like this:
-\snippet declarative/tutorials/dynamicview/dynamicview1/dynamicview.qml 0
+\snippet examples/tutorials/dynamicview/dynamicview1/dynamicview.qml 0
The model is defined in a separate QML file which looks like this:
-\snippet declarative/tutorials/dynamicview/dynamicview1/PetsModel.qml 0
-\snippet declarative/tutorials/dynamicview/dynamicview1/PetsModel.qml 1
+\snippet examples/tutorials/dynamicview/dynamicview1/PetsModel.qml 0
+\snippet examples/tutorials/dynamicview/dynamicview1/PetsModel.qml 1
\section2 Walkthrough
@@ -79,11 +79,11 @@ is the template from which each item in the ListView is constructed.
The \c name, \c age, \c type, and \c size variables referenced in the delegate are sourced from
the model data. The names correspond to roles defined in the model.
-\snippet declarative/tutorials/dynamicview/dynamicview1/dynamicview.qml 1
+\snippet examples/tutorials/dynamicview/dynamicview1/dynamicview.qml 1
The second part of the application is the ListView itself to which we bind the model and delegate.
-\snippet declarative/tutorials/dynamicview/dynamicview1/dynamicview.qml 2
+\snippet examples/tutorials/dynamicview/dynamicview1/dynamicview.qml 2
*/
/*!
@@ -94,13 +94,13 @@ The second part of the application is the ListView itself to which we bind the m
\previouspage QML Dynamic View Ordering Tutorial 1 - A Simple ListView and Delegate
\nextpage QML Dynamic View Ordering Tutorial 3 - Moving Dragged Items
-\example declarative/tutorials/dynamicview/dynamicview2
+\example examples/tutorials/dynamicview/dynamicview2
Now that we have a visible list of items we want to be able to interact with them. We'll start
by extending the delegate so the visible content can be dragged up and down the screen. The
updated delegate looks like this:
-\snippet declarative/tutorials/dynamicview/dynamicview2/dynamicview.qml 0
+\snippet examples/tutorials/dynamicview/dynamicview2/dynamicview.qml 0
\section2 Walkthrough
@@ -109,8 +109,8 @@ for mouse events and will allow us to drag the delegate's content item. It also
a container for the content item which is important as a delegate's root item is positioned by
the view and cannot be moved by other means.
-\snippet declarative/tutorials/dynamicview/dynamicview2/dynamicview.qml 1
-\snippet declarative/tutorials/dynamicview/dynamicview2/dynamicview.qml 2
+\snippet examples/tutorials/dynamicview/dynamicview2/dynamicview.qml 1
+\snippet examples/tutorials/dynamicview/dynamicview2/dynamicview.qml 2
Dragging the content item is enabled by binding it to the MouseArea's
\l {QtQuick2::MouseArea::drag.target}{drag.target} property. Because we still want the view to be
@@ -120,14 +120,14 @@ timeout has expired it is interpreted as moving the list and if it moves after i
dragging an item. To make it more obvious to the user when an item can be dragged we'll change the
background color of the content item when the timeout has expired.
-\snippet declarative/tutorials/dynamicview/dynamicview2/dynamicview.qml 3
+\snippet examples/tutorials/dynamicview/dynamicview2/dynamicview.qml 3
The other thing we'll need to do before an item can be dragged is to unset any anchors on the
content item so it can be freely moved around. We do this in a state change that is triggered
when the delegate item is held, at the same time we can reparent the content item to the root item
so that is above other items in the stacking order and isn't obscured as it is dragged around.
-\snippet declarative/tutorials/dynamicview/dynamicview2/dynamicview.qml 4
+\snippet examples/tutorials/dynamicview/dynamicview2/dynamicview.qml 4
*/
@@ -139,16 +139,16 @@ so that is above other items in the stacking order and isn't obscured as it is d
\previouspage QML Dynamic View Ordering Tutorial 2 - Dragging View Items
\nextpage QML Dynamic View Ordering Tutorial 4 - Sorting Items
-\example declarative/tutorials/dynamicview/dynamicview3
+\example examples/tutorials/dynamicview/dynamicview3
The next step in our application to move items within the list as they're dragged so that we
can re-order the list. To achieve this we introduce three new elements to our application;
VisualDataModel, \l Drag and DropArea.
-\snippet declarative/tutorials/dynamicview/dynamicview3/dynamicview.qml 0
-\snippet declarative/tutorials/dynamicview/dynamicview3/dynamicview.qml 1
-\snippet declarative/tutorials/dynamicview/dynamicview3/dynamicview.qml 2
-\snippet declarative/tutorials/dynamicview/dynamicview3/dynamicview.qml 5
+\snippet examples/tutorials/dynamicview/dynamicview3/dynamicview.qml 0
+\snippet examples/tutorials/dynamicview/dynamicview3/dynamicview.qml 1
+\snippet examples/tutorials/dynamicview/dynamicview3/dynamicview.qml 2
+\snippet examples/tutorials/dynamicview/dynamicview3/dynamicview.qml 5
\section2 Walkthrough
@@ -156,7 +156,7 @@ In order to re-order the view we need to determine when one item has been dragge
the Drag attached property we can generate events that are sent to the scene graph whenever the item
it is attached to moves.
-\snippet declarative/tutorials/dynamicview/dynamicview3/dynamicview.qml 1
+\snippet examples/tutorials/dynamicview/dynamicview3/dynamicview.qml 1
Drag events are only sent while the active property is true, so in this example the first event
would be sent when the delegate was held with additional event sents when dragging. The
@@ -167,7 +167,7 @@ Then we use a DropArea in each view item to determine when the hot spot of the d
intersects another item, when a drag enters one of these DropAreas we can move the dragged item
to the index of the item it was dragged over.
-\snippet declarative/tutorials/dynamicview/dynamicview3/dynamicview.qml 3
+\snippet examples/tutorials/dynamicview/dynamicview3/dynamicview.qml 3
To move the items within the view we use a VisualDataModel. The VisualDataModel element is used by
the view elements to instantiate delegate items from model data and when constructed explicitly can
@@ -181,7 +181,7 @@ To utilize a VisualDataModel with a ListView we bind it to the \l {QtQuick2::Lis
property of the view and bind the \l {QtQuick2::VisualDataModel::model}{model} and
\l {QtQuick2::VisualDataModel::delegate}{delegate} to the VisualDataModel.
-\snippet declarative/tutorials/dynamicview/dynamicview3/dynamicview.qml 4
+\snippet examples/tutorials/dynamicview/dynamicview3/dynamicview.qml 4
*/
@@ -192,13 +192,13 @@ property of the view and bind the \l {QtQuick2::VisualDataModel::model}{model} a
\contentspage QML Dynamic View Ordering Tutorial
\previouspage QML Dynamic View Ordering Tutorial 3 - Moving Dragged Items
-\example declarative/tutorials/dynamicview/dynamicview4
+\example examples/tutorials/dynamicview/dynamicview4
Drag and drop isn't the only way items in a view can be re-ordered, using a VisualDataModel it is
also possible to sort items based on model data. To do that we extend our VisualDataModel instance
like this:
-\snippet declarative/tutorials/dynamicview/dynamicview4/dynamicview.qml 0
+\snippet examples/tutorials/dynamicview/dynamicview4/dynamicview.qml 0
\section2 Walkthrough
@@ -209,8 +209,8 @@ we want items to first be added to an unsorted group from where we can transfer
position in the items group. To do that we clear includeByDefault on the items group and set it on
a new group name 'unsorted'.
-\snippet declarative/tutorials/dynamicview/dynamicview4/dynamicview.qml 1
-\snippet declarative/tutorials/dynamicview/dynamicview4/dynamicview.qml 2
+\snippet examples/tutorials/dynamicview/dynamicview4/dynamicview.qml 1
+\snippet examples/tutorials/dynamicview/dynamicview4/dynamicview.qml 2
We sort the items by first finding the position in the items group to insert the first unsorted
item and then transfer the item to the items group before moving it to the pre-determined index and
@@ -221,19 +221,19 @@ with the \l {QtQuick2::VisualDataModel::get} {get} function. Through the model
handle we can access the same model data that is available in a delegate instance of that item and
compare against other items to determine relative position.
-\snippet declarative/tutorials/dynamicview/dynamicview4/dynamicview.qml 3
+\snippet examples/tutorials/dynamicview/dynamicview4/dynamicview.qml 3
The lessThan argument to the sort function is a comparsion function which will determine the order
of the list. In this example it can be one of the following:
-\snippet declarative/tutorials/dynamicview/dynamicview4/dynamicview.qml 4
+\snippet examples/tutorials/dynamicview/dynamicview4/dynamicview.qml 4
A sort is triggered whenever new items are added to the unsorted VisualDataGroup which we are
notified of by the \l {QtQuick2::VisualDataGroup::onChanged}{onChanged} handler. If no sort
function is currently selected we simply transfer all items from the unsorted group to the items
group, otherwise we call sort with the selected sort function.
-\snippet declarative/tutorials/dynamicview/dynamicview4/dynamicview.qml 5
+\snippet examples/tutorials/dynamicview/dynamicview4/dynamicview.qml 5
Finally when the selected sort order changes we can trigger a full re-sort of the list by moving
all items from the items group to the unsorted group, which will trigger the
@@ -241,6 +241,6 @@ all items from the items group to the unsorted group, which will trigger the
items group in correct order. Note that the \l {QtQuick2::VisualDataGroup::onChanged}{onChanged}
handler will not be invoked recursively so there's no issue with it being invoked during a sort.
-\snippet declarative/tutorials/dynamicview/dynamicview4/dynamicview.qml 6
+\snippet examples/tutorials/dynamicview/dynamicview4/dynamicview.qml 6
*/
diff --git a/doc/src/examples/example-slideswitch.qdoc b/doc/src/examples/example-slideswitch.qdoc
index 61300c9e47..1c8f4d25bb 100644
--- a/doc/src/examples/example-slideswitch.qdoc
+++ b/doc/src/examples/example-slideswitch.qdoc
@@ -32,7 +32,7 @@
\brief A reusable switch component made in QML
This example shows how to create a reusable switch component in QML.
-The code for this example can be found in the \c examples/declarative/ui-components/slideswitch directory.
+The code for this example can be found in the \c examples/tutorials/ui-components/slideswitch directory.
The elements that compose the switch are:
@@ -46,12 +46,12 @@ The elements that compose the switch are:
\endlist
\section1 Switch.qml
-\snippet examples/declarative/ui-components/slideswitch/content/Switch.qml 0
+\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 0
\section1 Walkthrough
\section2 Interface
-\snippet examples/declarative/ui-components/slideswitch/content/Switch.qml 1
+\snippet examples/tutorials/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 +74,14 @@ Item {
the text will only be visible when the switch is on.
\section2 Images and user interaction
-\snippet examples/declarative/ui-components/slideswitch/content/Switch.qml 4
+\snippet examples/tutorials/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/declarative/ui-components/slideswitch/content/Switch.qml 5
+\snippet examples/tutorials/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 +89,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/declarative/ui-components/slideswitch/content/Switch.qml 6
+\snippet examples/tutorials/ui-components/slideswitch/content/Switch.qml 6
We define the two states of the switch:
\list
@@ -103,13 +103,13 @@ For more information on states see \l{States}.
We add two JavaScript functions to our switch:
-\snippet examples/declarative/ui-components/slideswitch/content/Switch.qml 2
+\snippet examples/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/declarative/ui-components/slideswitch/content/Switch.qml 3
+\snippet examples/tutorials/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 +117,7 @@ This second function is called when the knob is released and we want to make sur
For more information on scripts see \l{JavaScript Expressions in QML}.
\section2 Transition
-\snippet examples/declarative/ui-components/slideswitch/content/Switch.qml 7
+\snippet examples/tutorials/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 +126,5 @@ For more information on transitions see \l{QML Animation and Transitions}.
\section1 Usage
The switch can be used in a QML file, like this:
-\snippet examples/declarative/ui-components/slideswitch/slideswitch.qml 0
+\snippet examples/tutorials/ui-components/slideswitch/slideswitch.qml 0
*/
diff --git a/doc/src/examples/example-textballoons.qdoc b/doc/src/examples/example-textballoons.qdoc
index 299ceeb808..eeb88154b6 100644
--- a/doc/src/examples/example-textballoons.qdoc
+++ b/doc/src/examples/example-textballoons.qdoc
@@ -56,7 +56,7 @@
is the base class for all QPainter based items in the QML Scene Graph
framework.
- \snippet examples/declarative/painteditem/textballoons/textballoon.h 0
+ \snippet examples/quick/painteditem/textballoons/textballoon.h 0
To implement a QQuickPaintedItem you must implement QQuickPaintedIem's pure
virtual function \l {QQuickPaintedItem::}{paint()} which implements the
@@ -67,13 +67,13 @@
We have to be sure to initialize the rightAligned property for a
TextBalloon item.
- \snippet examples/declarative/painteditem/textballoons/textballoon.cpp 0
+ \snippet examples/quick/painteditem/textballoons/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/declarative/painteditem/textballoons/textballoon.cpp 1
+ \snippet examples/quick/painteditem/textballoons/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 +88,7 @@
\section2 BalloonView
- \snippet examples/declarative/painteditem/textballoons/textballoons.qml 0
+ \snippet examples/quick/painteditem/textballoons/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 +96,7 @@
\section2 Controls
- \snippet examples/declarative/painteditem/textballoons/textballoons.qml 1
+ \snippet examples/quick/painteditem/textballoons/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