summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorNico Vertriest <nico.vertriest@qt.io>2017-10-03 13:40:01 (GMT)
committerNico Vertriest <nico.vertriest@qt.io>2017-10-11 08:49:44 (GMT)
commitbca35ce54a541991ff1e36a9bb2e0d436c757ed9 (patch)
tree2035aa2a1a96018907362fff09d71d10f92a1810
parentf9c410f619c1019fc361e230df0e4d2a2259e8e9 (diff)
downloadqtquickcontrols-bca35ce54a541991ff1e36a9bb2e0d436c757ed9.tar.gz
Doc: add documentation to Dashboard examplev5.10.0-beta2
Task-number: QTBUG-60648 Change-Id: I79b9fdfde18041d95b7aa422bfb4d188ed907589 Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
-rw-r--r--examples/quickcontrols/extras/dashboard/qml/TurnIndicator.qml10
-rw-r--r--examples/quickcontrols/extras/dashboard/qml/ValueSource.qml6
-rw-r--r--src/extras/doc/src/qtquickextras-examples.qdoc37
3 files changed, 46 insertions, 7 deletions
diff --git a/examples/quickcontrols/extras/dashboard/qml/TurnIndicator.qml b/examples/quickcontrols/extras/dashboard/qml/TurnIndicator.qml
index b132510..c0fb672 100644
--- a/examples/quickcontrols/extras/dashboard/qml/TurnIndicator.qml
+++ b/examples/quickcontrols/extras/dashboard/qml/TurnIndicator.qml
@@ -59,7 +59,7 @@ Item {
property bool flashing: false
scale: direction === Qt.LeftArrow ? 1 : -1
-
+//! [1]
Timer {
id: flashTimer
interval: 500
@@ -67,7 +67,8 @@ Item {
repeat: true
onTriggered: flashing = !flashing
}
-
+//! [1]
+//! [2]
function paintOutlinePath(ctx) {
ctx.beginPath();
ctx.moveTo(0, height * 0.5);
@@ -79,7 +80,7 @@ Item {
ctx.lineTo(0.6 * width, height);
ctx.lineTo(0, height * 0.5);
}
-
+//! [2]
Canvas {
id: backgroundCanvas
anchors.fill: parent
@@ -95,7 +96,7 @@ Item {
ctx.stroke();
}
}
-
+//! [3]
Canvas {
id: foregroundCanvas
anchors.fill: parent
@@ -111,4 +112,5 @@ Item {
ctx.fill();
}
}
+//! [3]
}
diff --git a/examples/quickcontrols/extras/dashboard/qml/ValueSource.qml b/examples/quickcontrols/extras/dashboard/qml/ValueSource.qml
index 7225be4..4491362 100644
--- a/examples/quickcontrols/extras/dashboard/qml/ValueSource.qml
+++ b/examples/quickcontrols/extras/dashboard/qml/ValueSource.qml
@@ -49,7 +49,7 @@
****************************************************************************/
import QtQuick 2.2
-
+//! [0]
Item {
id: valueSource
property real kph: 0
@@ -79,6 +79,7 @@ Item {
property int turnSignal: gear == "P" && !start ? randomDirection() : -1
property real temperature: 0.6
property bool start: true
+//! [0]
function randomDirection() {
return Math.random() > 0.5 ? Qt.LeftArrow : Qt.RightArrow;
@@ -101,7 +102,7 @@ Item {
SequentialAnimation {
loops: Animation.Infinite
-
+//! [1]
ParallelAnimation {
NumberAnimation {
target: valueSource
@@ -120,6 +121,7 @@ Item {
duration: 3000
}
}
+//! [1]
ParallelAnimation {
// We changed gears so we lost a bit of speed.
NumberAnimation {
diff --git a/src/extras/doc/src/qtquickextras-examples.qdoc b/src/extras/doc/src/qtquickextras-examples.qdoc
index f54834f..8ae35ef 100644
--- a/src/extras/doc/src/qtquickextras-examples.qdoc
+++ b/src/extras/doc/src/qtquickextras-examples.qdoc
@@ -31,7 +31,7 @@
\title Qt Quick Extras Examples
\brief A collection of examples for \l{Qt Quick Extras}.
- Below is a listing of the examples for \l{Qt Quick Extras}.
+ Below you will find a list with examples for \l{Qt Quick Extras}.
*/
/*!
@@ -53,6 +53,41 @@
\image qtquickextras-example-dashboard.png
This example project demonstrates the use of \l CircularGauge to create a car dashboard.
+
+
+ The ValueSource type generates random data for testing the dashboard.
+ The data is random but there is a logical link between some of them,
+ for example, \c kph and \c rpm.
+
+
+ \snippet dashboard/qml/ValueSource.qml 0
+
+ It runs a looping SequentialAnimation that sets the values of
+ the properties over time.
+
+ The SequentialAnimation object consists of several ParallelAnimation
+ objects, which in turn consist of two NumberAnimations, one for
+ \c kph and one for \c rpm. Both let the value develop to a certain
+ value over a specified \c duration with the Easing type \c Easing.InOutSine
+
+ \snippet dashboard/qml/ValueSource.qml 1
+
+ The flashTimer object switches the turn signals \c on or \c off.
+
+ \snippet dashboard/qml/TurnIndicator.qml 1
+
+ The \c paintOutlinePath(ctx) method does the actual painting of the arrow
+ for the turn signal.
+
+ \snippet dashboard/qml/TurnIndicator.qml 2
+
+ The screen consists of a \c foregroundCanvas and a \c backgroundCanvas.
+ \c foregroundCanvas displays the green turn signal if the \c on and
+ \c flashing booleans are \c true.
+
+ \snippet dashboard/qml/TurnIndicator.qml 3
+*/
+
*/
/*!