C

Qt Quick Ultralite swipegame Demo

/****************************************************************************** ** ** Copyright (C) 2021 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 import StyleModule 1.0 /* This component provides a switch with a label next to it. */ Item { id: root // NOTE: overwrite the Style value assignments if you want to use the component outside of this project property alias font: label.font property color textColor: Style.colorText property color backgroundBorderColor: Style.colorLines property int borderWidth: Style.lineSize property color backgroundColor: checked ? Style.colorHighlight : Style.colorPageBackground property color handleBorderColor: Style.colorText property color handleColor: switchArea.pressed ? Style.colorHighlight : Style.colorPageBackground property int radius: Style.buttonRadius property int handleAnimationDuration: Style.animationDuration property bool checked: false property alias text: label.text signal triggered() implicitHeight: Style.buttonHeight implicitWidth: Math.max(height * 2, label.width + Style.buttonTextMargins + switchArea.width) Text { id: label anchors { left: parent.left verticalCenter: parent.verticalCenter } color: root.textColor text: "Label" } MouseArea { id: switchArea anchors { right: parent.right top: parent.top bottom: parent.bottom } width: height * 2 onClicked: root.triggered() Rectangle { id: switchBackground anchors.fill: parent radius: root.radius color: root.backgroundBorderColor Rectangle { anchors { fill: parent margins: root.borderWidth } radius: root.radius color: root.backgroundColor } } Rectangle { id: switchHandle anchors { top: parent.top bottom: parent.bottom } width: height x: root.checked ? parent.width - width : 0 radius: root.radius color: root.handleBorderColor Behavior on x { NumberAnimation { duration: root.handleAnimationDuration } } Rectangle { anchors { fill: parent margins: root.borderWidth } radius: root.radius color: root.handleColor } } } }