SwiftUI NavigationView布局问题

Question

使用SwiftUI时，我的NavigationView和Title永远不会出现在我希望它们在设备或模拟器上运行时出现的位置。我希望它们位于左上角的“后退”按钮下，但是当在设备或模拟器上运行时，它在页面的下方很长，这是我的模拟器的屏幕截图，其尺寸在预览旁边进行了调整，您可以看到这有何不同

这是我的代码：

import SwiftUI

struct DetailView: View {
    let tarot: Tarot
    var body: some View {
        NavigationView {
            VStack() {
                Image(tarot.tarotImage)
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .frame(width: 200, height: 200)
                    .padding(.init(top: 80, leading: 30, bottom: 80, trailing: 30))
                Text(tarot.tarotDescription)
                    .padding(.horizontal)
            }
            .navigationBarTitle(tarot.tarotName, displayMode: .automatic)
        }
    }
}

struct DetailView_Previews: PreviewProvider {
    static var previews: some View {
        DetailView(tarot: cardsArray[0])
    }
}

Answer 1

您的导航堆栈中不应包含多个NavigationView。

尝试从NavigationView中删除DetailView：

struct DetailView: View {
    let tarot: Tarot
    var body: some View {
        VStack {
            Image(tarot.tarotImage)
                .resizable()
                .aspectRatio(contentMode: .fill)
                .frame(width: 200, height: 200)
                .padding(.init(top: 80, leading: 30, bottom: 80, trailing: 30))
            Text(tarot.tarotDescription)
                .padding(.horizontal)
        }
        .navigationBarTitle(tarot.tarotName, displayMode: .automatic)
    }
}