'SpotLightComponent' is unavailable in visionOS

Question

I am working with RealityKit in Vision OS beta 1 and can't build the light source. I want to use that light source in the fully immersive space (that has no light source by default). I tried that code to create the entity with the SpotLightComponent. I got the error 'SpotLightComponent' is unavailable in visionOS.

SpotLightComponent.registerComponent()
        
let entity = Entity()
let lightComponent = SpotLightComponent(
   color: .white,
   intensity: 6740.94,
   innerAngleInDegrees: 45.0,
   outerAngleInDegrees: 60.0,
   attenuationRadius: 10.0
)
entity.components.set(lightComponent)

I build that code in the swift package limited to only visionOS platform, and from the app itself. No luck.

platforms: [
    .visionOS(.v1)
],

I expected the code to be able to build at least because the Apple docs have this component listed as available. https://developer.apple.com/documentation/realitykit/spotlightcomponent

Answer 1

How to create visionOS lighting in RealityKit

You are right. Even though the official documentation explicitly states that SpotLightComponent is supported in visionOS, this is not true. At the moment (25 July 2023) you can use only basic Image Based Lighting in visionOS apps. Spot light, omni light and directional light are temporarily (I hope that it's temporarily) inaccessible in visionOS version of RealityKit. Here's an example of how you can implement lighting in your visionOS app (IBL images should be in .hdr, .png, .jpg or .heic formats).

import SwiftUI
import RealityKit

struct ContentView: View {
    var body: some View {
        RealityView { content in
            
            let model = ModelEntity(mesh: .generateSphere(radius: 0.1),
                               materials: [SimpleMaterial()])
            content.add(model)
            
            guard let env = try? await EnvironmentResource(named: "Directional")
            else { return }
            
            var iblComponent = ImageBasedLightComponent(source: .single(env),
                                             intensityExponent: 7.95)

            model.components[ImageBasedLightComponent.self] = iblComponent
            model.components.set(ImageBasedLightReceiverComponent(imageBasedLight: model))
        }
        .frame(depth: 0)
    }
}

My Directional.png file dimensions are 1000 x 625 pixels: