SwiftUI：返回时如何平滑过渡 bottomBar 工具栏？

Question

我想在我的其中一个视图中放置一个工具栏 .bottomBar。然而，当导航离开和返回时，工具栏不会与视图的其余部分平滑过渡 - 它突然出现，将视图的全部内容向上移动，如下所示。

这似乎只影响屏幕底部的工具栏 - 如您所见，放置在屏幕顶部的工具栏似乎工作正常。

如何让底部工具栏在导航回第一屏时平滑过渡？

struct ContentView: View {
  var body: some View {
    NavigationView {
      NavigationLink(
        destination: Text("Destination"),
        label: {
          Text("Navigate")
        })
      .toolbar {
        ToolbarItem(placement: .bottomBar) {
          Text("Bottom")
        }
        ToolbarItem(placement: .principal) {
          Text("Top")
        }
      }
    }
  }
}

Answer 1

我一直遇到和你一样的问题，顶部工具栏没问题，但底部工具栏闪烁。

我目前使用的解决方法是手动创建底部工具栏，例如：

struct ContentView: View {
    var body: some View {
        NavigationView {
            VStack {
                Spacer()
                NavigationLink(
                    destination: Text("Destination"),
                    label: {
                        Text("Navigate")
                    })
                Spacer()
                NavigationLink(
                    destination: Text("Destination"),
                    label: {
                        ZStack {
                            Rectangle()
                                .frame(height: 90.0)
                                .foregroundColor(.gray).opacity(0.08)
                                .border(Color.gray, width: 0.2)
                            
                            Text("Bottom")
                                .foregroundColor(.black)
                        }
                    })
            }
            .edgesIgnoringSafeArea(.all)

            .toolbar {
                ToolbarItem(placement: .principal) {
                    Text("Top")
                }
            }
        }
    }
}

Demo link (not allowed to post images yet)

这并不理想 - 我更喜欢使用工具栏 API，但这种方式确实会阻止内容向上移动。

SwiftUI：返回时如何平滑过渡 bottomBar 工具栏？

SwiftUI: How to smoothly transition bottomBar toolbar when navigating back?

ios

swiftui

swiftui-navigationview