A QUICK GUIDE FOR USING OCCLUSION WITH REALITY KIT
This 2nd tutorial on using Reality Kit. I recommend reading the 1st Reality Kit tutorial if you haven’t already.
For this simple example we are going to use a custom usdz file of an Apple. However, we could also use a simple primitive box or one of the assets which ships with Reality Composer to achieve the same result.
Download Page for the Apple above
Once you’ve finished downloading the Apple. Open up Xcode 11 and start a project with the Augmented Reality App template.
We want to achieve 4 main things in this tutorial
-
1. Anchor a custom usdz file into our App on a horizontal surface
2. Add tap gesture in our App, so we can control simple behaviours
3. Add occlusion to our app to hide a custom usdz object with tap.
4. Launch our App and test it on iOS13 or iPADOS device
In Xcode we will only need to work with the three areas I’ve circled in red.
-
1. Edit ViewController.swift
2. Edit Experience.rcproject
3. Open Reality Composer
Let’s first edit ViewController.swift
Remove all the template code and replace it with the code snippet below. The code is commented and self-explanatory. The code will basic anchor the Apple into the scene on the horizontal plane. When you tap the Apple, the scene will be covered over by a big occlusion sphere. Tapping again will remove the occlusion sphere.
import UIKit
import RealityKit
class ViewController: UIViewController {
@IBOutlet var arView: ARView!
override func viewDidLoad() {
super.viewDidLoad()
// Load the "Box" scene from "Experience" Reality file
let boxAnchor = try! Experience.loadBox()
// Setup horizontal Anchor and add to arView
let anchor = AnchorEntity(plane: .horizontal, minimumBounds: [0.2, 0.2])
arView.scene.addAnchor(anchor)
// setup tap gesture recognizer & add to arView
let tapGesture = UITapGestureRecognizer(target: self, action:#selector(onTap))
arView.addGestureRecognizer(tapGesture)
// Add the box anchor to the scene
arView.scene.anchors.append(boxAnchor)
}
@IBAction func onTap(_ sender: UITapGestureRecognizer) {
let tapLocation = sender.location(in: arView)
// Get the entity at the location we've tapped, if one exists
if let tappedEntity = arView.entity(at: tapLocation) {
// Create occlusion sphere to cover over Apple
let boxMesh = MeshResource.generateSphere(radius: 0.151)
let material = OcclusionMaterial()
let occlusionBox = ModelEntity(mesh: boxMesh, materials: [material])
occlusionBox.name = "Occlusion"
occlusionBox.position.y = 0.05
// check for occlusion mesh
if let occlusionMesh = tappedEntity.findEntity(named: "Occlusion") {
// Remove occlusion mesh
occlusionMesh.removeFromParent()
} else {
tappedEntity.addChild(occlusionBox)
print(tappedEntity.name)
}
}
}
}
Now we are going to add the Apple4.usdz to our Experience.rcproject that we downloaded from usdzshare.com
Go back into Xcode and click on the Experience.rcproject file in our Xcode project (left sidebar) and Open
Reality Composer inside Xcode (top right header bar).
Once inside Reality Composer – delete the cube by clicking on it with right click on the mouse. Then, click on the Objects + button at the top and import the Apple4.usdz file. To make an object clickable or tappable you need to setup the Apple4.usdz as a collision body. In Reality Composer set the Apple4.usdz to physics participate – as fixed. Now close Reality Composer as we don’t need to setup any behaviours and return to Xcode again.
We can now attach our iOS13 Device and build the app with the target device correctly selected. If everything is working as expected. The Apple should anchor on the horizontal and tapping the Apple will make it disappear… Re-tapping the position where the Apple was should make the Apple reappear.
#RealityKit #RealityComposer @jimmygunawanapp
A quick guide for including occlusion in your Reality Kit app for iOS13.
Occlusion Tutorial => https://t.co/AUpg8SeHDj pic.twitter.com/30Ru7qFWjy
— usdzshare (@usdzshare) July 23, 2019