如何仅使用 SceneKit 编辑器在 ARKit 中创建 Portal 效果？

Question

我想创建一个原型 like this one: just using Xcode SceneKit Editor. I found an answer，其中房间是使用简单的 SCNPlane 对象以编程方式创建的，并尝试渲染顺序。

但是，我想把一些更详细的东西放在一起，比如下载房间的 3d 模型，并使其只能通过门户访问。我试图直接在 Xcode 的 SceneKit 编辑器中转换这部分来实现相同的效果：

//a. Create The Left Wall And Set Its Rendering Order To 200 Meaning It Will Be Rendered After Our Masks
    let leftWallNode = SCNNode()
    let leftWallMainGeometry = SCNPlane(width: 0.5, height: 1)
    leftWallNode.geometry = leftWallMainGeometry
    leftWallMainGeometry.firstMaterial?.diffuse.contents = UIColor.red
    leftWallMainGeometry.firstMaterial?.isDoubleSided = true
    leftWallNode.renderingOrder = 200

    //b. Create The Left Wall Mask And Set Its Rendering Order To 10 Meaning It Will Be Rendered Before Our Walls
    let leftWallMaskNode = SCNNode()
    let leftWallMaskGeometry = SCNPlane(width: 0.5, height: 1)
    leftWallMaskNode.geometry = leftWallMaskGeometry
    leftWallMaskGeometry.firstMaterial?.diffuse.contents = UIColor.blue
    leftWallMaskGeometry.firstMaterial?.isDoubleSided = true
    leftWallMaskGeometry.firstMaterial?.transparency = 0.0000001
    leftWallMaskNode.renderingOrder = 10
    leftWallMaskNode.position = SCNVector3(0, 0, 0.001)

在编辑器中分为两个平面：

我负责为它们设置 isDoubleSided 和 renderingOrder，并将第二个设置为透明（在漫反射颜色上使用 alpha）。

不幸的是，在 AR 模式下显示时，它不起作用。 .scn 文件可用 here.

Answer 1

A virtual world in your example is hidden behind a wall. In order to get a portal like in the presented movie you need a wall opening (where an entrance is), not a plane blocking your 3D objects. The alpha channel of portal's entrance should look like right part of the following image:

此外，请查看我在 SO 帖子中的回答： and 检查如何设置不可见 material。

代码可能是这样的：

portalPlane.geometry?.materials.first?.colorBufferWriteMask = [] 
portalPlane.geometry?.materials.first?.readsFromDepthBuffer = true
portalPlane.geometry?.materials.first?.writesToDepthBuffer = true
portalPlane.renderingOrder = -1

当然，您可以在 Material Inspector 中使用属性：

门户平面的属性如下：Writes Depth 为真，Reads Depth 为真，Write to Color 为空，Rendering Order（在节点检查器中）为 -1.

对于门户内的 3D 对象 Rendering Order（在 Node Inspector 中）大于 0。

您绝对可以在 Xcode 的视口中观察 a hidden effect。

现在隐藏的墙遮盖了更大的3D部分以显示真实的街道，并且您可以通过门户看到您的3D环境（错误结果在左侧，正确结果在这张图片的右侧）。

下一张图片显示了 3D 墙（在我的例子中是挤压平面）的样子：

But for exit of the portal you just need a 3D object like a door (not a wall opening) and this exit should look like the left side of presented pictures. The normals of the door must be pointed inside, the normals of the wall must be pointed outside. The material for both objects is single sided.

希望这对您有所帮助。

如何仅使用 SceneKit 编辑器在 ARKit 中创建 Portal 效果？

How to create a Portal effect in ARKit just using the SceneKit editor?

swift

xcode

scenekit

augmented-reality

arkit