C

Qt Quick Ultralite perspective_transforms Example

/****************************************************************************** ** ** 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.12 import Constants 1.0 import "controls" Rectangle { id: root width: 800 height: 480 color: Constants.backgroundColor IdleTimer { id: idleTimer property int coverDir: 1 onSwitchCover: { var idx = Math.round(currentState.selectedCover) idx = idx + coverDir if (idx >= (currentState.numberOfCovers-1) || idx <= 0) { coverDir = -coverDir } currentState.selectedCover = idx slider_cover.value = idx } onSwitchFlowType: { currentState.switchViewType((currentState.currentViewType + 1) % CoverFlowType.NumTypes) } } CoverFlowState { id: currentState screenWidth: root.width screenHeight: root.height } CoverFlow { anchors.fill: parent currentState: currentState } // Cover Flow Type switch controls Column { anchors{ horizontalCenter: parent.horizontalCenter top: parent.top topMargin: 20 } width: parent.width * 0.9 Row { spacing: parent.width > 500 ? parent.width / 25 : 0 anchors.horizontalCenter: parent.horizontalCenter RadioButton { text: "Carousel" checked: currentState.currentViewType == CoverFlowType.Carousel onClicked: { currentState.switchViewType(CoverFlowType.Carousel) } onPressedChanged: { idleTimer.reset(pressed) } } RadioButton { text: "Circle" checked: currentState.currentViewType == CoverFlowType.Circle onClicked: { currentState.switchViewType(CoverFlowType.Circle) } onPressedChanged: { idleTimer.reset(pressed) } } RadioButton { text: "Circle 2D" checked: currentState.currentViewType == CoverFlowType.Circle2D onClicked: { currentState.switchViewType(CoverFlowType.Circle2D) } onPressedChanged: { idleTimer.reset(pressed) } } RadioButton { text: "Perspective" checked: currentState.currentViewType == CoverFlowType.Perspective onClicked: { currentState.switchViewType(CoverFlowType.Perspective) } onPressedChanged: { idleTimer.reset(pressed) } } } } // Cover + camera control slider Column { anchors{ horizontalCenter: parent.horizontalCenter bottom: parent.bottom bottomMargin: 20 } width: parent.width * 0.9 spacing: 20 Row { spacing: 80 width: parent.width Slider { id: slider_cover width: (parent.width - parent.spacing) / 2 value: 0 stepSize: 1 to: currentState.numberOfCovers-1 text: "Current cover: " + (value+1) onValueChanged: { currentState.selectedCover = slider_cover.value } onPressedChanged: { idleTimer.reset(pressed) } } Slider { id: slider_modelSize width: (parent.width - parent.spacing) / 2 value: 4 stepSize: 1 to: currentState.maximumNumberofCovers - 1 text: "Number of covers: " + (value + 1) onValueChanged: { currentState.numberOfCovers = (slider_modelSize.value + 1) } } } Row { spacing: 40 width: parent.width Slider { id: slider_height value: 0.5 width: (parent.width - parent.spacing) / 3 text: "Camera Height" enabled: currentState.currentViewType != CoverFlowType.Perspective onValueChanged: { currentState.cameraHeight = -1.2 + 2 * (slider_height.value - 0.5) } onPressedChanged: { idleTimer.reset(pressed) } } Slider { id: slider_viewAngle value: 0.5 text: "View Angle" width: (parent.width - parent.spacing) / 3 enabled: currentState.currentViewType != CoverFlowType.Perspective onValueChanged: { currentState.viewAngle = -21 + 30 * (slider_viewAngle.value - 0.5) } onPressedChanged: { idleTimer.reset(pressed) } } CheckBox { id: checkbox_reflection text: "Show reflections" width: (parent.width - parent.spacing) / 3 checked: true onCheckedChanged: { currentState.showReflection = checkbox_reflection.checked } } } } }