Qt Quick 3D - Reflection Probes Example

 // Copyright (C) 2021 The Qt Company Ltd.
 // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause

 import QtQuick
 import QtQuick.Controls

 Item {
     id: root
     width: settingsDrawer.width
     height: parent.height

     property int timeSlicingIndex: timeSlicingComboBox.currentIndex
     property int refreshModeIndex: refreshModeComboBox.currentIndex
     property int qualityIndex: qualityComboBox.currentIndex
     property vector3d probeSize: Qt.vector3d(probeSizeXSlider.value, probeSizeYSlider.value, probeSizeZSlider.value)
     property vector3d probePosition: Qt.vector3d(probePositionXSlider.value, probePositionYSlider.value, probePositionZSlider.value)
     property bool probeParallaxCorrection: parallaxCheckBox.checked
     property real sphereRoughness: materialRoughnessSlider.value
     property bool sphereReceivesReflection: sphereReceivesReflectionsCheckBox.checked
     property bool floorReceivesReflection: floorReceivesReflectionsCheckBox.checked
     property bool spriteParticlesEnabled: particleSystemSpriteCheckBox.checked
     property bool modelParticlesEnabled: particleSystemModelCheckBox.checked

     property real iconSize: 50

     Button {
         x: settingsDrawer.visible ? (settingsDrawer.x + settingsDrawer.width) : 0
         anchors.top: parent.top
         width: root.iconSize
         height: width
         icon.width: width * 0.3
         icon.height: height * 0.3
         icon.source: "res/icon_settings.png"
         icon.color: "transparent"
         background: Rectangle {
             color: "transparent"
         }
         onClicked: {
             settingsDrawer.visible = !settingsDrawer.visible;
         }
     }

     Drawer {
         id: settingsDrawer
         edge: Qt.LeftEdge
         interactive: false
         modal: false

         enter: Transition {
             NumberAnimation {
                 property: "position"
                 to: 1.0
                 duration: 400
                 easing.type: Easing.InOutQuad
             }
         }

         exit: Transition {
             NumberAnimation {
                 property: "position"
                 to: 0.0
                 duration: 400
                 easing.type: Easing.InOutQuad
             }
         }

         ScrollView {
             anchors.fill: parent
             ScrollBar.vertical.policy: ScrollBar.AlwaysOn
             padding: 10
             background: Rectangle {
                 color: "white"
             }

             Flickable {
                 clip: true
                 contentWidth: settingsArea.width
                 contentHeight: settingsArea.height

                 Column {
                     id: settingsArea
                     spacing: 5

                     Text {
                         anchors.horizontalCenter: parent.horizontalCenter
                         text: "Reflection Map"
                         font.pixelSize: 14
                     }

                     Item { width: 1; height: 10 }

                     Text {
                         text: "Time Slicing"
                     }

                     ComboBox {
                         id: timeSlicingComboBox
                         width: 200
                         model: [ "None", "All Faces At Once", "Individual Faces" ]
                     }

                     Text {
                         text: "Refresh Mode"
                     }

                     ComboBox {
                         id: refreshModeComboBox
                         width: 200
                         model: [ "Every Frame", "First Frame" ]
                     }

                     Text {
                         text: "Reflection Map Quality"
                     }

                     ComboBox {
                         id: qualityComboBox
                         width: 200
                         model: [ "Very Low", "Low", "Medium", "High", "Very High" ]
                     }

                     Item { width: 1; height: 10 }

                     Text {
                         anchors.horizontalCenter: parent.horizontalCenter
                         text: "Floor Reflection Probe"
                         font.pixelSize: 14
                     }

                     Item { width: 1; height: 10 }

                     CheckBox {
                         id: parallaxCheckBox
                         checked: true
                         text: qsTr("Parallax Correction")
                     }

                     Text {
                         text: "Box Size (" + probeSizeXSlider.value + ", " + probeSizeYSlider.value + ", " + probeSizeZSlider.value + ")"
                     }

                     Slider {
                         id: probeSizeXSlider
                         from: 0
                         value: 1000
                         to: 1000
                         stepSize: 1
                     }

                     Slider {
                         id: probeSizeYSlider
                         from: 0
                         value: 950
                         to: 1000
                         stepSize: 1
                     }

                     Slider {
                         id: probeSizeZSlider
                         from: 0
                         value: 650
                         to: 1000
                         stepSize: 1
                     }

                     Text {
                         text: "Position (" + probePositionXSlider.value + ", " + probePositionYSlider.value + ", " + probePositionZSlider.value + ")"
                     }

                     Slider {
                         id: probePositionXSlider
                         from: 0
                         value: 0
                         to: 500
                         stepSize: 1
                     }

                     Slider {
                         id: probePositionYSlider
                         from: 0
                         value: 0
                         to: 500
                         stepSize: 1
                     }

                     Slider {
                         id: probePositionZSlider
                         from: 0
                         value: 0
                         to: 500
                         stepSize: 1
                     }

                     Item { width: 1; height: 10 }

                     Text {
                         anchors.horizontalCenter: parent.horizontalCenter
                         text: "Particles"
                         font.pixelSize: 14
                     }

                     CheckBox {
                         id: particleSystemSpriteCheckBox
                         checked: false
                         text: qsTr("Sprite Particles")
                     }

                     CheckBox {
                         id: particleSystemModelCheckBox
                         checked: false
                         text: qsTr("Model Particles")
                     }

                     Item { width: 1; height: 10 }

                     Text {
                         anchors.horizontalCenter: parent.horizontalCenter
                         text: "Model"
                         font.pixelSize: 14
                     }

                     Item { width: 1; height: 10 }

                     Text {
                         text: "Sphere Roughness : " + materialRoughnessSlider.value.toFixed(2);
                     }

                     Slider {
                         id: materialRoughnessSlider
                         from: 0
                         to: 1.0
                         value: 0.1
                     }

                     CheckBox {
                         id: sphereReceivesReflectionsCheckBox
                         checked: true
                         text: qsTr("Sphere receives reflections")
                     }

                     CheckBox {
                         id: floorReceivesReflectionsCheckBox
                         checked: true
                         text: qsTr("Floor receives reflections")
                     }
                 }
             }
         }
     }
 }