0

I have very simple code, like so:

struct ContentView: View {
    var body: some View {
        TabView {
            FirstView()
        }
        .tabViewStyle(.page)
    }
}

struct FirstView: View {
    var body: some View {
        NavigationView {
            Text("Content")
                .navigationTitle("Title")
        }
    }
}

When using NavigationView in a TabView, strange behaviour occurs. In iOS 15, I get errors such as:

... [LayoutConstraints] Unable to simultaneously satisfy constraints.
...
Will attempt to recover by breaking constraint <NSLayoutConstraint:0x6000010e5ae0 'BIB_Leading_Leading' H:|-(0)-[_UIModernBarButton:0x7fbd1d618dc0] (active, names: '|':_UIButtonBarButton:0x7fbd1d506d80 )>

In iOS 14, I get the same logs but also the view looks wrong:

Bad result

And upon clicking on the back button 'Title', I get the log:

... [Assert] unknown display mode: Automatic

When adding .navigationViewStyle(.stack), the title has no space on the leading side like it would by default:

Result when changing style

And when using this style with more complex content such as below, the views go behind the navigation title and just ignore it:

NavigationView {
    VStack {
        Text("Top")

        Spacer()

        Text("Bottom")
    }
    .navigationTitle("Title")
}
.navigationViewStyle(.stack)

Result when using Spacer()

How can I fix this for iOS 14? I can accept the logs for both, but what workaround (or real solution if possible) is there to fix this?

George
  • 25,988
  • 10
  • 79
  • 133
  • You probably want to use `.navigationViewStyle(StackNavigationViewStyle()`) in iOS14, and `.navigationViewStyle(.stack)` in iOS15. Modifer applied to `NavigationView`. See https://stackoverflow.com/questions/65316497/swiftui-navigationview-navigationbartitle-layoutconstraints-issue?rq=1 – rbaldwin Jul 04 '21 at 05:32
  • @rbaldwin There is no difference between `.stack` and `StackNavigationViewStyle()` - they are both available since iOS 13 (but can `.stack` now be used because of a Swift evolution feature). However, I did try it and although it no longer shows the back button, the nav title is shifted to the side incorrectly (no spacing on leading side). When using more complex content that has a `Spacer()` in it, the content is underneath the navigation title. Do you know how to fix this? – George Jul 04 '21 at 13:15
  • @rbaldwin I have updated my question with more images to show the issue. And it's not a duplicate of that question either as this seems to be a different problem. – George Jul 04 '21 at 13:24

0 Answers0