ModelSortGroup.PlanarUIPlacement

enum · iOS 18.0+ · SDK 27.1

enum PlanarUIPlacement

A set of predefined groups that indicate how the renderer draws a model relative to a planar mesh or a SwiftUI view that's coplanar and overlapping. ### Overview Use one of the predefined groups ``ModelSortGroup/planarUIInline``, ``ModelSortGroup/planarUIAlwaysInFront``, and ``ModelSortGroup/planarUIAlwaysBehind`` to order virtual content relative to coincidental (coplanar and overlapping) app UI to avoid rendering artifacts. ### Placing virtual content relative to app UI The scenario below shows a museum scene that has a green planar mesh entity, stacked between two SwiftUI <doc://com.apple.documentation/documentation/swiftui/view> instances in a <doc://com.apple.documentation/documentation/swiftui/zstack>. | **Actual View** | **Layout Illustration** | |:-:|:-:| ||| ```swift ZStack { // A red UI layer. Color(.red).opacity(0.5) .frame(width: 700, height: 520, alignment: .center) .clipShape(RoundedRectangle(cornerRadius: 40)) // A green plane with 0.9 opacity. RealityView { content in let greenPlane = Entity() let planeModel = ModelComponent( mesh: .generatePlane(width: 0.3, height: 0.2, cornerRadius: 0.01), materials: [UnlitMaterial(color: .green)] ) greenPlane.components.set(planeModel) greenPlane.components.set(OpacityComponent(opacity: 0.9)) // Set the model sort group to planarUIInline. let group = ModelSortGroup.planarUIInline greenPlane.components.set(ModelSortGroupComponent(group: group, order: 0)) content.add(greenPlane) } .frame(depth: 0.0) // A UI with text and SF symbol. VStack { Text("Hello World").font(.system(size: 50)) Image(systemName: "visionpro") .resizable() .foregroundColor(.yellow) .aspectRatio(contentMode: .fit) .frame(width: 80.0, height: 80.0) } .frame(width: 460, height: 240, alignment: .center) .offset(z: .ulpOfOne) } ``` Use the ``ModelSortGroup/planarUIInline`` group to draw the `greenPlane` entity according to its placement within the `ZStack`. The `greenPlane` draws over the red layer, and the text/symbol draws over the `greenPlane`. ```swift let group = ModelSortGroup.planarUIAlwaysInline greenPlane.components.set(ModelSortGroupComponent(group: group, order: 0)) ``` @Row { @Column{} @Column(size: 5) { @Image( source: modelsortgroupcomponent-planarui-green-inline-dark, alt: "A screenshot of a museum scene with the red UI layer drawing first, followed by the greenPlane entity drawing second, and the layer with text and symbol drawing third. All 3 are coplanar and overlapping with one another." ) } @Column{} } Use the ``ModelSortGroup/planarUIAlwaysInFront`` group to order the `greenPlane` after both UI layers. The `greenPlane` draws over both the text/symbol layer and the red layer. ```swift let group = ModelSortGroup.planarUIAlwaysInFront greenPlane.components.set(ModelSortGroupComponent(group: group, order: 0)) ``` @Row { @Column{} @Column(size: 5) { @Image( source: modelsortgroupcomponent-planarui-green-alwaysinfront-dark, alt: "A screenshot of a museum scene with the greenPlane entity drawing after both UI layers. All 3 are coplanar and overlapping with one another." ) } @Column{} } Use the ``ModelSortGroup/planarUIAlwaysBehind`` group to order the `greenPlane` before both UI layers. The red layer and the text/symbol layer both draw over the `greenPlane`. ```swift let group = ModelSortGroup.planarUIAlwaysBehind greenPlane.components.set(ModelSortGroupComponent(group: group, order: 0)) ``` @Row { @Column{} @Column(size: 5) { @Image( source: modelsortgroupcomponent-planarui-green-alwaysbehind-dark, alt: "A screenshot of a living room scene with the greenPlane entity drawing before both UI layers. All 3 are coplanar and overlapping with one another." ) } @Column{} }

Members (0)

This type has no directly callable members in this snapshot. See the framework’s skipped declarations for unsupported APIs.

All RealityFoundation types →