【问题标题】:How to create a plain view in swiftUI如何在 swiftUI 中创建一个普通视图
【发布时间】:2019-06-06 23:44:48
【问题描述】:

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

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

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

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

【问题讨论】:

    标签: ios swift view swiftui ios13


    【解决方案1】:

    只需使用Rectangle()

    正如Documentation 所说:

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

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

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

    【讨论】:

      【解决方案2】:

      以防万一您的用例类似于为 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)
                  }
              }
          }
      }
      

      【讨论】:

        【解决方案3】:

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

        struct CustomView : View {
        
            var body: some View {
                ZStack{
                    Color.red.frame(width: 300, height: 300)
                    Text("This is view")
                }
            }
        }
        

        【讨论】:

          【解决方案4】:

          正如另一个答案中所建议的,您可以使用 Rectangle() 之类的 Shape 并将其设置为 sizeforegroundColor

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

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

          Color.blue
              .frame(width: 10, height: 10)
          

          【讨论】:

            猜你喜欢
            • 2020-08-14
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2011-09-17
            • 2020-06-21
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多