Qt Quick 3D - 简介

本示例通过解析一个简单示例的代码，对Quick 3D的基本功能进行了入门级概述。

设置场景

我们在main.qml文件中设置整个场景。

为了能够使用QtQuick3D 模块中的类型，我们必须导入该模块：

import QtQuick
import QtQuick3D

要绘制任何 3D 场景，我们需要在Qt Quick 场景中创建一个 3D 视口。这由View3D 类提供，我们将在其中定义场景。一个应用程序中也可以包含多个视口，详情请参阅Qt Quick 3D - View3D 示例。

首先，我们定义场景的环境。在本示例中，我们仅通过skyblue 清除背景颜色，并在SceneEnvironment 中为视口的environment 属性指定了该颜色。SceneEnvironment 描述了与场景环境相关的各种属性，例如色调映射设置、基于图像的照明的光探针设置、背景模式或环境光遮蔽参数。 它还可以控制抗锯齿，详见Qt Quick 3D - 抗锯齿示例。在本示例中，我们将clearColor 和backgroundMode 属性设置为蓝色背景。

environment: SceneEnvironment {
    clearColor: "skyblue"
    backgroundMode: SceneEnvironment.Color
}

网格

为了使场景更加生动，我们现在将添加一些网格。Quick 3D 为方便起见内置了多种网格，例如球体、立方体、圆锥体或圆柱体。通过在 Model 节点的 source 属性中使用特殊标识符（如#Sphere 、#Cube 或#Rectangle ）即可引用这些网格。 除了内置的几何体外，还可以指定.mesh 文件。若要从FBX或glTF2资源生成.mesh 文件，需要使用Balsam资源导入工具对这些资源进行处理。下面是添加一个蓝色球体和一个红色扁平圆柱体的代码：

Model {
    position: Qt.vector3d(0, -200, 0)
    source: "#Cylinder"
    scale: Qt.vector3d(2, 0.2, 1)
    materials: [ PrincipledMaterial {
            baseColor: "red"
        }
    ]
}

Model {
    position: Qt.vector3d(0, 150, 0)
    source: "#Sphere"

    materials: [ PrincipledMaterial {
            baseColor: "blue"
        }
    ]

    SequentialAnimation on y {
        loops: Animation.Infinite
        NumberAnimation {
            duration: 3000
            to: -150
            from: 150
            easing.type:Easing.InQuad
        }
        NumberAnimation {
            duration: 3000
            to: 150
            from: -150
            easing.type:Easing.OutQuad
        }
    }
}

要添加网格，我们使用两个 Model 节点，并将#Sphere 和#Cylinder 作为source 来加载内置网格。要为模型赋予颜色，首先需要指定一种材质。在此示例中，我们使用一种具有红色和蓝色基色的PrincipledMaterial 。 目前提供三种具有不同属性的材质，分别是PrincipledMaterial 、SpecularGlossyMaterial 和CustomMaterial ，详情请参阅《Qt Quick 3D ——Principled 材质示例》以及《可编程材质、特效、几何体和纹理数据》。 由Model 加载的网格可能包含多个子网格，且每个子网格都需要指定一种材质。在该示例中仅使用了内置网格，而这些网格各自仅有一个子网格，因此只需在materials 列表中指定一个PrincipledMaterial 即可。

Model 属于Node ，因此具有关联的变换。要应用平移，我们使用position 属性。还可以通过设置eulerRotation 属性来旋转模型。为了使圆柱体看起来像一个平面，我们相应地设置scale 属性。

摄像机

接着，我们定义一个摄像机，它指定了3D场景的内容如何投影到2D平面上。在本例中，我们使用PerspectiveCamera ，这将生成透视投影。通过OrthographicCamera 类型，也可以实现正交投影。 相机的默认方向是：其前向量沿负Z轴方向，向上量沿正Y轴方向。本示例将相机沿Z轴向后移动300单位。此外，相机沿Y轴向上移动了一点，并围绕X轴轻微旋转，使视线略微向下。

PerspectiveCamera {
    position: Qt.vector3d(0, 200, 300)
    eulerRotation.x: -30
}

光源

场景还需要一个光源，才能看到其中的模型。向场景中添加了一个DirectionalLight ，可将其视为从特定方向照射的远处太阳。还有另外两种光源可用，即SpotLight 和PointLight ，详见Qt Quick 3D - 光源示例。

DirectionalLight {
    eulerRotation.x: -30
    eulerRotation.y: -70
}

动画

最后，我们还将对球体进行动画处理。具体做法是在y 组件上应用SequentialAnimation ，使球体无限地上下移动。

SequentialAnimation on y {
    loops: Animation.Infinite
    NumberAnimation {
        duration: 3000
        to: -150
        from: 150
        easing.type:Easing.InQuad
    }
    NumberAnimation {
        duration: 3000
        to: 150
        from: -150
        easing.type:Easing.OutQuad
    }
}

当所有这些部分协同工作时，我们就能渲染出3D场景。本示例仅涉及Qt Quick 3D 的部分基本功能。请访问示例页面查看更多示例。

示例项目 @ code.qt.io