Qt Quick 3D学习：使用鼠标键盘控制节点位置和方向

（注意，开源版的 Qt Quick 3D 是狗都不用的 GPL 协议）

Qt Quick 3D 模块提供了  WasdController 类型来控制节点的位置和方向，受控节点一般是 Camera。（相关文档：https://doc.qt.io/qt-6/qml-qtquick3d-helpers-wasdcontroller.html  ；文档建议对照 Qt 最新版本文档和自己的开发版本文档一起看，因为 Qt Quick 3D 作为一个 Qt5.14/5.15 才出的新模块，很多地方一开始还没有给出详细说明，在后面新出的版本官方在逐步完善）

该类型位于 QtQuick3D.Helpers 包种：

import QtQuick3D.Helpers 1.15

可以通过 WASD 或者方向键控制节点平移，通过鼠标拖动来改变节点方向：

W or up - 前进
S or down - 后退
A or left - 左移
D or right - 右移
R or page up - 上移
F or page down - 下移

但要注意的是，只有 WasdController 拥有焦点的时候才能对按键事件进行响应，可以主动调用 forceActiveFocus() 函数使其成为当前的焦点对象。还有就是 WasdController 没有处理鼠标滚轮事件，可以自己在 View3D 上加一层 MouseArea 来处理滚轮事件进行前进后退。

简单的示例：

import QtQuick 2.15
import QtQuick3D 1.15
import QtQuick3D.Helpers 1.15

View3D {
    id: control

    //背景
    environment: SceneEnvironment {
        clearColor: "darkGreen"
        backgroundMode: SceneEnvironment.Color
    }

    //观察相机
    PerspectiveCamera {
        id: camera
        z: 100
    }

    //光照
    DirectionalLight {
        eulerRotation.y: 45
    }

    //模型
    Model {
        id: cube
        position: Qt.vector3d(0, 0, 0)
        source: "#Cube"
        scale: Qt.vector3d(0.2, 0.1, 0.2)
        materials: [
            DefaultMaterial {
                diffuseColor: "cyan"
            }
        ]
    }

    //使用键盘和鼠标来控制节点方位
    //W or up - 前进
    //S or down - 后退
    //A or left - 左移
    //D or right - 右移
    //R or page up - 上移
    //F or page down - 下移
    //shift与其他键同时按，移动可以加速
    //注意：按键控制需要WasdController具有焦点时才会响应
    //按住鼠标左键拖动是改变方向，可惜的是滚轮没有前进后退效果
    WasdController {
        id: wasd_control
        //指定受控对象，通常受控节点是相机
        controlledObject: camera //cube
    }

    //点击使control获得焦点，才能接受按键控制
    MouseArea {
        visible: !wasd_control.activeFocus
        anchors.fill: parent
        onClicked: {
            wasd_control.forceActiveFocus()
        }
    }
}

我们也可以使用 Keys 和 MouseArea 等类型自己获取鼠标和键盘事件，来设置节点的位置和方向。简单的示例：

import QtQuick 2.15
import QtQuick3D 1.15
import QtQuick3D.Helpers 1.15

View3D {
    id: control

    //可以设置受控的节点为camera或者model
    property var controlNode: camera //cube

    //背景
    environment: SceneEnvironment {
        clearColor: "darkGreen"
        backgroundMode: SceneEnvironment.Color
    }

    //观察相机
    PerspectiveCamera {
        id: camera
        z: 100
    }

    //光照
    DirectionalLight {
        eulerRotation.y: 45
    }

    //模型
    Model {
        id: cube
        position: Qt.vector3d(0, 0, 0)
        source: "#Cube"
        scale: Qt.vector3d(0.2, 0.1, 0.2)
        materials: [
            DefaultMaterial {
                diffuseColor: "cyan"
            }
        ]
    }

    //鼠标操作控制节点
    MouseArea {
        anchors.fill: parent
        hoverEnabled: false
        property int xTemp: 0
        property int yTemp: 0
        //滚轮缩放
        onWheel: {
            if(wheel.angleDelta.y>0){
                camera.z-=5
            }else{
                camera.z+=5
            }
        }
        onPressed: {
            xTemp = mouse.x
            yTemp = mouse.y
        }
        //按住鼠标移动转动方向
        onPositionChanged: {
            //欧拉角
            //绕x轴转 pitch俯仰角
            //绕y轴转 yaw偏航角
            //绕z轴转 roll滚动角
            //上下拖y值是绕x轴转
            controlNode.eulerRotation.x = controlNode.eulerRotation.x+(yTemp-mouse.y)*0.3
            //左右拖x值是绕y轴转
            controlNode.eulerRotation.y = controlNode.eulerRotation.y+(xTemp-mouse.x)*0.3
            xTemp = mouse.x
            yTemp = mouse.y
        }
    }

    //快捷键控制节点移动
    Shortcut {
        sequences: ["W","Up"]
        onActivated: {
            controlNode.y += 3;
        }
    }
    Shortcut {
        sequences: ["A","Left"]
        onActivated: {
            controlNode.x -= 3;
        }
    }
    Shortcut {
        sequences: ["S","Down"]
        onActivated: {
            controlNode.y -= 3;
        }
    }
    Shortcut {
        sequences: ["D","Right"]
        onActivated: {
            controlNode.x += 3;
        }
    }
}

本文代码

Github（NodeControl.qml）： https://github.com/gongjianbo/HelloQtQuick3D

本文参考

Qt文档：https://doc.qt.io/qt-6/qml-qtquick3d-helpers-wasdcontroller.html