Why is SwiftUI presented view displayed incorrectly?

164 views Asked by At

I've created a SwiftUI "multiplatform" (iOS and macOS) app from the Xcode 12 beta 6 (12A8189n) app template.

My issue is that one of my views, AnotherView, is displaying incorrectly. Here's a gif showing the problem. Notice that AnotherView displays with the navigation stack already pushed to a non-existent view. Tapping the back button reveals the expected screen, however it is displayed only partially filling the expected area.

Demo

Here's the code:

TestNavigationApp.swift

import SwiftUI

@main
struct TestNavigationApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

ContentView.swift

import SwiftUI

struct ContentView: View {
    
    @State private var presentingFirstView = false
    
    var body: some View {
        Button(action: { self.presentingFirstView = true }) {
            
            Text("Present First View")
        }
        .sheet(isPresented: $presentingFirstView) {

            FirstView(isPresented: $presentingFirstView)
        }
    }
}

FirstView.swift

import SwiftUI

struct FirstView: View {
    
    @Binding var isPresented: Bool

    var body: some View {
        
        NavigationView {
            EmbeddedView()
                .navigationBarTitle("First View", displayMode: .large)
        }
    }
}

EmbeddedView.swift

import SwiftUI

struct EmbeddedView: View {
    
    @State private var presentingAnotherView = false
    
    var body: some View {

        VStack {
            Text("Embedded View")
            
            Button(action: { self.presentingAnotherView = true }) {
                
                Text("Present Another View")
            }
        }
        .sheet(isPresented: $presentingAnotherView) {

            AnotherView(isPresented: $presentingAnotherView)
        }
    }
}

AnotherView.swift

import SwiftUI

struct AnotherView: View {
    
    @Binding var isPresented: Bool
    
    var body: some View {
        NavigationView {
            Text("Another View")
                .navigationBarTitle("Another View", displayMode: .large)
        }
    }
}

Anyway, not really sure what's happening here. Any suggestions appreciated.

1

There are 1 answers

0
Asperi On BEST ANSWER

Try to use navigation view style explicitly

var body: some View {
    NavigationView {
        Text("Another View")
            .navigationBarTitle("Another View", displayMode: .large)
    }.navigationViewStyle(StackNavigationViewStyle())
}