SwiftUI: Views with different ToolbarItem placement cause app crash - swiftui

Question

I get an application crash when using views with different ToolbarItem placements. Below is a code snippet that allows you to reproduce the crash.
Behavior
I use 3 views, each with its own defined toolbar. homeView and profileView have the same toolbar structure. They each use a ToolbarItem with a .bottomBar placement. The addView on the other hand has a ToolbarItem in the toolbar placed on the action `.cancellationAction'.
When a ToolbarItem is pressed, the viewState in the ViewModel is changed. This results in a change of the currently displayed view.
Error Msg:
[error] precondition failure: invalid attribute id: 70981 AttributeGraph precondition failure: invalid attribute id: 70981.
Target
iPhone X 14.0 (18A373)
Code snippet:
import SwiftUI
struct SomeView: View {
#ObservedObject var viewModel = ViewModel()
var body: some View {
NavigationView() {
content
}
}
private var content: AnyView {
switch(viewModel.viewState) {
case .home: return AnyView(homeView());
case .add: return AnyView(addView());
case .profile: return AnyView(profileView());
}
}
func homeView() -> some View {
Text("Home View")
.toolbar {
ToolbarItem(placement: .bottomBar) {
HStack {
Button("Home", action: { viewModel.setViewState(state: .home) })
Button("Add", action: { viewModel.setViewState(state: .add) })
Button("Profile", action: { viewModel.setViewState(state: .profile) })
}
}
}
}
func addView() -> some View {
Text("Add View")
.toolbar {
ToolbarItem(placement: .cancellationAction) {
Button("Cancel", action: { viewModel.setViewState(state: .home)})
}
}
}
func profileView() -> some View {
Text("Profile View")
.toolbar {
ToolbarItem(placement: .bottomBar) {
HStack {
Button("Home", action: { viewModel.setViewState(state: .home) })
Button("Add", action: { viewModel.setViewState(state: .add) })
Button("Profile", action: { viewModel.setViewState(state: .profile) })
}
}
}
}
}
// MARK: View Model
extension SomeView {
class ViewModel: ObservableObject {
#Published var viewState: ViewState
enum ViewState {
case home, add, profile
}
init() {
self.viewState = .home
}
func setViewState(state: ViewState) {
self.viewState = state;
}
}
}
// MARK: Preview
struct SomeView_Previews: PreviewProvider {
static var previews: some View {
SomeView()
}
}

Answer 1

Yes, it looks like a bug to me.
A possible workaround is to put every view in a separate NavigationView:
struct ContentView: View {
#ObservedObject var viewModel = ViewModel()
var body: some View {
content
}
#ViewBuilder
var content: some View {
switch viewModel.viewState {
case .home: NavigationView { homeView() }
case .add: NavigationView { addView() }
case .profile: NavigationView { profileView() }
}
}
...
}
Alternatively, you can add the bottomBar to the addView:
func addView() -> some View {
Text("Add View")
.toolbar {
ToolbarItem(placement: .cancellationAction) {
Button("Cancel", action: { viewModel.setViewState(state: .profile) })
}
ToolbarItem(placement: .bottomBar) {
Text("")
}
}
}
or just display the addView as a sheet.