macOS SwiftUI 按钮 "Active Area" 父视图的宽度

Question

对于 macOS 应用程序，我喜欢使用 SwiftUI 在其父视图中扩展按钮的宽度。我试过这个：导入 SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            Button(action: {print("TEST")}) {
                Image(systemName: "clock")
                    .frame(width: 25, height: 25, alignment: .center)
                Text("This is a button")
                    .frame(minWidth: 200, idealWidth: 200, maxWidth: .infinity, minHeight: 25, idealHeight: 25, maxHeight: 25, alignment: .leading)
                Image(systemName: "chevron.left")
                    .frame(width: 25, height: 25, alignment: .center)
            }
            .buttonStyle(PlainButtonStyle())
        }
    }
}

它会产生一个看起来与我正在搜索的结果完全相同的结果，但是如果您单击以下应用程序屏幕截图中标记为红色的区域

按钮操作未触发。第一个图像和文本之间的区域也不会触发操作。我还尝试实现自定义 ButtonStyle 但没有成功。我怎样才能实现一个延伸到父视图整个宽度的按钮？

Answer 1

您可以尝试使用 .contentShape(Rectangle()):

Button(action: { print("TEST") }) {
    HStack {
        // ...
    }
    .frame(maxWidth: .infinity)
    .contentShape(Rectangle())
}

macOS SwiftUI 按钮 "Active Area" 父视图的宽度

macOS SwiftUI Button "Active Area" Width of Parent View

macos

swiftui

swiftui-button