galacean / engine

A typescript interactive engine, support 2D, 3D, animation, physics, built on WebGL and glTF.
https://galacean.antgroup.com/engine
MIT License
4.25k stars 303 forks source link

xrManager不存在导致xrManager.origin和.inputManager报错 #2312

Open lwm98 opened 2 months ago

lwm98 commented 2 months ago

"@galacean/engine": "^1.3.2",

主要代码如下: import { AssetType, Scene, WebGLEngine, Loader, SystemInfo, Platform } from "@galacean/engine"; const engine = await WebGLEngine.create(config); const xrManager = engine.xrManager; // 这里就空了

// 报错行 xrManager = undefined if (xrManager.origin) { const inputManager = xrManager.inputManager; ....

有没有领导看下到底是文档哪里忘记更新了还是这个engine版本不对

lwm98 commented 2 months ago

image xrManager.inputManager所需要的inputManager 在这个engine原型上就有了,怎么回事

lwm98 commented 2 months ago

看了下文档提到的这个WebGLEngine类,确实有这个xrManager的属性,但是为啥实际上create出来就没有了呢

cptbtptpbcptdtptp commented 2 months ago

这是编辑器导出项目的一个 bug,正在修复,直接下方这段代码注释就可以了:

function addXRButton(content: string): HTMLButtonElement {
              const button = document.createElement("button");
              button.textContent = content;
              const { style } = button;
              style.position = "absolute";
              style.bottom = "20px";
              style.padding = "12px 6px";
              style.border = "1px solid rgb(255, 255, 255)";
              style.borderRadius = "4px";
              style.background = "rgba(0, 0, 0, 0.1)";
              style.color = "rgb(255, 255, 255)";
              style.font = "13px sans-serif";
              style.textAlign = "center";
              style.opacity = "0.5";
              style.outline = "none";
              style.zIndex = "999";
              style.cursor = "pointer";
              style.left = "calc(50% - 50px)";
              style.width = "100px";
              document.body.appendChild(button);
              return button;
            }
            const xrManager = engine.xrManager;
            let xrMode = 0;
            if (xrManager.origin) {
              const inputManager = xrManager.inputManager;
              const camera = inputManager.getTrackedDevice(3);
              const leftCamera = inputManager.getTrackedDevice(4);
              const rightCamera = inputManager.getTrackedDevice(5);
              if(leftCamera._camera && rightCamera._camera) { 
                xrMode = 2;
              } else if(camera._camera) {
                xrMode = 1;
              }
            }
            if(xrMode !== 0) {
              xrManager.sessionManager.isSupportedMode(xrMode).then(
                () => {
                  addXRButton(xrMode === 1 ? "进入 AR" : "进入 VR").onclick = () => {
                    xrManager.enterXR(xrMode);
                  };
                },
                (error) => {
                  addXRButton("not support")
                  console.error(error);
                }
              );
            }
cptbtptpbcptdtptp commented 2 months ago

看了下文档提到的这个WebGLEngine类,确实有这个xrManager的属性,但是为啥实际上create出来就没有了呢

这里回答一下第一个问题,engine 的 inputManager 是管理触控,滚轮键盘等输入设备的,XRManager 中的 inputManager 是管理头显,手柄等设备的,此外,如果不是 XR 项目,是不会初始化 xrManager 的(也不会让包体包含 XR 逻辑,包体大小不会随着功能增加日益繁重)

lwm98 commented 2 months ago

好的,谢谢领导 @cptbtptpbcptdtptp