如何将其移至顶部？

Question

我刚刚学会了如何实现特定的圆角，但现在似乎没有任何内容会与屏幕顶部对齐，即使使用间隔符也是如此。如何让它与屏幕顶部对齐？

此外，我希望果岭忽略顶部安全区域，但它之前也没有这样做。

import SwiftUI

struct Dashboard: View {
    
    @State var bottomLeft: CGFloat = 25
    
    var body: some View {
        ZStack {
            Color("background")
                .edgesIgnoringSafeArea(.all)
            
            VStack {
                VStack {
                    Text("Good Morning, Sarah")
                        .font(Font.system(size: 36))
                        .foregroundColor(.standaloneLabelColor)
                        .fontWeight(.semibold)
                        .frame(maxWidth: .infinity, alignment: .leading)
                        .padding(.horizontal)
                    
                    Text("We're glad to see you and hope you're doing well. Let's take on the day.")
                        .font(Font.system(size: 20))
                        .foregroundColor(.standaloneLabelColor)
                        .frame(maxWidth: .infinity, alignment: .leading)
                        .padding(.horizontal)
                        .padding(.bottom)
                }
                .background(Color.appColor)
                .cornerRadius(bottomLeft, corners: .bottomLeft)
                .padding(.bottom, 10)
            
            
        }
            
            Spacer()
        }
        
    }
}

提前致谢。

Answer 1

您可以将 ZStack 上的对齐设置为 .top。然后您还可以删除 Spacer.

A Spacer 在 ZStack 中什么都不做 - 因为它在自己的层上。但是在 ZStack 上设置对齐方式会将 all 视图对齐到顶部。如果这不是您想要的，您也可以将 Spacer 放在内部 VStack 中，其中的内容也将全部对齐到顶部。

代码：

ZStack(alignment: .top) {
    Color("background")
        .edgesIgnoringSafeArea(.all)

    VStack {
        /* ... */
    }
}

此外，要在应用圆角时忽略顶部的安全区域，您应该剪掉圆角并在 background 内使用 ignoresSafeArea()。这确保您只忽略背景的安全区域，而不是整个视图。执行以下操作：

.background(
    Color.appColor
        .cornerRadius(bottomLeft, corners: .bottomLeft)
        .ignoresSafeArea()
)
// .background(Color.appColor)
// .cornerRadius(bottomLeft, corners: .bottomLeft)
.padding(.bottom, 10)

Answer 2

我不得不从你的代码中删除一些位，因为它们在我这边产生了错误。使用我所拥有的，您需要在适当的 VStack 下面添加一个 Spacer()。

由于您的内容存储在嵌入另一个 VStack 的 VStack 中，因此外部 VStack 基本上是整个视图所在的位置。在其下方放置一个 Spacer 会将其推到屏幕顶部。

如果您不想让视图触及屏幕顶部，您还可以在 VStack 的顶部添加填充以将视图下移。

代码如下：

    import SwiftUI

struct ContentView: View {
    @State var bottomLeft: CGFloat = 25
    
    var body: some View {
        ZStack {
            Color("background")
                .edgesIgnoringSafeArea(.all)
            VStack {
                VStack {
                    Text("Good Morning, Sarah")
                        .font(Font.system(size: 36))
                        .foregroundColor(Color.blue)
                        .fontWeight(.semibold)
                        .frame(maxWidth: .infinity, alignment: .leading)
                        .padding(.horizontal)
                    
                    Text("We're glad to see you and hope you're doing well. Let's take on the day.")
                        .font(Font.system(size: 20))
                        .foregroundColor(Color.blue)
                        .frame(maxWidth: .infinity, alignment: .leading)
                        .padding(.horizontal)
                        .padding(.bottom)
                }
                .background(Color.green)
                .cornerRadius(bottomLeft)
                .padding(.bottom, 10)
                
                Spacer() //Added a spacer here
            }
        }
    }
}

如何将其移至顶部？

How to move this to the top?

alignment

swift

swiftui

safearea