SwiftUI NavigationView navigationBarTitle LayoutConstraints issue

问题

This is maybe related to the new (12.3) version of XCode that came out recently but I have a very simple SwiftUI View:

import SwiftUI

struct HomeView: View {
    var body: some View {
        NavigationView {
            Text("Text")
                .navigationBarTitle("My Title")
        }
    }
}

And I'm getting this warning in the console:

2020-12-15 18:25:06.506062-0800 Shopmatic[46177:9585655] [LayoutConstraints] Unable to simultaneously satisfy constraints.
    Probably at least one of the constraints in the following list is one you don't want. 
    Try this: 
        (1) look at each constraint and try to figure out which you don't expect; 
        (2) find the code that added the unwanted constraint or constraints and fix it. 
(
    "<NSLayoutConstraint:0x600003636d00 'BIB_Trailing_CB_Leading' H:[_UIModernBarButton:0x7faf15d0dc30]-(6)-[_UIModernBarButton:0x7faf15c17500'Your Lists']   (active)>",
    "<NSLayoutConstraint:0x600003636d50 'CB_Trailing_Trailing' _UIModernBarButton:0x7faf15c17500'Your Lists'.trailing <= _UIButtonBarButton:0x7faf15c16140.trailing   (active)>",
    "<NSLayoutConstraint:0x600003631e50 'UINav_static_button_horiz_position' _UIModernBarButton:0x7faf15d0dc30.leading == UILayoutGuide:0x600002c18ee0'UIViewLayoutMarginsGuide'.leading   (active)>",
    "<NSLayoutConstraint:0x600003631ea0 'UINavItemContentGuide-leading' H:[_UIButtonBarButton:0x7faf15c16140]-(0)-[UILayoutGuide:0x600002c18e00'UINavigationBarItemContentLayoutGuide']   (active)>",
    "<NSLayoutConstraint:0x600003617160 'UINavItemContentGuide-trailing' UILayoutGuide:0x600002c18e00'UINavigationBarItemContentLayoutGuide'.trailing == _UINavigationBarContentView:0x7faf15e10000.trailing   (active)>",
    "<NSLayoutConstraint:0x600003632580 'UIView-Encapsulated-Layout-Width' _UINavigationBarContentView:0x7faf15e10000.width == 0   (active)>",
    "<NSLayoutConstraint:0x600003617520 'UIView-leftMargin-guide-constraint' H:|-(0)-[UILayoutGuide:0x600002c18ee0'UIViewLayoutMarginsGuide'](LTR)   (active, names: '|':_UINavigationBarContentView:0x7faf15e10000 )>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x600003636d00 'BIB_Trailing_CB_Leading' H:[_UIModernBarButton:0x7faf15d0dc30]-(6)-[_UIModernBarButton:0x7faf15c17500'Your Lists']   (active)>

Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger.
The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKitCore/UIView.h> may also be helpful.

This simple example looks fine but when I do something a bit more complex:

import SwiftUI

struct ListDetailView: View {
    var list: List
    
    var body: some View {
        NavigationView {
            Text("Detail View")
            .navigationBarTitle("Detail View Title")
            .navigationBarTitleDisplayMode(.large)
            .navigationBarItems(
                trailing:
                    Button(action: {
                        print("Button Pressed")
                    }) {
                        Image(systemName: "ellipsis")
                }
            )
        }
    }
}

The Navigation Title areas layout is all screwed up:

回答1:

I don't get the constraint notice like this import SwiftUI

struct ConstraintIssue: View {
    var body: some View {
        NavigationView {
            Text("Detail View")
                .toolbar(content: {
                    ToolbarItem(placement: .principal, content: {
                        Text("Detail View Title")
                    })
                    ToolbarItem(placement: .navigationBarTrailing, content: {
                      Button(action: {
                        print("Button Pressed")
                      }) {
                        Image(systemName: "ellipsis")
                      })
                   }
                }
            )
        }
    }
}

回答2:

I also have these warnings after updating to Xcode 12.3 today with this simple view but it looks normal with no bugs. guess that is a bug of new Xcode version.

struct ContentView: View {
    var body: some View {
        NavigationView {
            Text("Hello World")
                .navigationTitle("Hello World")
                .toolbar {
                    ToolbarItem(placement: .navigationBarLeading) {
                        Button(action: {},
                            label: {
                            Image(systemName: "plus.circle")
                        })
                    }
                    ToolbarItem(placement: .navigationBarTrailing) {
                        Button(action: {},
                            label: {
                            Image(systemName: "plus.circle")
                        })
                    }
                }
        }
    }
}

Here are the warnings

2020-12-16 14:25:05.897555+0800 TestingSwiftUI[76909:541649] [LayoutConstraints] Unable to simultaneously satisfy constraints.
    Probably at least one of the constraints in the following list is one you don't want. 
    Try this: 
        (1) look at each constraint and try to figure out which you don't expect; 
        (2) find the code that added the unwanted constraint or constraints and fix it. 
(
    "<NSLayoutConstraint:0x600002847020 'BIB_Trailing_CB_Leading' H:[_UIModernBarButton:0x7f7f7fc19680]-(6)-[_UIModernBarButton:0x7f7f8200ff20'HelloWorld']   (active)>",
    "<NSLayoutConstraint:0x600002847070 'CB_Trailing_Trailing' _UIModernBarButton:0x7f7f8200ff20'HelloWorld'.trailing <= _UIButtonBarButton:0x7f7f7fc18740.trailing   (active)>",
    "<NSLayoutConstraint:0x600002847de0 'UINav_static_button_horiz_position' _UIModernBarButton:0x7f7f7fc19680.leading == UILayoutGuide:0x6000032689a0'UIViewLayoutMarginsGuide'.leading   (active)>",
    "<NSLayoutConstraint:0x600002847ed0 'UINavItemContentGuide-leading' H:[_UIButtonBarButton:0x7f7f7fc18740]-(0)-[UILayoutGuide:0x6000032688c0'UINavigationBarItemContentLayoutGuide']   (active)>",
    "<NSLayoutConstraint:0x60000286a440 'UINavItemContentGuide-trailing' UILayoutGuide:0x6000032688c0'UINavigationBarItemContentLayoutGuide'.trailing == _UINavigationBarContentView:0x7f7f8200e2c0.trailing   (active)>",
    "<NSLayoutConstraint:0x60000285c410 'UIView-Encapsulated-Layout-Width' _UINavigationBarContentView:0x7f7f8200e2c0.width == 0   (active)>",
    "<NSLayoutConstraint:0x60000286a800 'UIView-leftMargin-guide-constraint' H:|-(0)-[UILayoutGuide:0x6000032689a0'UIViewLayoutMarginsGuide'](LTR)   (active, names: '|':_UINavigationBarContentView:0x7f7f8200e2c0 )>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x600002847020 'BIB_Trailing_CB_Leading' H:[_UIModernBarButton:0x7f7f7fc19680]-(6)-[_UIModernBarButton:0x7f7f8200ff20'HelloWorld']   (active)>

Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger.
The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKitCore/UIView.h> may also be helpful.

when I delete

.navigationTitle("Hello World")

the warnings disappeared

so I'm gonna report this issue to Apple

this view looks normal

回答3:

i think it's a xCode new version BUG. In the previous version there is no such error.

回答4:

NavigationBarTitle and NavigationTitle is deprecated from iOS 14.3 https://developer.apple.com/documentation/swiftui/view/navigationbartitle(_:displaymode:)-8buvp

You can use toolbar and navigationBarTitleDisplayMode(_:)

import SwiftUI

struct HomeView: View {
    var body: some View {
        NavigationView {
            Text("Text")
                .navigationBarTitleDisplayMode(.inline)
                .toolbar(content: {
                    ToolbarItem(placement: .principal, content: {
                        Text("Widget")
                    })
                    ToolbarItem(placement: .navigationBarTrailing, content: {
                        Button(action: {
                            print("Button Pressed")
                        }) {
                            Image(systemName: "ellipsis")
                        }
                    })
                })
        }
    }
}

来源：https://stackoverflow.com/questions/65316497/swiftui-navigationview-navigationbartitle-layoutconstraints-issue