时间戳

首页 > 解决方案 > 质疑 SwiftUI 中 Spacers 的动态性

swiftui - 质疑 SwiftUI 中 Spacers 的动态性

问题描述

我从多个地方听说垫片是动态的/相对于不同的屏幕尺寸。我一直将它们用作我布局的重要部分，但它们让我失望了。如果我使用不正确，有人可以告诉我吗？这是一个矩形的示例，上面有一个 HStack 正方形。由于矩形一开始就很大，而且我还需要将它向下推到屏幕上，所以我使用了很多垫片（这似乎没有必要）。我尝试过使用填充，但它并没有按我的需要向下推。在我提供的代码之后，您将看到两张图片。一个是 iPod touch（第 7 代），另一个是 iPhone 12 Pro Max。跨设备的布局完全不匹配。我的目标是让这两款设备都拥有 iPod touch 所拥有的布局部分。

ZStack {
        VStack {
            ForEach(1..<38)  { _ in
                Spacer()
            }
            Rectangle()
                .fill(Color.blue)
        }
        VStack {
            Spacer()
            Spacer()

            HStack {
                Rectangle()
                    .scaledToFit()
                Rectangle()
                    .scaledToFit()
                Rectangle()
                    .scaledToFit()
                Rectangle()
                    .scaledToFit()
                Rectangle()
                    .scaledToFit()
            }

            Spacer()
        }
    }

iPod 触摸 iPhone 12 Pro Max

标签： swiftui

解决方案

你不应该需要多个Spacer()

GeometryReader { geometry in
    VStack {
        Spacer()
        
        VStack {
            HStack {
                ForEach(0..<5) {_ in
                    Rectangle()
                        .scaledToFit()
                }
            }
            .padding(.vertical)
            
            Spacer()
        }
        .background(Color.blue)
        .frame(height: geometry.size.height * 0.4)
    }
}

这是你想要达到的目标吗？如果您知道蓝色背景视图的大小，我现在将其设置为相对于屏幕高度的 40%，然后Spacer()将用空间填充屏幕的其余部分。

推荐阅读