为什么我的 Button 样式对象仅适用于按钮内的文本，而不适用于整个按钮？

Question

我有一个ButtonStyle 对象，我希望在点击Button 时使用它。但是，当我在我的Button 上调用它时，效果仅在按钮内的文本上可见，而不是在整个Button 上。 我试过在外面打电话，但无济于事。有人可以向我解释如何解决我的错误吗？

Button(action: {

    }) {
        Text("Button")
            .foregroundColor(.white)
    }.background(Color.red)
     .buttonStyle(ScaleButtonStyle())


struct ScaleButtonStyle: ButtonStyle {
    func makeBody(configuration: Self.Configuration) -> some View {
        configuration.label
            .scaleEffect(configuration.isPressed ? 5 : 1)
    }
}

编辑：

Button(action: {}) {
            Text("Button")
                .fontWeight(.semibold)
                .foregroundColor(.white)
                .font(.title)
        }
        .buttonStyle(ScaleButtonStyle(bgColor: Color.red))
        .frame(width: geo.size.width*0.8, height: geo.size.height*0.1, alignment: .center)
        .background(Color.red)
        .clipShape(Rectangle())


struct ScaleButtonStyle: ButtonStyle {
 let bgColor: Color

 func makeBody(configuration: Self.Configuration) -> some View {
    configuration.label
        .background(bgColor)
        .scaleEffect(configuration.isPressed ? 5 : 1)
 }
}

Answer 1

解决方案是将背景作为按钮样式的一部分，如下所示。

使用 Xcode 11.4 / iOS 13.4 测试

struct ScaleButtonStyle: ButtonStyle {
    let bgColor: Color
    func makeBody(configuration: Self.Configuration) -> some View {
        configuration.label
            .background(bgColor)
            .scaleEffect(configuration.isPressed ? 5 : 1)
    }
}

struct TestScaleButtonStyle: View {
    var body: some View {
        Button(action: { }) {
            Text("Button")
                .foregroundColor(.white)
        }.buttonStyle(ScaleButtonStyle(bgColor: Color.red))
    }
}