3

I have a navigation sidebar on my macOS app built on a custom navigation system.
To navigate to different views I detect .onTapGestures of the list items like so:

List (selection: $selection) {
    ForEach(items, id:\.id) { item in
        getNavButton(navItem: item) //an HStack with an Image and a Text view
            .onTapGesture {
                //change selection
                //navigate to desired view...
            }
    }
}

Whenever I click on an item, it highlights the selection on the sidebar as intented. The problem is that it does not trigger the .onTapGesture unless the click is made on the NavButton.

To fix this I tried increasing the bounds of the HStack that contains the button components. I also tried adding a Spacer inside the stack.

HStack {
    Image(systemName: "house")
    Text("some text...")
    Spacer()
}
.frame(maxWidth: .infinity, maxHeight: .infinity)

This still leaves a small area around the button that does not detect my clicks, seen below. Note: when clicks happen in the red area, they are detected. The red color is pure styling.

Problem image 1


How can I fill the remaining area around the button?
Also, if this approach is ineffective, how should I detect changes in selection?

Lae
  • 832
  • 1
  • 13
  • 34
  • @loremipsum No, the red color is there to indicate the missing area around the button. – Lae Oct 05 '21 at 13:01
  • Does this answer your question https://stackoverflow.com/a/64942577/12299030? – Asperi Oct 05 '21 at 13:04
  • @Asperi No, my problem is not with the color. The color is a pure indication of the missing area. I'm having difficulty making the entire area detect my clicks. – Lae Oct 05 '21 at 13:05
  • Do you have `.padding()` anywhere that view is being touched? – xTwisteDx Oct 05 '21 at 13:12
  • @xTwisteDx This is all of the styling I am using. There is no other styling on any of the objects. I will be trying a combined `.padding` and `.offset` solution now that you mentioned it. Thank you. – Lae Oct 05 '21 at 13:13
  • 2
    Add `.contentShape(Rectangle())` to your button, see https://stackoverflow.com/questions/58500295/swiftui-pick-a-value-from-a-list-with-ontap-gesture – Joakim Danielson Oct 05 '21 at 13:13

0 Answers0