QML 3D 操作鼠标选择对象、界面拖拽与缩放

使用工具: qt Design Studio


使用3d功能必不可少的就是让模型与鼠标进行交互。
创建新的3d项目后添加MouseArea鼠标区域

QML 3D 操作鼠标选择对象、界面拖拽与缩放_第1张图片

QML 3D 操作鼠标选择对象、界面拖拽与缩放_第2张图片
旋转思想是工件不动,令相机绕工件旋转,镜头拉近即为放大,远离为缩小。
选择利用的是零件的pickable属性,pickable为true时可被选中。但是在点击的时候是不会自动切换颜色的,需要其他操作。

QML 3D 操作鼠标选择对象、界面拖拽与缩放_第3张图片
工件的代码


用isPicked表示是否选中,和渲染颜色

Model {
   
      id: cylinder
       source: "#Cylinder"
       scale.z: 0.1
       scale.y: 1.1
       scale.x: 0.1
       objectName: "Cube"
       pickable: true     //可选
       property bool isPicked: false  //记录是否选中该零件

	materials: DefaultMaterial {
     //渲染
	//如果选中就换个颜色
         diffuseColor: cylinder.isPicked ? "#17a81a" : "#9d9faa" 
         
         specularAmount: 0.25
         specularRoughness: 0.2
}
}

MouseArea 的代码

MouseArea {
   
            id:sss
            x: 0
            y: 0
            anchors.fill:view3D
            Connections {
   
                target: sss
                property int cx: 0  //缓存一下鼠标位置
                property int cy: 0
                property string nametext:"sss"//记录选择物体的名称
                onWheel: {
   //放缩--调整摄像头的远近
                    if (wheel.angleDelta.y > 0)
                        
                        "摄影机id".z = "摄影机id".z + 5
                    else
                        "摄影机id".z = "摄影机id".z - 5
                }
                onPressed: {
     //获取按下的坐标
                    cx = mouse.x
                    cy = mouse.y
                }

                onPositionChanged: {
   //位移--坐标这样操作是因为对应的坐标轴方向不同
                    var intervalX = mouse.x - cx
                    var intervalY = mouse.y - cy
                    "相机节点".eulerRotation.y = "相机节点".eulerRotation.y - intervalX
                    "相机节点".eulerRotation.x = "相机节点".eulerRotation.x - intervalY
                    cx = mouse.x
                    cy = mouse.y
                }
                onClicked: {
     //点击屏幕,映射到工件上,
                    // 获取屏幕点击坐标
                    name.text = "位置: (" + mouse.x + ", " + mouse.y + ")"
                    var result = view3D.pick(mouse.x, mouse.y);//映射
                   if (result

你可能感兴趣的:(qml,3d,ui,qt)