SwiftUI: How can I increase the area in which a button can be triggered?

Question

How can I increase the area in which a button can be triggered without changing the UI?

This is my code

struct ContentView: View {
    var body: some View {
        NavigationView {
            Text("Text")

            .navigationBarTitle(Text("Title"))
            .navigationBarItems(
                leading:
                Button(action: { print("add") }) {
                    Image(systemName: SFSymbolName.plus)
                        .font(.system(size: 18))
                }
            )
        }
    }
}

Answer 1

For this particular situation, You can add padding to all edges excluding the leading edge to the label of the button:

Button(action: { print("add") }) {
    Text("+")
        .padding(EdgeInsets(top: 20, leading: 0, bottom: 20, trailing: 50))
}
.background(Color.red) // This is just for seeing the hit area. You should get rid of it

Note that The maximum tappable area should be inside the rectangle above the title:

Answer 2

The Button is as big as it's content. In your case, it is as big as the image. Your button, or the tappable area, is small because the image is just small.

You can contain your image in a bigger frame, like this:

Button(action: { print("add") }) {
    Image(systemName: SFSymbolName.plus)
        .font(.system(size: 18))
        .frame(width: 40, height: 40)
}