5

我正在尝试在SwiftUI中创建具有背景颜色的普通视图。但我能找到的所有元素都不是普通视图,如文本、按钮、图像、列表等。

当我尝试使用View时,它会显示以下错误消息:

  • 无法构造“视图”,因为它没有可访问的初始化程序
  • 'View' 协议只能用作通用约束,因为它具有 Self 或 associatedType 要求

如何创建具有背景颜色的矩形视图?

4

4 回答 4

12

只需使用Rectangle()

正如文档所述:

在包含它的视图的框架内对齐的矩形形状。

这是一个具有固定大小和背景颜色的矩形示例

Rectangle()
    .size(CGSize(width: 10, height: 10))
    .foregroundColor(.red)
于 2019-06-06T23:44:48.723 回答
4

以防万一您的用例类似于为 TextField 视图创建背景,这里是我的演示

此处的示例将创建一个具有不透明辅助背景的小视图,然后在其顶部呈现一个标签,该标签表示用户输入一个位置,另一个白色圆角矩形,以及在白色矩形内的 TextField()。

struct InputView : View {
    @State var text:          String

    var body: some View {
        ZStack{
            RoundedRectangle(cornerRadius: 15).frame(width: 310, height: 100)
                .foregroundColor(.secondary)
                .offset(y: -20)
            ZStack{
                RoundedRectangle(cornerRadius: 30).frame(width: 290, height: 40)
                    .foregroundColor(.white)
                TextField($text, placeholder: Text("City, State, Address")) {
                        print(self.text)
                        self.didEnter.toggle()
                    }
                        .frame(width: 220, height: 40, alignment: .leading)
                        .offset(x: -20)
                Text("Select Location:").bold().fontWeight(.medium)
                    .offset(y: -40)
                    .foregroundColor(.white)
            }
        }
    }
}
于 2019-06-11T17:10:17.310 回答
2

这是另一种创建类似UIView的方法。在 SwiftUI 中,每个原始视图都像 UIView 一样工作。

struct CustomView : View {

    var body: some View {
        ZStack{
            Color.red.frame(width: 300, height: 300)
            Text("This is view")
        }
    }
}
于 2019-07-05T13:04:42.700 回答
1

正如另一个答案中所建议的,您可以使用 Shape likeRectangle()并将其设置为sizeand foregroundColor

Rectangle()
    .size(CGSize(width: 10, height: 10))
    .foregroundColor(.blue)

但我认为Color直接使用更简单:

Color.blue
    .frame(width: 10, height: 10)
于 2019-06-08T03:41:33.703 回答