SwiftUI вид находится посередине, а не сверху

Question

Я пытаюсь создать представление в SwiftUI.В предварительном просмотре это выглядит так, как должно, но при запуске на моем iPhone (или в режиме предварительного просмотра) это выглядит как смещение.

Я попытался установить отступ -150, но затем TextFieldне реагирует на прикосновения.

VStack {
    Text("Name:")
        .padding(.bottom, 1)
    TextField($name)
        .padding(.horizontal, 25.0)
        .textFieldStyle(.roundedBorder)
        .frame(maxWidth: 500)
    Text("Image:")
        .padding(.top, 1)
    Image(uiImage: image!)
        .resizable(capInsets: EdgeInsets(), resizingMode: .stretch)
        .scaledToFit()
        .frame(width: 250, height: 250)
        .clipShape(RoundedRectangle(cornerRadius: 10))
        .padding(.top, 5)
    Button(action: {
        withAnimation {
            self.showImagePicker = true
        }
    }) {
        Text("Select Image")
            .color(.init(red: 20/255, green: 146/255, blue: 81/255))
    }
    Button(action: {
        let list = LSList( title: self.name,
                                           image: self.image!,
                                           id: 0)
        list.add()
        self.userData.listsData.append(list)
    }) {
        Text("Add List")
            .color(.white)
            .font(.system(size: 25))
            .bold()
            .padding(.horizontal, 7)
            .frame(height: 35)
            .background(Color.green)
            .clipShape(RoundedRectangle(cornerRadius: 3))
    }
    Spacer()
} .navigationBarTitle(Text("Add List"))

Просмотр в превью:

Просмотр на моем iPhone:

Answer 1

Предполагая, что ваш VStack обернут в NavigationView, это причина того, что он некорректно рендерит в симуляторе. Причина, по которой он хорошо отображается в предварительном просмотре, заключается в том, что он не отображает панель навигации (которая включает в себя и кнопку «Назад»), поскольку холст не знает, что это представление может быть нажато, но во время выполнения панель навигации добавляется, пока вы также используя дополнительный NavigationView, а также.

Чтобы исправить это, разверните VStack из NavigationView и просто удалите этот NavigationView из дочернего представления.

Answer 2

1. Чтобы сделать его видимым правильно с элементами навигации в предварительном просмотре (даже для дочерних представлений), вам нужно обернуть представление в NavigationView { }, потому что Canvas - пустая чистая среда, и он не знает, чтоВид может быть помещен в NavigationView
2. . Чтобы исправить это на iPhone, убедитесь, что вы правильно нажимаете дочерний вид.Это должно быть NavigationButton(destination: AddList()) {}

Пример реализации RowView:

   NavigationButton(destination: CarDetail(car: car)) {
      HStack {
        VStack(alignment: .leading) {
          Text(car.name)
          Text(car.isAvailable ? "Is Available" : "Out of stock")
            .font(.subheadline)
            .foregroundColor(.secondary)
        }
      }
    }