Question

新手在这里！我正在使用Swiftui构建测验应用程序，我通过在iPhone 11模拟器中预览来构建视图控制器。

我认为controlview将适合其他iPhone尺寸，例如iPhone8。因为Swiftui具有内置的自动布局。

但是当我运行iPhone 8模拟器时，控件视图中的某些内容不可见，因为它们位于屏幕下方。

有办法解决吗？

我尝试使用多个Spacer（）和不同的填充，但是我似乎无法使其同时在两个屏幕上看起来都很好。

这是我的代码：

import SwiftUI

struct questionOne: View {


    @State var totalClicked: Int = 0
    @State var showDetails = false
    @State var isSelected = false

    var body: some View {
        VStack {

            TRpic().frame(width: 350.0, height: 233.0).cornerRadius(10).padding(.top, 80)

            Spacer()

            Text(verbatim: "What's the capital of Turkey?")
                .font(.title)
                .padding(.bottom, 60)
                .frame(height: 100.0)




            Button(action: {}) {

                Text("Istanbul")
            }.buttonStyle(MyButtonStyle())


            Spacer()

            Button(action: {self.isSelected.toggle()}) {
                Text("Ankara")
            }.buttonStyle(SelectedButtonStyle(isSelected: $isSelected))


            Spacer()

            Button(action: {}) {
                Text("Athens")

            } .buttonStyle(MyButtonStyle())

            Spacer()



            NavigationLink(destination: questionTwo()) {
        VStack {
                Text("Next Question")

               Adview().frame(width: 150, height: 60)
                }

               }

            }.edgesIgnoringSafeArea(.top)
        }
    }

struct MyButtonStyle: ButtonStyle {

  func makeBody(configuration:

    Self.Configuration) -> some View {
    configuration.label
      .padding(20)
      .foregroundColor(.white)
      .background(configuration.isPressed ? Color.red : Color.gray)
      .cornerRadius(10.0)
  }
}

struct SelectedButtonStyle: ButtonStyle {

    @Binding var isSelected: Bool

    public func makeBody(configuration: Self.Configuration) -> some View {
        configuration.label
            .padding(20)
            .foregroundColor(.white)
            .background(isSelected ? Color.green : Color.gray)
            .cornerRadius(10.0)
    }
}

enter image description here

Screenshot

Answer 1

在给定的上下文中，我猜您不希望使用滚动视图，因此，关于间距，我建议使用带有间距参数VStack的{{1}}并移除垫片，如果两个视图之间需要另一个距离大于n，只需使用VStack(alignment: .center, spacing: n){ ... }添加一些额外的空间。这应该调整所有内容以适合任何屏幕（包括图像）的高度，因此不需要固定的框架。

但是，您可能有一个非常宽的图像，可能超出了安全区域，因此，您可以将图像的最大宽度设置为屏幕宽度

padding

如何将contentview缩放到多个屏幕尺寸？ SwiftUI

1 个答案: