- Qt 6.7
- Qt Quick 3D
- Qt Quick 3D Examples and Tutorials
- Qt Quick 3D - Antialiasing Example
- Qt Quick 3D | Commercial or GPLv3

# Qt Quick 3D - Antialiasing Example

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

     import QtQuick
     import QtQuick3D
     import QtQuick3D.Helpers
     import QtQuick.Controls
     import QtQuick.Layouts

     ApplicationWindow {
         id: window
         visible: true
         width: 800
         height: 600
         title: qsTr("Quick3D Antialiasing Example")

         property bool isLandscape: width > height

         View3D {
             id: view3D
             property real animationValue: 0.0
             anchors.bottom: parent.bottom
             anchors.right: parent.right
             anchors.left: window.isLandscape ? settingsPane.right : parent.left
             anchors.top: window.isLandscape ? parent.top : settingsPane.bottom

             SequentialAnimation {
                 id: modelAnimation
                 running: false
                 NumberAnimation {
                     target: view3D
                     property: "animationValue"
                     from: 0.0
                     to: 1.0
                     duration: 1000
                     easing.type: Easing.InOutQuad
                 }
                 NumberAnimation {
                     target: view3D
                     property: "animationValue"
                     from: 1.0
                     to: 0.0
                     duration: 1000
                     easing.type: Easing.InOutQuad
                 }
             }

             PerspectiveCamera {
                 z: 500
             }

             DirectionalLight {
                 eulerRotation.x: -30
             }
             environment: SceneEnvironment {
                 id: sceneEnvironment
                 clearColor: "#002b36"
                 backgroundMode: SceneEnvironment.Color

                 antialiasingMode: modeButton1.checked ? SceneEnvironment.NoAA : modeButton2.checked
                                                         ? SceneEnvironment.SSAA : modeButton3.checked
                                                           ? SceneEnvironment.MSAA : SceneEnvironment.ProgressiveAA

                 antialiasingQuality: qualityButton1.checked ? SceneEnvironment.Medium : qualityButton2.checked
                                                               ? SceneEnvironment.High : SceneEnvironment.VeryHigh
                 temporalAAEnabled: temporalModeButton.checked
                 temporalAAStrength: temporalStrengthSlider.value
             }

             Node {
                 id: scene
                 x: -80

                 Model {
                     source: "#Cube"
                     eulerRotation.y: 45
                     eulerRotation.x: 30 + view3D.animationValue * 100
                     scale: Qt.vector3d(2, 2, 2)
                     materials: DefaultMaterial {
                         diffuseColor: "#4aee45"
                     }
                 }

                 Model {
                     source: "#Cube"
                     x: 200
                     y: 150 + view3D.animationValue * 10
                     eulerRotation.y: 5
                     eulerRotation.x: 5
                     scale: Qt.vector3d(0.5, 0.5, 0.5)
                     materials: DefaultMaterial {
                         diffuseColor: "#faee45"
                     }
                 }

                 Model {
                     source: "#Sphere"
                     x: 120
                     y: -40
                     z: 160 + view3D.animationValue * 40
                     scale: Qt.vector3d(1.5, 1.5, 1.5)
                     materials: DefaultMaterial {
                         diffuseColor: Qt.rgba(0.8, 0.8, 0.8, 1.0)
                     }
                 }
             }
         }

         Pane {
             id: settingsPane
             width: window.isLandscape ? implicitWidth : window.width
             height: window.isLandscape ? window.height : window.height * 0.33
             ScrollView {
                 anchors.fill: parent
                 ColumnLayout {
                     id: settingsArea
                     GroupBox {
                         title: qsTr("Antialiasing Mode")
                         ColumnLayout {
                             RadioButton {
                                 id: modeButton1
                                 checked: true
                                 text: qsTr("NoAA")
                             }
                             RadioButton {
                                 id: modeButton2
                                 text: qsTr("SSAA")
                             }
                             RadioButton {
                                 id: modeButton3
                                 text: qsTr("MSAA")
                             }
                             RadioButton {
                                 id: modeButton4
                                 text: qsTr("ProgressiveAA")
                             }
                         }
                     }

                     GroupBox {
                         title: qsTr("Antialiasing Quality")
                         enabled: !modeButton1.checked
                         ButtonGroup {
                             buttons: antialiasingQualityColumn.children
                         }
                         ColumnLayout {
                             id: antialiasingQualityColumn
                             RadioButton {
                                 id: qualityButton1
                                 text: qsTr("Medium")
                             }
                             RadioButton {
                                 id: qualityButton2
                                 checked: true
                                 text: qsTr("High")
                             }
                             RadioButton {
                                 id: qualityButton3
                                 text: qsTr("VeryHigh")
                             }
                         }
                     }

                     CheckBox {
                         id: temporalModeButton
                         text: qsTr("Enable Temporal AA")
                     }

                     ColumnLayout {
                         enabled: temporalModeButton.checked
                         Label {
                             text: qsTr("Temporal AA Strength")
                         }

                         RowLayout {
                             Slider {
                                 id: temporalStrengthSlider
                                 from: 0.0
                                 to: 2.0
                                 value: 0.3
                             }
                             Label {
                                 text: temporalStrengthSlider.value.toFixed(1);
                             }
                         }
                     }

                     Button {
                         id: animationButton
                         Layout.alignment: Qt.AlignHCenter
                         text: "Animate!"
                         onClicked: {
                             modelAnimation.restart();
                         }
                     }
                 }
             }
         }

         Pane {
             anchors.top: view3D.top
             anchors.right: parent.right
             Label {
                 id: debugViewToggleText
                 text: dbg.visible ? "Hide DebugView" : "Show DebugView"
                 anchors.right: parent.right
                 anchors.top: parent.top
                 MouseArea {
                     anchors.fill: parent
                     onClicked: dbg.visible = !dbg.visible
                     DebugView {
                         y: debugViewToggleText.height * 2
                         anchors.right: parent.right
                         source: view3D
                         id: dbg
                         visible: false
                     }
                 }
             }
         }
     }