微信 XRFrame 常用功能

遮罩制作

如图，在 Web 编辑器中，放置两片用于做遮罩的片，将名字命名为 Mask（可任意，只是需要与后续代码上的处理对应） 使用其他编辑器类似操作

// 遮罩材质
const occEffect = this.xrScene.assets.getAsset('effect', 'standard');
const occMatLeft = this.xrScene.createMaterial(occEffect);
occMatLeft.renderQueue = 1;
occMatLeft.alphaMode = 'BLEND';
occMatLeft.setVector('u_baseColorFactor', xr.Vector4.createFromNumber(1.0, 1.0, 1.0, 0.0));
  
const gltf = this.model.el.getComponent("gltf");
// 找到 Mask 的 object，这里 Mask 和内容制作时，用于遮罩的物体名称一致
const mask = gltf. getPrimitivesByNodeName('Mask')[0];
console.log('mask', mask)
// 将材质赋予此 object
mask.material = occMatLeft;

效果