diff options
author | Thomas Hartmann <thomas.hartmann@qt.io> | 2017-08-30 18:34:15 +0200 |
---|---|---|
committer | Thomas Hartmann <thomas.hartmann@qt.io> | 2017-09-07 14:13:46 +0000 |
commit | f9acced861c9cecb68826d16773f4eda3ffe7192 (patch) | |
tree | 67085d195ac3c079a875efa2189a0ad6edb17537 | |
parent | 8b4a72a2899929ebecceee351b2fe8630c9d7bae (diff) |
Update qtcluster
* Refactoring
The meters now share common components and code
(LargeMeter and SmallMeter)
* Adjusting colors
* The glow is now resizing according to the value
* Clean up
Change-Id: I0db10df787813d9b49d8d59d3d3ddd5c6feea3b8
Reviewed-by: Alessandro Portale <alessandro.portale@qt.io>
12 files changed, 237 insertions, 334 deletions
diff --git a/doc/src/snippets/qtcluster/hybridqml.qrc b/doc/src/snippets/qtcluster/hybridqml.qrc index 1e9f7288a..46f47078b 100644 --- a/doc/src/snippets/qtcluster/hybridqml.qrc +++ b/doc/src/snippets/qtcluster/hybridqml.qrc @@ -5,12 +5,8 @@ <file>qml/dash_hybrid/Dashboard.qml</file> <file>qml/dash_hybrid/DashboardFrame.qml</file> <file>qml/dash_hybrid/DashboardView.qml</file> - <file>qml/dash_hybrid/gauges/BatteryMeter.qml</file> <file>qml/dash_hybrid/gauges/ConsumptionMeter.qml</file> <file>qml/dash_hybrid/gauges/FpsMeter.qml</file> - <file>qml/dash_hybrid/gauges/FuelMeter.qml</file> - <file>qml/dash_hybrid/gauges/SpeedoMeter.qml</file> - <file>qml/dash_hybrid/gauges/TachoMeter.qml</file> <file>qml/dash_hybrid/gauges/TemperatureMeter.qml</file> <file>qml/dash_hybrid/gauges/TurboMeter.qml</file> <file>qml/dash_hybrid/CenterViewCalendar.qml</file> @@ -23,5 +19,7 @@ <file>qml/dash_hybrid/DashboardBackground.qml</file> <file>qml/dash_hybrid/DashboardBackgroundForm.ui.qml</file> <file>qml/dash_hybrid/Gadget.qml</file> + <file>qml/dash_hybrid/gauges/LargeMeter.qml</file> + <file>qml/dash_hybrid/gauges/SmallMeter.qml</file> </qresource> </RCC> diff --git a/doc/src/snippets/qtcluster/images/SpeedometerNeedleGreen.png b/doc/src/snippets/qtcluster/images/SpeedometerNeedleGreen.png Binary files differindex eeb56f5d3..2d8aba144 100644 --- a/doc/src/snippets/qtcluster/images/SpeedometerNeedleGreen.png +++ b/doc/src/snippets/qtcluster/images/SpeedometerNeedleGreen.png diff --git a/doc/src/snippets/qtcluster/images/greenglow.png b/doc/src/snippets/qtcluster/images/greenglow.png Binary files differindex 7097220bd..34a89f0f3 100644 --- a/doc/src/snippets/qtcluster/images/greenglow.png +++ b/doc/src/snippets/qtcluster/images/greenglow.png diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/BottomPanel.ui.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/BottomPanel.ui.qml index abc04c5db..40fe5a6e0 100644 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/BottomPanel.ui.qml +++ b/doc/src/snippets/qtcluster/qml/dash_hybrid/BottomPanel.ui.qml @@ -114,7 +114,6 @@ Item { anchors.right: textTime.left anchors.rightMargin: 3 - color: ValueSource.parkingBrake ? bottomPanel.iconRed : bottomPanel.iconDark source: "qrc:/iso-icons/iso_grs_7000_4_0238.dat" } @@ -137,7 +136,6 @@ Item { anchors.left: textTime.right anchors.leftMargin: bottomPanel.iconMargin - color: ValueSource.lowBeam ? bottomPanel.iconGreen : bottomPanel.iconDark source: "qrc:/iso-icons/iso_grs_7000_4_0456.dat" } @@ -162,7 +160,6 @@ Item { anchors.verticalCenter: textTime.verticalCenter anchors.left: iconTyre.right - color: ValueSource.lightFailure ? bottomPanel.iconYellow : bottomPanel.iconDark source: "qrc:/iso-icons/iso_grs_7000_4_1555.dat" } diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/Dashboard.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/Dashboard.qml index fe5801236..ae1e0c93b 100644 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/Dashboard.qml +++ b/doc/src/snippets/qtcluster/qml/dash_hybrid/Dashboard.qml @@ -39,6 +39,7 @@ ****************************************************************************/ import QtQuick 2.6 +import ClusterDemo 1.0 import "gauges" DashboardForm @@ -54,7 +55,16 @@ DashboardForm property real timeScaleMultiplier: 1.5 property bool startupAnimationsFinished: false - onNeedleRotationChanged: speedometer.speedometerNeedleRotation = needleRotation / 40. + //onNeedleRotationChanged: speedometer.speedometerNeedleRotation = needleRotation / 40. + + property bool animationStopped: ValueSource.runningInDesigner ? true : startupAnimationsFinished + + speedometer.actualValue: animationStopped ? ValueSource.kph : -needleRotation / 40 + + tachometer.actualValue: animationStopped ? ValueSource.rpm : -needleRotation + + speedText.text: speedometer.actualValue.toFixed().toString() + // // Startup animations diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/DashboardForm.ui.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/DashboardForm.ui.qml index d806dc562..8897836c2 100644 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/DashboardForm.ui.qml +++ b/doc/src/snippets/qtcluster/qml/dash_hybrid/DashboardForm.ui.qml @@ -40,42 +40,55 @@ import QtQuick 2.6 import ClusterDemo 1.0 import "gauges" +import QtQuick.Extras 1.4 +import ".." DashboardBackground { id: dashboardEntity property alias bottompanel: bottompanel - property alias speedometer: speedometer - property alias tachometer: tachometer property alias bottomPanelY: bottompanel.y - property alias needleRotation: tachometer.tachometerNeedleRotation + property alias needleRotation: tachometer.speedometerNeedleRotation property real meterOpacity: 1 + property alias speedometer: speedometer + property alias tachometer: tachometer + property alias speedText: speedText + property alias smallMeter: smallMeter - gadget2.green: tachometer.actualRPM < 4000 - gadget.green: speedometer.actualSpeed < 100 + gadget2.green: tachometer.actualValue < 4000 + gadget2.value: tachometer.actualValue + gadget2.maxValue: 8000 + gadget.green: speedometer.actualValue < 100 + gadget.value: speedometer.actualValue anchors.fill: parent - // Speedometer - SpeedoMeter { - opacity: dashboardEntity.meterOpacity - id: speedometer - } - // Tachometer - TachoMeter { - id: tachometer - opacity: dashboardEntity.meterOpacity - anchors.fill: parent - } // Fuelmeter - FuelMeter { + SmallMeter { + id: fuelMeter + x: 432 + y: 47 + value: ValueSource.fuelLevel opacity: dashboardEntity.meterOpacity } + // Batterymeter - BatteryMeter { + SmallMeter { + id: batteryMeter + x: 433 + y: 47 + value: ValueSource.batteryLevel opacity: dashboardEntity.meterOpacity + maxValueAngle: 317 + minValueAngle: 225 + maximumValue: 100 + degreesPerValue: Math.abs( + (maxValueAngle - minValueAngle) / maximumValue) + rotationOffset: 135 + direction: -1 } + // Consumptionmeter ConsumptionMeter { opacity: dashboardEntity.meterOpacity @@ -85,16 +98,82 @@ DashboardBackground { opacity: dashboardEntity.meterOpacity } // Turbometer - TurboMeter { + SmallMeter { + id: smallMeter + x: 741 + y: 47 opacity: dashboardEntity.meterOpacity + + value: ValueSource.rpm / 2000. + + maxValueAngle: 270 + minValueAngle: 0 + maximumValue: 4.0 + degreesPerValue: Math.abs( + (maxValueAngle - minValueAngle) / maximumValue) } + // Fpsmeter FpsMeter { opacity: dashboardEntity.meterOpacity } + // Bottom Panel BottomPanel { id: bottompanel y: 402 } + + LargeMeter { + id: speedometer + + opacity: dashboardEntity.meterOpacity + x: 35 + y: 8 + actualValue: ValueSource.kph + } + + LargeMeter { + id: tachometer + opacity: dashboardEntity.meterOpacity + x: 768 + y: 8 + minValueAngle: 55 + maxValueAngle: 255 + minimumValue: 0 + maximumValue: 8000 + limitValue: 4000 + } + + Text { + id: speedText + x: 74 + y: 330 + + font.pixelSize: 40 + color: "lightGray" + text: "10" + anchors.horizontalCenter: speedometer.horizontalCenter + opacity: dashboardEntity.meterOpacity + } + + Text { + id: speedUnitText + anchors.top: speedText.bottom + font.pixelSize: 18 + color: "lightGray" + text: "KM/H" + anchors.horizontalCenter: speedText.horizontalCenter + opacity: dashboardEntity.meterOpacity + } + Text { + id: textEco + + anchors.horizontalCenter: tachometer.horizontalCenter + text: tachometer.actualValue > 4000 ? "POWER" : "ECO" + anchors.verticalCenter: tachometer.verticalCenter + font.pixelSize: 18 + color: tachometer.actualValue <= 4000 ? "white" : "red" + opacity: dashboardEntity.meterOpacity + } } diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/Gadget.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/Gadget.qml index 62b535e84..b9b3c5eed 100644 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/Gadget.qml +++ b/doc/src/snippets/qtcluster/qml/dash_hybrid/Gadget.qml @@ -46,24 +46,34 @@ Item { width: 240 height: 240 + property real value: 0 + property real minValue: 0 + property real maxValue: 200 + + property real __t: value / (maxValue - minValue) + + property real __scale: __t * 1.04 + (1 - __t) * 0.85 * __scaleAnimation + property real __scaleAnimation: 1 + property bool green: true + SequentialAnimation { running: true loops: -1 PropertyAnimation { - target: glow - from: 0.96 - to: 0.94 - property: "scale" + target: gadget + from: 1 + to: 0.95 + property: "__scaleAnimation" duration: 600 } PropertyAnimation { - target: glow - from: 0.94 - to: 0.96 - property: "scale" + target: gadget + from: 0.95 + to: 1 + property: "__scaleAnimation" duration: 600 } } @@ -76,12 +86,19 @@ Item { width: 145 height: 145 + scale: gadget.__scale + Image { id: green x: 0 y: -1 source: "image://etc/greenglow.png" + Behavior on opacity { + NumberAnimation { + + } + } } Image { @@ -90,7 +107,14 @@ Item { y: 0 source: "image://etc/redglow.png" + Behavior on opacity { + NumberAnimation { + + } + } } + + } Image { diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/BatteryMeter.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/BatteryMeter.qml deleted file mode 100644 index 1a70ce6c4..000000000 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/BatteryMeter.qml +++ /dev/null @@ -1,72 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2015 The Qt Company Ltd. -** Contact: http://www.qt.io/licensing/ -** -** This file is part of the examples of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of The Qt Company Ltd nor the names of its -** contributors may be used to endorse or promote products derived -** from this software without specific prior written permission. -** -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 2.6 -import ClusterDemo 1.0 - -Item { - property real batterymeterNeedleRotation: -batteryValue * batteryDegreesPerValue - property real batteryValue: ValueSource.batteryLevel - property real maxValueAngle: 317 - property real minValueAngle: 225 - property real maximumValue: 100 - property real batteryDegreesPerValue: Math.abs((maxValueAngle - minValueAngle) / maximumValue) - - anchors.right: parent.right - anchors.top: parent.top - anchors.rightMargin: 436 - anchors.topMargin: 93 - width: 108 - height: 7 - rotation: batterymeterNeedleRotation - 135 - - Image { - width: 36 - height: 3 - //opacity: 0.75 - anchors.left: parent.left - anchors.verticalCenter: parent.verticalCenter - source: "image://etc/SpeedometerNeedle.png" - } - Behavior on batteryValue { - enabled: !ValueSource.runningInDesigner && !ValueSource.automaticDemoMode && startupAnimationsFinished - PropertyAnimation { duration: 250 } - } -} diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/ConsumptionMeter.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/ConsumptionMeter.qml index 23a25a6e3..b25110efd 100644 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/ConsumptionMeter.qml +++ b/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/ConsumptionMeter.qml @@ -62,7 +62,7 @@ Item { numVertices: 32 radius: 155 fillWidth: 20 - color: ValueSource.rpm < 4000 ? "green" : "#EF2973" + color: ValueSource.rpm < 4000 ? "#0098c3" : "#a31e21" opacity: 0.3 minAngle: consumtionMeter.minValueAngle maxAngle: consumtionMeter.maxValueAngle diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/TachoMeter.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/LargeMeter.qml index c6dc1bf55..b9d001287 100644 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/TachoMeter.qml +++ b/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/LargeMeter.qml @@ -42,72 +42,82 @@ import QtQuick 2.6 import ClusterDemo 1.0 Item { - id: tachometer + width: 480 + height: 480 - property real tachometerNeedleRotation: 0.0 - property string rpm: actualRPM.toFixed().toString() + id: speedometer - property bool animationStoped: ValueSource.runningInDesigner ? true : startupAnimationsFinished + property real speedometerNeedleRotation: 0.0 - property real actualRPM: animationStoped - ? ValueSource.rpm : -tachometerNeedleRotation + property bool animationStopped: ValueSource.runningInDesigner ? true : startupAnimationsFinished + + property real actualValue: 20 property real minValueAngle: 55 - property real maxValueAngle: 255 - property real minimumRPM: 0 - property real maximumRPM: 8000 + property real maxValueAngle: 305 + property real minimumValue: 0 + property real maximumValue: 200 - Item { - anchors.right: parent.right - anchors.rightMargin: 20 - width: 480 - height: 480 - - GaugeFiller { - id: rpmFiller - value: tachometer.actualRPM - anchors.right: parent.right - anchors.top: parent.top - anchors.topMargin: 246 - anchors.rightMargin: 253 - numVertices: 64 - radius: 155 - fillWidth: 5 - color: tachometer.actualRPM < 4000 ? "green" : "#EF2973" - opacity: 0.6 - minAngle: tachometer.minValueAngle - maxAngle: tachometer.maxValueAngle - minValue: tachometer.minimumRPM - maxValue: tachometer.maximumRPM + property real limitValue: 100 + + property real angleOffset: 35 + + GaugeFiller { + anchors.fill: parent + id: speedFiller + value: speedometer.actualValue + numVertices: 64 + radius: 155 + fillWidth: 5 + color: speedometer.actualValue < speedometer.limitValue ? "#0098c3" : "#a31e21" + opacity: 0.6 + minAngle: speedometer.minValueAngle + maxAngle: speedometer.maxValueAngle + minValue: speedometer.minimumValue + maxValue: speedometer.maximumValue + + Behavior on color { + ColorAnimation { + duration: 1000 + } } } + Item { - id: tachometerNeedle - width: 312 + id: speedometerNeedle + width: 309 height: 7 - rotation: rpmFiller.angle - 35 - x: 854 - y: 242 + rotation: speedFiller.angle - speedometer.angleOffset + + anchors.centerIn: parent - Image { - opacity: 0.75 - width: 98 + Item { + width: 97 height: 7 anchors.left: parent.left - anchors.leftMargin: 2 anchors.verticalCenter: parent.verticalCenter - source: tachometer.actualRPM < 4000 ? "image://etc/SpeedometerNeedleGreen.png" : "image://etc/SpeedometerNeedle.png" - } - } + Image { + anchors.fill: parent + source: "image://etc/SpeedometerNeedleGreen.png" + opacity: speedometer.actualValue < speedometer.limitValue ? 0.75 : 0 + Behavior on opacity { + NumberAnimation { + duration: 1000 + } + } + } + Image { + opacity: speedometer.actualValue < speedometer.limitValue ? 0 : 0.75 + anchors.fill: parent + source: "image://etc/SpeedometerNeedle.png" + Behavior on opacity { + NumberAnimation { + duration: 1000 + } + } + } - Text { - id: textEco - anchors.top: tachometerNeedle.top - anchors.topMargin: -7 - anchors.horizontalCenter: tachometerNeedle.horizontalCenter - text: tachometer.actualRPM > 4000 ? "POWER" : "ECO" - font.pixelSize: 18 - color: tachometer.actualRPM <= 4000 ? "white" : "red" + } } } diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/FuelMeter.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/SmallMeter.qml index b6569c6d6..2c086cd35 100644 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/FuelMeter.qml +++ b/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/SmallMeter.qml @@ -42,31 +42,45 @@ import QtQuick 2.6 import ClusterDemo 1.0 Item { - property real fuelmeterNeedleRotation: fuelValue * fuelDegreesPerValue - property real fuelValue: ValueSource.fuelLevel + id: meter + width: 100 + height: 100 + + property real meterNeedleRotation: direction * value * degreesPerValue + //property real fuelValue: ValueSource.fuelLevel + property real value: 20 property real maxValueAngle: 170 property real minValueAngle: 10 property real maximumValue: 100 - property real fuelDegreesPerValue: Math.abs((maxValueAngle - minValueAngle) / maximumValue) + property real degreesPerValue: Math.abs((maxValueAngle - minValueAngle) / maximumValue) + + property real rotationOffset: 80 + + property real direction: 1 + + + Item { + + + + width: 100 + height: 100 + + rotation: meter.meterNeedleRotation - meter.rotationOffset + + Image { + width: 37 + height: 3 + //opacity: 0.75 + anchors.left: parent.left + anchors.verticalCenter: parent.verticalCenter + source: "image://etc/SpeedometerNeedle.png" - anchors.right: parent.right - anchors.top: parent.top - anchors.rightMargin: 436 - anchors.topMargin: 93 - width: 105 - height: 7 - rotation: fuelmeterNeedleRotation - 80 + } - Image { - width: 37 - height: 3 - //opacity: 0.75 - anchors.left: parent.left - anchors.verticalCenter: parent.verticalCenter - source: "image://etc/SpeedometerNeedle.png" } - Behavior on fuelValue { + Behavior on value { enabled: !ValueSource.automaticDemoMode && startupAnimationsFinished PropertyAnimation { duration: 250 } } diff --git a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/SpeedoMeter.qml b/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/SpeedoMeter.qml deleted file mode 100644 index 23f11c43c..000000000 --- a/doc/src/snippets/qtcluster/qml/dash_hybrid/gauges/SpeedoMeter.qml +++ /dev/null @@ -1,157 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2015 The Qt Company Ltd. -** Contact: http://www.qt.io/licensing/ -** -** This file is part of the examples of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of The Qt Company Ltd nor the names of its -** contributors may be used to endorse or promote products derived -** from this software without specific prior written permission. -** -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 2.6 -import ClusterDemo 1.0 - -Item { - - id: speedometer - - property real speedometerNeedleRotation: 0.0 - property string speed: actualSpeed.toFixed().toString() - - property bool animationStopped: ValueSource.runningInDesigner ? true : startupAnimationsFinished - - property real actualSpeed: animationStopped - ? ValueSource.kph : -speedometerNeedleRotation - - property real minValueAngle: 55 - property real maxValueAngle: 305 - property real minimumSpeed: 0 - property real maximumSpeed: 200 - - Item { - anchors.left: parent.left - anchors.leftMargin: 20 - width: 480 - height: 480 - - GaugeFiller { - id: speedFiller - value: speedometer.actualSpeed - anchors.left: parent.left - anchors.top: parent.top - anchors.topMargin: 244 - anchors.leftMargin: 255 - numVertices: 64 - radius: 155 - fillWidth: 5 - color: speedometer.actualSpeed < 100 ? "green" : "#EF2973" - opacity: 0.6 - minAngle: speedometer.minValueAngle - maxAngle: speedometer.maxValueAngle - minValue: speedometer.minimumSpeed - maxValue: speedometer.maximumSpeed - } - } - - Item { - id: speedometerNeedle - width: 309 - height: 7 - rotation: speedFiller.angle - 35 - - x: 121 - y: 243 - - Image { - opacity: 0.75 - width: 97 - height: 7 - anchors.left: parent.left - anchors.verticalCenter: parent.verticalCenter - source: speedometer.actualSpeed < 100 ? "image://etc/SpeedometerNeedleGreen.png" : "image://etc/SpeedometerNeedle.png" - } - } - - Row { - anchors.top: speedometerNeedle.bottom - anchors.topMargin: 80 - anchors.horizontalCenter: speedometerNeedle.horizontalCenter - spacing: 7 - - Text { - font.pixelSize: 18 - color:(ValueSource.gear === 0 && ValueSource.parkingBrake) ? "white" : "gray" - text: "P" - } - - Text { - font.pixelSize: 18 - //font.bold: ValueSource.gear === -1 - color: ValueSource.gear === -1 ? "white" : "gray" - text: "R" - } - - Text { - font.pixelSize: 18 - //font.bold: ValueSource.gear === 0 - color: (ValueSource.gear === 0 && !ValueSource.parkingBrake) ? "white" : "gray" - text: "N" - } - - Text { - font.pixelSize: 18 - //font.bold: ValueSource.gear === 1 - color: ValueSource.gear === 1 ? "white" : "gray" - text: "D" - } - } - - Text { - id: speedText - anchors.top: speedometerNeedle.top - anchors.topMargin: -27 - anchors.horizontalCenter: speedometerNeedle.horizontalCenter - font.pixelSize: 40 - color: "lightGray" - text: speedometer.speed - } - - Text { - id: speedUnitText - anchors.top: speedText.bottom - anchors.horizontalCenter: speedometerNeedle.horizontalCenter - font.pixelSize: 18 - color: "lightGray" - text: "KM/H" - } -} |