Comment augmenter la zone touchable de l'élément NavigationBarItem dans SwiftUI ?

Question

J'ai ce code pour mon view

struct ContentView: View {
    var body: some View {
        NavigationView{
            List{
                ForEach(0...5, id: \.self) { note in
                    VStack(alignment: .leading) {
                        Text("title")
                        Text("subtitle")
                            .font(.subheadline)
                            .foregroundColor(.secondary)
                    }
                }
            }
            .navigationBarItems(trailing: resetButton)
            .navigationBarTitle(Text("Notes"))
        }
    }

    var resetButton: some View {
        Button(action: {
            print("reset")
        }) {
            Image(systemName: "arrow.clockwise")
        }
        .background(Color.yellow)
    }
} 

resetButton ressemble à ça :

Quand je tape sur le resetButton il semble que seule la zone jaune réagisse au toucher.

Comment puis-je agrandir la zone touchable de ce bouton (pour qu'il se comporte comme un bouton normal) ? UIBarButtonItem )

Answer 1

Vous pouvez modifier le cadre de la view à l'intérieur de le bouton :

var resetButton: some View {
    Button(action: {
        print("reset")
    }) {
        Image(systemName: "arrow.clockwise")
        .frame(width: 44, height: 44) // Or any other size you like
    }
    .background(Color.yellow)
}

Answer 2

Cet article de blog m'a mis dans la bonne direction, j'avais besoin d'ajouter du rembourrage directement à l'image.

Button(action: {
    // Triggered code
}) {
    Image(systemName: "plus")
        .font(.system(size: 22, weight: .regular))
        .padding(.vertical)
        .padding(.leading, 60)
}
.background(Color.red) // Not needed