qml 如何使用 Quick 3D 显示 3D 模型？

原创已于 2024-12-29 00:00:26 修改 · 4.4k 阅读

16 ·

CC 4.0 BY-SA版权

知识因分享而具有价值，回忆昨天，把握今天，期待明天。 —— 驭鲸·环球

文章标签：

#c++ #qml #qt

于 2022-01-19 16:40:57 首次发布

QML 专栏收录该内容

2 篇文章

订阅专栏

这篇博客详细介绍了如何利用 QML 的 Quick 3D 功能展示 3D 模型。通过一个名为 Quick3D 的 demo，作者展示了如何加载并显示 boat.obj 3D 模型。首先，使用 balsam.exe 工具将 obj 格式模型转换，然后将生成的文件添加到 QML 资源中，最后在 QML 中使用特定组件呈现 3D 模型数据。

qml 如何使用 Quick 3D 显示 3D 模型？

Quick3D demo 详细描述了如何使用 qml 显示一个 3D 模型。

qml 3d boat

仓库地址：https://gitee.com/yujinghuanqiu/quick3d

在该 demo 中提供一个 boat.obj 3d 模型(./3d/boat.obj)，用于测试3D模型显示。

使用 balsam.exe (qt 自带工具) 工具转换 obj 格式的 3d 模型。

balsam.exe boat.obj

此时会生成 maps meshes Boat.qml 文件，把这些全部添加到 qml 资源文件中。

使用 Qt Quick 3D 显示3D模型数据。

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick3D 1.15
import QtQuick3D.Helpers 1.15

Window {
    id: window
    width: 640
    height: 480
    visible: true

    View3D {
        id: view
        anchors.fill: parent
        environment: SceneEnvironment {
            clearColor: "#3a4055"
            backgroundMode: SceneEnvironment.Color
        }
        Node {
            id: scene
            PerspectiveCamera {
                id: camera
                z: 2000
            }
            DirectionalLight {
                z: 3000
                brightness: 250
            }
            Boat {
                PropertyAnimation on eulerRotation.x {
                    loops: Animation.Infinite
                    duration: 30000
                    to: 360
                    from: 0
                }
                PropertyAnimation on eulerRotation.y {
                    loops: Animation.Infinite
                    duration: 30000
                    to: 360
                    from: 0
                }
            }
        }

        DebugView {
            source: view
        }
        AxisHelper {
            scale: Qt.vector3d(10, 10, 10)
            enableAxisLines: true
            enableXYGrid: true
            enableXZGrid: false
            enableYZGrid: false
        }
        WasdController {
            controlledObject: scene
        }
    } // view 3d
}