Search code examples
swiftaugmented-realityarkitrealitykitreality-composer

Create border or outline on ModelEntity?


How can I create a border/outline on a ModelEntity in RealityKit?

Something like this blue border in Reality Composer:

enter image description here


Solution

  • You can achieve similar effect in two ways: either using Metal framework's features, or natively, in RealityKit (but sometimes with some visual artifacts). In RealityKit, such an outline could be rendered with faceCulling property for cloned model:

    import UIKit
    import RealityKit
    
    class ViewController: UIViewController {
        
        @IBOutlet var arView: ARView!
        
        override func viewDidLoad() {
            super.viewDidLoad()
            
            let scene = try! Experience2.loadScene()
            let scene2 = scene.clone(recursive: true)
            
            let outline = scene2.findEntity(named: "simpBld_root") as! ModelEntity
            outline.scale *= 1.02
            
            var material = PhysicallyBasedMaterial()
            material.emissiveColor.color = .white
            material.emissiveIntensity = 0.5
    
            // an outer surface doesn't contribute to the final image
            material.faceCulling = .front
    
            outline.model?.materials[0] = material
            
            arView.scene.anchors.append(scene)
            arView.scene.anchors.append(scene2)
        }
    }
    

    enter image description here

    P. S.

    In your case, the name of a rook is:

    .findEntity(named: "chess_rook_white_base_iconic_lod0")