C
Qt Quick Ultralite instrument_cluster Example
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial
import QtQuick 2.15
Rectangle {
color: "#00414A"
Text {
id: speedometer
color: "#2CDE85"
anchors.centerIn: parent
font.weight: Font.DemiBold
font.pixelSize: 90
text: VehicleStatus.speed
}
Text {
color: "#28C878"
anchors.horizontalCenter: speedometer.horizontalCenter
anchors.bottom: speedometer.top
anchors.bottomMargin: -36
font.weight: Font.Light
font.pixelSize: 22
text: "km/h"
}
Text {
id: leftBlinker
opacity: 0.0
color: "#2CDE85"
anchors.top: parent.top
anchors.left: parent.left
anchors.topMargin: 20
anchors.leftMargin: 40
font.weight: Font.DemiBold
font.pixelSize: 60
text: "⇦"
Behavior on opacity { NumberAnimation { duration: 500; easing.type: Easing.InCubic } }
}
Text {
id: rightBlinker
opacity: 0.0
color: "#2CDE85"
anchors.top: parent.top
anchors.right: parent.right
anchors.topMargin: 20
anchors.rightMargin: 40
font.weight: Font.DemiBold
font.pixelSize: 60
text: "⇨"
Behavior on opacity { NumberAnimation { duration: 500; easing.type: Easing.InCubic } }
}
Text {
id: tripMeter
color: "#2CDE85"
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: parent.bottom
anchors.bottomMargin: 5
font.weight: Font.DemiBold
font.pixelSize: 24
text: VehicleStatus.tripMeter.toFixed(1) + " km"
}
Text {
color: "#28C878"
anchors.horizontalCenter: speedometer.horizontalCenter
anchors.bottom: tripMeter.top
anchors.bottomMargin: -6
font.weight: Font.Light
font.pixelSize: 22
text: "Trip"
}
VehicleStatus.onLeftBlinkerStateChange: {
leftBlinker.opacity = leftBlinkerState ? 1.0 : 0.0
}
VehicleStatus.onRightBlinkerStateChange: {
rightBlinker.opacity = rightBlinkerState ? 1.0 : 0.0
}
}