SwiftUI NavigationView nested in PageTabView wrong aligned on first appear

Question

The NavigationViews inside my PageTabView are wrong aligned on first appear. When i scroll to another page on my PageTabView and go back to the first page, the alignment is correct. The content of the navigationview (red) is beneath the navigationbar on first appear.

Image of first appearance of the NavigationView

Image of the second appearance of the NavigationView

struct ContentView: View {    
    var body: some View {
        TabView {
            ForEach(0..<3) { index in
                NavigationView {
                    Color.red
                        .navigationTitle("\(index). Page")
                }
                .navigationViewStyle(StackNavigationViewStyle())
            }
        }
        .tabViewStyle(.page)
    }
}

Edit: I want to build the layout of the rooms tab in the apple home app in compact mode. Therefore the TabView in the code above gets wrapped in another tabview without the pagetabviewstyle modifier. This works, but the same extracted problem in the code above happens.

Answer 1

var body: some View {
        NavigationView {
            TabView {
                ForEach(0..<3) { index in
                    Color.red
                        .navigationTitle("\(index). Page")
                }
                
            }
            .tabViewStyle(.page)
        }
    }

Just moved NavigationView outside, it fixed the problem