Tip on Menu in Toolbar not showing

Question

Created Jul ’24

Replies 1

Boosts 1

Participants 2

Hey, I have a use case where I want to show a tip for a menu thats in a toolbar. Here's my approach to attach the tip to the Menu. I also tried to attach it to the Button in the menu but in both cases the tip was not shown. None of the described fixes in this post worked for me, adding .buttonStyle(.borderless) didn't help either ...

.toolbar {
  ToolbarItem(placement: .navigationBarTrailing) {
    Menu {
      Button {
      // ...
      } label: {
      // ... 
      }
    } label: { 
      Image(systemName: "heart")
    }
    .popoverTip(Tip())
  }
}

I'm working on a visionOS app

Answered by DTS Engineer in 797871022

@scl-dev Could you try reproducing this using the Highlighting app features with TipKit sample code.

Could you give this a trial:

struct PopoverTip: Tip {
    var title: Text {
        Text("Add an Effect")
            .foregroundStyle(.indigo)
    }
    
    var message: Text? {
        Text("Touch and hold \(Image(systemName: "wand.and.stars")) to add an effect to your favorite image.")
    }
}

struct PopoverView: View {
    // Create an instance of your tip content.
    let popoverTip = PopoverTipTest()
    
    var body: some View {
        NavigationStack {
            VStack(spacing: 20) {
                Text("Hello world")
                
                Image(systemName: "wand.and.stars")
                    .imageScale(.large)
            }
            .toolbar {
                ToolbarItem(placement: .navigationBarTrailing) {
                    Menu {
                        Button("Test") {
                        }
                    } label: {
                        Image(systemName: "heart")
                    }
                    .popoverTip(popoverTip)
                    .onTapGesture {
                        popoverTip.invalidate(reason: .actionPerformed)
                    }
                }
            }
            .padding()
            .navigationTitle("Popover tip view")
        }
    }
}

Boost

Answer 1

DTS Engineer OP

Apple

Jul ’24

Recommended

@scl-dev Could you try reproducing this using the Highlighting app features with TipKit sample code.

Could you give this a trial:

struct PopoverTip: Tip {
    var title: Text {
        Text("Add an Effect")
            .foregroundStyle(.indigo)
    }
    
    var message: Text? {
        Text("Touch and hold \(Image(systemName: "wand.and.stars")) to add an effect to your favorite image.")
    }
}

struct PopoverView: View {
    // Create an instance of your tip content.
    let popoverTip = PopoverTipTest()
    
    var body: some View {
        NavigationStack {
            VStack(spacing: 20) {
                Text("Hello world")
                
                Image(systemName: "wand.and.stars")
                    .imageScale(.large)
            }
            .toolbar {
                ToolbarItem(placement: .navigationBarTrailing) {
                    Menu {
                        Button("Test") {
                        }
                    } label: {
                        Image(systemName: "heart")
                    }
                    .popoverTip(popoverTip)
                    .onTapGesture {
                        popoverTip.invalidate(reason: .actionPerformed)
                    }
                }
            }
            .padding()
            .navigationTitle("Popover tip view")
        }
    }
}

0