SwiftUI-在视图中包装按钮,以创建自定义按钮



我正试图创建我自己版本的Button,将其包装在视图中,从而打开添加更多功能/隐藏样式修改器的功能。我知道这不会带来好处,而且ButtonStyles很强大。但为了超级干净的代码,我对如何实现它很感兴趣。

在它最精简的形式中,我想写一些类似的东西(基于Button自己的签名(:

struct MyCustomButton: View {
let action : () -> Void
let contents : () -> PrimitiveButtonStyleConfiguration.Label
var body : some View {
Button(action: self.action) {
self.contents()
}
}
}

然而,当我尝试使用它时…

struct MyView : View {
var body : some View {
MyCustomButton(action: { doSomething() }) {
Text("My custom button")
}
}
}

我收到以下编译错误:无法将"Text"类型的值转换为"PrimitiveButtonStyleConfiguration.Label"类型的闭包结果

已经解决了这个问题:

struct NewButton<Content: View> : View {
let content : ()-> Content
let action: () -> Void
init(@ViewBuilder content: @escaping () -> Content, action: @escaping () -> Void) {
self.content = content
self.action = action
}
var body: some View {
Button(action: self.action) {
content()
}
}
}

您不需要更改Button,根据SwiftUI的设计意图,只需要提供自定义的ButtonStyle即可,如下例所示。

struct ScaleButtonStyle: ButtonStyle {
let bgColor: Color
func makeBody(configuration: Self.Configuration) -> some View {
configuration.label
.background(bgColor)
.scaleEffect(configuration.isPressed ? 5 : 1)
}
}
struct DemoScaleButtonStyle: View {
var body: some View {
Button(action: { }) {
Text("Button")
.foregroundColor(.white)
}.buttonStyle(ScaleButtonStyle(bgColor: Color.red))
}
}

最新更新