HarmonyOS鸿蒙Next中使用Scene.load加载模型后，3D场景怎么不支持手动拖拽旋转了呢

HarmonyOS鸿蒙Next中使用Scene.load加载模型后，3D场景怎么不支持手动拖拽旋转了呢 【问题描述】：使用Scene.load加载模型后，3D场景怎么不支持手动拖拽旋转了呢

【问题现象】：场景1.使用Scene.load加载模型后，3D场景不支持手动拖拽旋转了。场景2.正常将资源写在3D场景下，可以支持手动拖拽旋转

【版本信息】：NA

【复现代码】：

import { Camera, SceneResourceFactory, Scene } from '@kit.ArkGraphics3D';

@Entry
@Component
struct Model {
  scene: Scene | null = null;
  @State sceneOpt: SceneOptions | null = null;
  cam: Camera | null = null;

  onPageShow(): void {
    this.Init();
  }

  Init(): void {
    if (this.scene == null) {
      // 加载场景资源，支持.gltf和.glb格式，路径和文件名可根据项目实际资源自定义
      Scene.load($rawfile("store.glb"))
        .then(async (result: Scene) => {
          this.scene = result;
          let rf:SceneResourceFactory = this.scene.getResourceFactory();
          // 创建相机
          this.cam = await rf.createCamera({ "name": "Camera" });
          // 设置合适的相机参数
          this.cam.enabled = true;
          this.cam.position.z = 5;
          this.sceneOpt = { scene: this.scene, modelType: ModelType.SURFACE } as SceneOptions;
        }).catch((error: Error) => {
        console.error('Scene load failed:', error);
      });
    }
  }

  build() {
    Row() {
      Column() {
        if (this.sceneOpt) {
         //  通过Component3D呈现3D场景
          Component3D(this.sceneOpt) //场景1 异常
        }
        Divider()
        Component3D({ scene: $rawfile('store.glb'), modelType: ModelType.SURFACE } )
          .environment($rawfile('store.glb')) //场景2 正常

      }.width('100%')
    }.height('60%')
  }
}

【尝试解决方案】：NA


更多关于HarmonyOS鸿蒙Next中使用Scene.load加载模型后，3D场景怎么不支持手动拖拽旋转了呢的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

在HarmonyOS Next中，Scene.load加载3D模型后需通过Gesture处理拖拽交互。原自动旋转功能需手动实现触摸事件绑定，使用RotationGesture或PanGesture识别用户手势，通过计算偏移量动态更新模型的旋转角度。具体需在Scene的onTouch回调中处理ACTION_MOVE事件，将触摸位移转换为欧拉角或四元数旋转值，并赋值给模型节点的rotation属性。

更多关于HarmonyOS鸿蒙Next中使用Scene.load加载模型后，3D场景怎么不支持手动拖拽旋转了呢的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在使用Scene.load加载模型后，3D场景无法手动拖拽旋转的问题，通常是因为加载后的场景缺少默认的相机控制器配置。从代码对比可以看出：

场景2（正常）使用了Component3D的默认配置，系统会自动添加相机控制器来支持交互操作。而场景1通过Scene.load异步加载后，虽然创建了相机，但没有为相机附加控制器。

解决方案是在创建相机后显式添加控制器：

this.cam = await rf.createCamera({ "name": "Camera" });
// 添加控制器支持
let controller = this.cam.getComponent(ArkControllerCamera) as ArkControllerCamera;
if (!controller) {
  controller = this.cam.addComponent(ArkControllerCamera);
}
controller.enabled = true;

this.cam.enabled = true;
this.cam.position.z = 5;

关键点在于确保相机组件包含ArkControllerCamera控制器，并启用该控制器。这样就能恢复场景的拖拽旋转交互功能。

回到顶部