SwiftUI通过百分比高度调整VStack的框架大小

Question

我有名片视图。我给自己的尺寸。我知道那是错的。我想将其调整大小并除以blue = 70%和red = 30%之类的百分比。但是不知道如何。我是SwiftUI的新手。下面是我的代码：

let screen = UIScreen.main.bounds

struct CardView: View {
  var body: some View {
    VStack {
      VStack {
        Text("Blue")
      }
      .frame(width: screen.width - 60, height: 180)
      .background(Color.blue)
      VStack {
        Text("Red")
      }
      .frame(width: screen.width - 60, height: 100)
      .background(Color.red)
    }
    .frame(width: screen.width - 60, height: 280)
  }
}

我的看法是：

here

Answer 1

这是基于GeometryReader的可计算的相对布局解决方案（注意：在可能会在不同模型上引入预期布局的情况下，使用NSScreen是不合适的）

通过Xcode 12b测试

struct CardView: View {
    var body: some View {
        GeometryReader { gp in
            VStack {
                VStack {
                    Text("Blue")
                }
                .frame(width: gp.size.width, height: gp.size.height * 0.7)
                .background(Color.blue)
                VStack {
                    Text("Red")
                }
                .frame(width: gp.size.width, height: gp.size.height * 0.3)
                .background(Color.red)
            }
        }
        .frame(height: 280).frame(maxWidth: .infinity)
        .cornerRadius(24).padding(.horizontal, 30)
    }
}