SwiftUI中导航至新视图后如何隐藏Overlay内的SF符号

你的问题出在overlay是直接附加在NavigationView外部，而NavigationView作为导航容器，在跳转至新视图后依然存在，所以对应的overlay按钮不会自动消失。以下两种方法可以解决这个问题：

方法一：将Overlay移至NavigationView内部的根视图上 #

把overlay添加到NavigationView里的根内容视图上，这样当导航到新视图时，根视图会被目标视图替换，overlay也会随之消失：

var body: some View{
  NavigationView{
    // 这里是你的根视图内容，比如用VStack包裹所有元素
    VStack {
      // 其他根视图组件
      NavigationLink("前往欢迎页", destination: WelcomeScreenView())
    }
    .overlay(
      Button(action: {}, label: {
        Image(systemName: "chevron.left")
          .gesture(
            DragGesture() 
            // 你的滑动动画代码
          )
      })
    )
  }
}

方法二：通过导航状态控制Overlay的显示隐藏 #

使用NavigationLink的isActive绑定变量，跟踪导航状态，动态控制overlay是否显示：

struct YourView: View {
  // 跟踪导航激活状态
  @State private var isNavigatingToWelcome = false
  
  var body: some View{
    NavigationView{
      NavigationLink(
        "", 
        destination: WelcomeScreenView(), 
        isActive: $isNavigatingToWelcome
      )
      .hidden() // 隐藏默认的NavigationLink按钮样式（如果不需要显示文本）
      
      // 根视图其他内容
      Text("主页内容")
    }
    .overlay(
      // 仅当未导航时显示overlay按钮
      if !isNavigatingToWelcome {
        Button(action: {}, label: {
          Image(systemName: "chevron.left")
            .gesture(
              DragGesture() 
              // 你的滑动动画代码
            )
        })
      }
    )
    .onChange(of: isNavigatingToWelcome) { newValue in
      if newValue {
        // 在这里添加跳转前的视图重置逻辑
      }
    }
  }
}

补充说明 #

第一种方法更简洁，适合大多数场景；第二种方法适合需要在导航前后做额外逻辑处理的情况，比如在跳转前重置视图状态（可以通过.onChange监听导航状态变化来执行操作）。

内容的提问来源于stack exchange，提问作者Shawn