在SwiftUI中更改GroupBox背景颜色

时间:2020-10-09 09:03:29

标签: swiftui ios14 xcode12

如何在SwiftUI中更改GroupBox视图的默认灰色背景颜色?

我尝试添加背景修饰符,但这只会更改框下方的白色背景(请参见屏幕截图)。

interface MyInterface {
  update: () => void;
  func2: () => void;
}

class MyClass {
  a: MyInterface = {
    update: function(){},
    func2: function(){}
  }
}

SwiftUI GroupBox screencapture with gray background and blue corners

2 个答案:

答案 0 :(得分:4)

这是默认的组框样式。您可以使用自定义样式创建所需的任何组框。

这里是一个例子。在Xcode 12 / iOS 14上进行了测试。

demo

struct DemoGroupBox: View {
    var body: some View {
        GroupBox(label: Text("Label"), content: {
             Text("Content")
        })
        .groupBoxStyle(TransparentGroupBox())
        .padding()
    }
}

struct TransparentGroupBox: GroupBoxStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.content
            .frame(maxWidth: .infinity)
            .padding()
            .background(RoundedRectangle(cornerRadius: 8).fill(Color.blue))
            .overlay(configuration.label.padding(.leading, 4), alignment: .topLeading)
    }
}

答案 1 :(得分:0)

尝试使用覆盖修饰符以及所需的任何内容。如果您在叠加层内部使用.fill,它将更改背景颜色,但也会覆盖基础视图。

我使用了清晰的RoundedRectangle视图,而不是.fill。这是一种样式化GroupBox的简便方法。

.overlay(
   RoundedRectangle(cornerRadius: 15)
      .stroke(Color.purple, lineWidth: 5)
  )