Popover, Menu and Sheet not working with RealityView Attachment SwiftUI

Question

Created 1w

Replies 1

Boosts 0

Participants 2

Hi, I have a SwiftUI View, that is attached to a 3D object in Reality View. This is supposed to be a HUD for the user to select a few things. I wanted a sub menu for one of the top level buttons.

But looks like none of the reasonable choices like Menu, Sheet or Popover work.

Is there a known limitation of RealityKit Views where full SwiftUI cannot be used? Or am I doing something wrong?

For example,

        Button {
            SLogger.info("Toggled")
            withAnimation {
                showHudPositionMenu.toggle()
            }
        } label: {
            HStack {
                Image(systemName: "rectangle.3.group")
                Text("My Button")
            }
        }
        .popover(isPresented: $showHudPositionMenu, attachmentAnchor: attachmentAnchor) {
            HudPositionMenuItems(showHudPositionMenu: $showHudPositionMenu, currentHudPosition: $currentHudPosition)
        }

This will print "Toggled" but will not display the MenuItems Popover.

If it makes any difference, this is attached to a child of a head tracked entity.

Boost

Answer 1

Vision Pro Engineer OP

Apple

1w

Hi @SravanKaruturi ,

Are you using ViewAttachmentComponent? It was just released yesterday and should solve your issue.

Here's what I tested, which worked:

import SwiftUI
import RealityKit
import RealityKitContent

struct ContentView: View {

    var body: some View {
        VStack {
            RealityView { content in
                let cube = ModelEntity(mesh: .generateBox(size: 0.1), materials: [SimpleMaterial(color: .red, isMetallic: true)])
                content.add(cube)

                let attachment = Entity(components: ViewAttachmentComponent(rootView: TestView()))
                cube.addChild(attachment)
                attachment.setPosition([0, 0.1, 0.1], relativeTo: cube)
            }
        }
    }
}

struct TestView: View {
    @State private var toggle: Bool = false
    var body: some View {
        Button("test") {
            toggle.toggle()
        }
        .popover(isPresented: $toggle, content: {
            Text("Popover")
        })
    }
}

0