SwiftUI 目标视图的额外元素

Question

Can someone explain why there are 2 UI elements(UINavigationBarContentView, UINavigationBarLargeTitleView) between the Image(the blue rectangle) and navigation bar title(text One )?

The code I use is this:

let item: ImageNameModel
@State private var image: Image?

var body: some View {
    NavigationView {
        VStack {
            if image != nil {
                image?.resizable().scaledToFit()
            } else {
                Text("Image not loaded")
            }
        }
        .padding([.horizontal, .bottom])
    }
    .navigationBarTitle(Text(item.name))
    .onAppear(perform: loadImage)
}

Answer 1

It's probably because of the extra NavigationView.

You don't need to have a NavigationView wrapping your destination.

For example, with this sample code here:

struct RootView: View {
    var body: some View {
        NavigationView {
            NavigationLink(destination: DestinationView()) {
                Text("Click here")
            }.navigationBarTitle(Text("Title"))
        }
    }
}

struct DestinationView: View {
    var body: some View {
        NavigationView {
            Text("Destination")
                .navigationBarTitle(Text("Destination"))
        }
    }
}

I get a result like this:

But If I remove the NavigationView from DestinationView , I get the result that is probably what you expect: