C

Qt Quick Ultralite Motorcycle Cluster Demo

/****************************************************************************** ** ** Copyright (C) 2020 The Qt Company Ltd. ** Contact: https://www.qt.io/licensing/ ** ** This file is part of the Qt Quick Ultralite module. ** ** $QT_BEGIN_LICENSE:COMM$ ** ** Commercial License Usage ** Licensees holding valid commercial Qt licenses may use this file in ** accordance with the commercial license agreement provided with the ** Software or, alternatively, in accordance with the terms contained in ** a written agreement between you and The Qt Company. For licensing terms ** and conditions see http://www.qt.io/terms-conditions. For further ** information use the contact form at http://www.qt.io/contact-us. ** ** $QT_END_LICENSE$ ** ******************************************************************************/
import QtQuick 2.0 Rectangle { id: root width: Math.max(text.width + 30 + Math.round(text.width) % 2, 128) height: 42 radius: 21 property alias text: text.text property color textColor property color textColorPrime property alias insideColor: recInside.color property real insideOpacity Behavior on opacity { NumberAnimation { duration: 500 } } function setActive() { activeAniamtion.start() } property bool pushed: false SequentialAnimation { id: activeAniamtion alwaysRunToEnd: true ScriptAction { script: pushed = true } PauseAnimation { duration: 300 } ScriptAction { script: pushed = false } } Rectangle { id: recInside width: root.width - 4 height: 38 radius: 19 Behavior on color { NumberAnimation { duration: 300 } } opacity: pushed ? 1 - insideOpacity : insideOpacity Behavior on opacity { NumberAnimation { duration: 300 } } anchors.centerIn: parent anchors.horizontalCenterOffset: 0 } Text { id: text anchors.centerIn: parent font.pixelSize: 28 font.family: "Barlow-mono" color: pushed ? textColorPrime : textColor } }