summaryrefslogtreecommitdiff
path: root/examples/demos/robotarm/content/MainScreen.ui.qml
diff options
context:
space:
mode:
Diffstat (limited to 'examples/demos/robotarm/content/MainScreen.ui.qml')
-rw-r--r--examples/demos/robotarm/content/MainScreen.ui.qml389
1 files changed, 389 insertions, 0 deletions
diff --git a/examples/demos/robotarm/content/MainScreen.ui.qml b/examples/demos/robotarm/content/MainScreen.ui.qml
new file mode 100644
index 00000000..1af531e3
--- /dev/null
+++ b/examples/demos/robotarm/content/MainScreen.ui.qml
@@ -0,0 +1,389 @@
+// Copyright (C) 2022 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+import QtQuick3D
+import QtQuick.Controls.Material
+import QtQuick.Controls
+import QtQuick.Layouts
+import RobotArm
+import Backend
+import QtQml
+
+Pane {
+ id: root
+ Material.theme: darkModeToggle.checked ? Material.Dark : Material.Light
+
+ readonly property bool mobile: Qt.platform.os === "android"
+ readonly property bool horizontal: width > height
+ property real sliderWidth: width * 0.15
+ property real buttonRowWidth: width * 0.12
+ property real buttonMinWidth: 65
+
+ leftPadding: 60
+ rightPadding: 60
+ topPadding: 50
+ bottomPadding: 50
+
+ width: 800
+ height: 600
+ state: "mobileHorizontal"
+
+ Backend {
+ id: backend
+ rotation1Angle: rotation1Slider.value
+ rotation2Angle: rotation2Slider.value
+ rotation3Angle: rotation3Slider.value
+ rotation4Angle: rotation4Slider.value
+ clawsAngle: clawToggle.checked ? 0 : 90
+ }
+
+ Toggle {
+ id: darkModeToggle
+ text: qsTr("Dark mode")
+ anchors.top: parent.top
+ }
+
+ ColumnLayout {
+ id: slidersColumn
+ spacing: 6
+ anchors.bottom: parent.bottom
+
+ LabeledSlider {
+ id: rotation1Slider
+ Layout.preferredWidth: root.sliderWidth
+ Layout.minimumWidth: 160
+ labelText: "Rotation 1"
+ from: -90
+ to: 90
+ value: 60
+ }
+
+ LabeledSlider {
+ id: rotation2Slider
+ Layout.preferredWidth: root.sliderWidth
+ Layout.minimumWidth: 160
+ labelText: "Rotation 2"
+ from: -135
+ to: 135
+ value: 45
+ }
+
+ LabeledSlider {
+ id: rotation3Slider
+ Layout.preferredWidth: root.sliderWidth
+ Layout.minimumWidth: 160
+ labelText: "Rotation 3"
+ from: -90
+ to: 90
+ value: 45
+ }
+
+ LabeledSlider {
+ id: rotation4Slider
+ Layout.preferredWidth: root.sliderWidth
+ Layout.minimumWidth: 160
+ labelText: "Rotation 4"
+ from: -180
+ to: 180
+ }
+ }
+
+ Toggle {
+ id: clawToggle
+ text: qsTr("Claw")
+ anchors.bottom: slidersColumn.top
+ anchors.bottomMargin: 30
+ }
+
+ GridLayout {
+ id: buttonsRow
+ columns: 2
+ rows: 2
+ columnSpacing: 16
+ rowSpacing: 8
+ anchors.bottom: clawToggle.top
+ anchors.bottomMargin: 30
+
+ Button {
+ id: pose1
+ text: qsTr("Pose 1")
+ Layout.preferredWidth: root.buttonRowWidth / 2
+ Layout.minimumWidth: root.buttonMinWidth
+ Layout.preferredHeight: 45
+
+ Connections {
+ target: pose1
+ onClicked: {
+ rotation1Slider.value = 30
+ rotation2Slider.value = 60
+ rotation3Slider.value = 90
+ rotation4Slider.value = 145
+ }
+ }
+ }
+
+ Button {
+ id: pose2
+ text: qsTr("Pose 2")
+ Layout.preferredWidth: root.buttonRowWidth / 2
+ Layout.minimumWidth: root.buttonMinWidth
+ Layout.preferredHeight: 45
+
+ Connections {
+ target: pose2
+ onClicked: {
+ rotation1Slider.value = 60
+ rotation2Slider.value = 45
+ rotation3Slider.value = 45
+ rotation4Slider.value = 60
+ }
+ }
+ }
+
+ Button {
+ id: pose3
+ text: qsTr("Pose 3")
+ Layout.preferredWidth: root.buttonRowWidth / 2
+ Layout.minimumWidth: root.buttonMinWidth
+ Layout.preferredHeight: 45
+
+ Connections {
+ target: pose3
+ onClicked: {
+ rotation1Slider.value = -90
+ rotation2Slider.value = -60
+ rotation3Slider.value = -45
+ rotation4Slider.value = -180
+ }
+ }
+ }
+
+ Button {
+ id: resetPose
+ text: qsTr("Reset")
+ Layout.preferredWidth: root.buttonRowWidth / 2
+ Layout.minimumWidth: root.buttonMinWidth
+ Layout.preferredHeight: 45
+
+ Connections {
+ target: resetPose
+ onClicked: {
+ rotation1Slider.value = 0
+ rotation2Slider.value = 0
+ rotation3Slider.value = 0
+ rotation4Slider.value = 0
+ clawToggle.checked = false
+ }
+ }
+ }
+ }
+
+ View3D {
+ anchors.fill: parent
+
+ camera: camera
+ Node {
+ id: scene
+
+ PointLight {
+ x: 760
+ z: 770
+ quadraticFade: 0
+ brightness: 1
+ }
+
+ DirectionalLight {
+ eulerRotation.z: 30
+ eulerRotation.y: -165
+ }
+
+ DirectionalLight {
+ y: 1000
+ brightness: 0.4
+ eulerRotation.z: -180
+ eulerRotation.y: 90
+ eulerRotation.x: -90
+ }
+
+ PerspectiveCamera {
+ id: camera
+ x: 1050
+ y: 375
+ z: -40
+ pivot.x: 200
+ eulerRotation.y: 85
+ }
+ RoboticArm {
+ id: roboArm
+ rotation1: backend.rotation1Angle
+ rotation2: backend.rotation2Angle
+ rotation3: backend.rotation3Angle
+ rotation4: backend.rotation4Angle
+ clawsAngle: backend.clawsAngle
+ }
+ }
+
+ NodeIndicator {
+ scenePosition: roboArm.hand_position
+ isFocused: clawToggle.hasFocus
+ label: clawToggle.text
+ size: 30
+ }
+
+ NodeIndicator {
+ scenePosition: roboArm.hand_hinge_position
+ isFocused: rotation1Slider.activeFocus
+ label: rotation1Slider.labelText
+ size: 40
+ }
+
+ NodeIndicator {
+ scenePosition: roboArm.arm_position
+ isFocused: rotation2Slider.activeFocus
+ label: rotation2Slider.labelText
+ size: 50
+ }
+
+ NodeIndicator {
+ scenePosition: roboArm.forearm_position
+ isFocused: rotation3Slider.activeFocus
+ label: rotation3Slider.labelText
+ size: 60
+ }
+
+ NodeIndicator {
+ scenePosition: roboArm.root_position
+ isFocused: rotation4Slider.activeFocus
+ label: rotation4Slider.labelText
+ size: 60
+ }
+
+ environment: sceneEnvironment
+
+ SceneEnvironment {
+ id: sceneEnvironment
+ antialiasingQuality: SceneEnvironment.VeryHigh
+ antialiasingMode: SceneEnvironment.MSAA
+ }
+ }
+
+ Label {
+ id: robotStatus
+ text: backend.status
+ anchors.top: parent.top
+ font.italic: true
+ anchors.horizontalCenter: parent.horizontalCenter
+ anchors.topMargin: 15
+ }
+
+ states: [
+ State {
+ name: "mobileHorizontal"
+ when: root.mobile && root.horizontal
+
+ PropertyChanges {
+ target: root
+ leftPadding: 45
+ topPadding: 15
+ bottomPadding: 0
+ sliderWidth: width * 0.4
+ buttonRowWidth: width * 0.2
+ buttonMinWidth: 75
+ }
+
+ PropertyChanges {
+ target: roboArm
+ z: -200
+ }
+ },
+ State {
+ name: "desktopVertical"
+ when: !root.mobile && !root.horizontal
+
+ PropertyChanges {
+ target: root
+ sliderWidth: width * 0.4
+ buttonRowWidth: width * 0.2
+ bottomPadding: 20
+ }
+ AnchorChanges {
+ target: slidersColumn
+ anchors.right: parent.right
+ }
+ PropertyChanges {
+ target: slidersColumn
+ anchors.rightMargin: 20
+ }
+
+ AnchorChanges {
+ target: buttonsRow
+ anchors.bottom: undefined
+ anchors.top: slidersColumn.top
+ }
+
+ AnchorChanges {
+ target: clawToggle
+ anchors.bottom: undefined
+ anchors.top: buttonsRow.bottom
+ }
+
+ PropertyChanges {
+ target: roboArm
+ scale.x: 0.7
+ scale.y: 0.7
+ scale.z: 0.7
+ y: 250
+ z: 150
+ }
+ },
+ State {
+ name: "mobileVertical"
+ when: root.mobile && !root.horizontal
+
+ PropertyChanges {
+ target: root
+ sliderWidth: width * 0.85
+ topPadding: 15
+ leftPadding: 45
+ bottomPadding: 0
+ buttonRowWidth: width * 0.2
+ buttonMinWidth: 75
+ }
+
+ AnchorChanges {
+ target: slidersColumn
+ anchors.left: undefined
+ anchors.horizontalCenter: parent.horizontalCenter
+ }
+
+ AnchorChanges {
+ target: clawToggle
+ anchors.left: undefined
+ anchors.right: slidersColumn.right
+ }
+
+ AnchorChanges {
+ target: buttonsRow
+ anchors.bottom: slidersColumn.top
+ anchors.left: slidersColumn.left
+ }
+
+ PropertyChanges {
+ target: roboArm
+ scale.x: 0.7
+ scale.y: 0.7
+ scale.z: 0.7
+ y: 280
+ z: 100
+ }
+ }
+ ]
+
+ transitions: Transition {
+ PropertyAnimation {
+ properties: "sliderWidth, scale.x, scale.y, scale.z, y, z"
+ }
+ AnchorAnimation {}
+ }
+}