Spacer() doesn't work properly in .toolbar

Viewed 29

I've encountered the following issue with a .toolbar in NavigationView. It seems Spacer() doesn't work properly there. Here's a screenshot Issue

And here's the code

NavigationView {
        ...
        .toolbar {
            // bottom
            ToolbarItemGroup(placement: .bottomBar) {
                HStack {
                    NavigationLink {
                        ...SomeView...
                    } label: {
                        VStack {
                            Image(systemName: "person.circle.fill")
                            Text("Contacts")
                        }
                    }.padding()
                    Spacer()
                    NavigationLink {
                        ...SomeView...
                    } label: {
                        VStack {
                            Image(systemName: "message.fill")
                            Text("Chats")
                        }
                    }.padding()
                    Spacer()
                    NavigationLink {
                        ...SomeView...
                    } label: {
                        VStack {
                            Image(systemName: "pencil.circle")
                            Text("Settings")
                        }
                    }.padding()
                }
                .font(.caption)
                .foregroundColor(.gray)
            }
        }

Interestingly enough, it start working when I'm switching to another view (using NavigationLink), and then go back.

Another note that it shown correctly in preview in xcode, but behave differently on the phone (iPhone 12, iOS 15.4)

0 Answers
Related