Qt Quick 3D模块初探
0.前言
Qt Quick 3D提供了用于基于Qt Quick创建3D内容或UI的高级API。提供了对现有Qt Quick场景图(scenegraph )的扩展,以及对该扩展场景图的渲染器。使用空间场景图(Spatial scenegraph)时,还可以将Qt Quick 2D内容与3D内容混合。从官方的描述来看,可以看成一个简化版的Qt3D模块
因为该模块是从Qt5.14开始预览,Qt5.15正式加入的,所以资料很少,只有几个简单的QtCreator示例。
使用时,先导入模块(测试了两个Demo,感觉pro文件QT+=quick3d不是必须的,待验证):
import QtQuick3D 1.15
除了基本的Qt Quick 3D模块外,还提供了其他功能:
import QtQuick3D.Materials 1.15
import QtQuick3D.Effects 1.15
import QtQuick3D.Helpers 1.15
本文代码链接:https://github.com/gongjianbo/HelloQtQuick3D
Qt Quick 3D概述:https://doc.qt.io/qt-5/qtquick3d-index.html
1.第一个窗口
要渲染一个3D场景,需要使用View3D对象,View3D为要渲染的3D内容提供2D表面。在3D场景中,使用Node对象树来描述我们的场景。下面的示例是一个空白的窗口,只有clearColor:
import QtQuick 2.15
import QtQuick3D 1.15
Item{
//渲染3D场景的视口
//View3D为要渲染的3D内容提供2D表面。
// it must first be flattend.
View3D {
id: view
anchors.fill: parent
anchors.margins: 20
//为了控制场景的呈现,有必要定义一个SceneEnvironment的环境属性。
//SceneEnvironment定义了渲染场景的环境,该环境定义了如何全局渲染场景。
environment: SceneEnvironment {
clearColor: "darkGreen"
backgroundMode: SceneEnvironment.Color
}
//要将3D场景投影到2D视口,必须从摄像机查看场景。
PerspectiveCamera {
position: Qt.vector3d(0, 0, 0)
}
}
Text {
anchors.centerIn: parent
text: "First Window"
}
}
下面再来试试一些预定义的Model(Model也是继承自Node):
import QtQuick 2.15
import QtQuick3D 1.15
//渲染3D场景的视口
View3D {
environment: SceneEnvironment {
clearColor: "darkGreen"
backgroundMode: SceneEnvironment.Color
}
//透视投影
PerspectiveCamera {
id: camera
position: Qt.vector3d(0, 0, 300)
//eulerRotation.x: -30
}
//光源
DirectionalLight {
eulerRotation.x: -100
eulerRotation.y: -100
eulerRotation.z: 500
}
//加载3D模型数据
//为了使模型可渲染,它至少需要一个网格Mesh和一种材料Material
//圆球
Model {
position: Qt.vector3d(0, 0, 0)
source: "#Sphere"
materials: [ DefaultMaterial {
diffuseColor: "blue"
}
]
}
//矩形
Model {
position: Qt.vector3d(-100, -100, 0)
source: "#Cube"
scale: Qt.vector3d(2, 0.1, 1)
eulerRotation: Qt.vector3d(0,0,-20)
materials: [ DefaultMaterial {
diffuseColor: "red"
}
]
}
}
2.混合Qt Quick Item画三角
相对于Qt3D可以直接在QML中定义顶点,QtQuick3D好像没那么方便。我只看到一个叫Geometry的类型可以自定义几何形状,但是需要使用C ++实现并注册到QML。又或者Model的source使用自己生成的mesh文件,很明显这也不方便。索性我就放了一个QML的Shape画的三角:
import QtQuick 2.15
import QtQuick3D 1.15
import QtQuick.Shapes 1.15
//渲染3D场景的视口
View3D {
environment: SceneEnvironment {
clearColor: "darkGreen"
backgroundMode: SceneEnvironment.Color
}
//透视投影
PerspectiveCamera {
id: camera
position: Qt.vector3d(0, 0, 300)
//eulerRotation.x: -30
}
//光源
DirectionalLight {
eulerRotation.x: -100
eulerRotation.y: -100
eulerRotation.z: 500
}
//自定义Geometry还得从Cpp注册,或者source加载自己的mesh文件
//为了图方便,贴一个Quick2的Shape来展示三角
Node {
position: Qt.vector3d(0, 0, 0)
Shape {
id: shape
width: 300
height: 200
ShapePath {
strokeColor: "transparent"
fillColor: "lightGreen"
startX: shape.width/2; startY: 0
PathLine { x: shape.width; y: shape.height }
PathLine { x: 0; y: shape.height }
PathLine { x: shape.width/2; y: 0 }
}
}
}
}
上一篇: 3D旋转
下一篇: Qt5.11 Qt 3D入门(二)