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 } }