SwiftUI: 如何增加按钮可以触发的区域？

Question

如何在不改变用户界面的情况下增加按钮可以触发的区域？

这是我的代码。

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))
                }
            )
        }
    }
}

- Mattis Schulte

Answer 1

对于这种特殊情况，您可以在所有边缘上添加填充，但不包括按钮标签的前缘。

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

请注意，可点击区域的最大范围应该在标题上方的矩形内。

[

请注意，只有在条形区域内部才能点击。因此，在上面的示例中，标题的重叠部分和条形顶部的重叠部分都不能点击！

- Mojtaba Hosseini

Answer 2

Button的大小与其内容一样大，对于你的情况，它的大小与图片一样大。由于图像很小，所以你的按钮或可点击区域也很小。

你可以将图像放在一个更大的frame中，就像这样：

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

- samwize