SwiftUI 填充在 iPad（横向）中不起作用

Question

这是我的 iPad 应用程序的预览。如何在 iPad 的纵向和横向方向上为我的图像（食物图像）添加填充？填充在纵向模式下效果很好，为什么它在横向模式下不起作用（顶部和底部填充）？

这是我的代码

struct ContentView: View {
var body: some View {
    ZStack {
        Image("bg_home")
            .resizable()
            .scaledToFill()
            .opacity(0.3)
        GeometryReader {
            geo in
            HStack(alignment: .center) {
                Image("ketupat_home")
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .frame(width: geo.size.width/2, height: geo.size.height * 0.95, alignment: .center)
                    .cornerRadius(30)
                    .padding()
                
                VStack {
                    Text("Lorem Impsum Title")
                        .fontWeight(.bold)
                        .font(.system(size: 64))
                        .multilineTextAlignment(.center)
                    .frame(maxWidth: .infinity, alignment: .center)
                    .padding(.leading, 10)
                    
                    Text("(Lorem Ipsum Sub Title)")
                        .fontWeight(.medium)
                        .font(.system(size: 32))
                        .multilineTextAlignment(.center)
                    .frame(maxWidth: .infinity, alignment: .center)
                    
                    Button {
                        print("Let's Go")
                    } label: {
                        Text("Let's Go")
                            .frame(width: geo.size.width/4, height: 75, alignment: .center)
                            .font(.system(size: 32))
                            .background(.orange)
                            .foregroundColor(.white)
                            .cornerRadius(100)
                            
                            
                    }
                    .padding()
                    .cornerRadius(10)
                    
                    Image(systemName: "speaker.slash.fill")
                        .resizable()
                        .frame(width: 40, height: 40, alignment: .center)
                        .padding()
                }
            }
            .padding(.all, 32)
            
        }
    }
}

}

Answer 1

填充工作正常。你看不到边距的原因是图像溢出了它的框架，因为它太大并且修饰符 .aspectRatio(contentMode: .fill).

您可以将其更改为 .aspectRatio(contentMode: .fit)

但这会使图像变小以适合其容器。您可以保留原始修饰符并在 aspectRatio 修饰符之后尝试 .clipped()。

SwiftUI 填充在 iPad（横向）中不起作用

SwiftUI Padding Not Working in iPad (Landscape Orientation)

swift

ipad

layout

swiftui

padding