SwiftUI：如何通过按钮点击关闭非模态子视图？

嗨，我来帮你搞定这个问题～

其实这个场景的核心逻辑很简单——给子视图加个「开关」，通过状态变量的绑定来控制它的显示和隐藏，具体实现步骤如下：

1. 在主视图中定义控制状态 #

首先在你的主视图里声明一个@State变量，用来作为messageView的显示开关：

struct MainView: View {
    // 控制messageView的显示状态，默认设为true表示初始时显示
    @State private var isMessageViewVisible = true
    
    var body: some View {
        VStack {
            // 主视图原有内容
            Text("这是主视图的内容")
                .font(.title)
                .padding()
            
            // 根据状态变量决定是否渲染messageView
            if isMessageViewVisible {
                MessageView(isVisible: $isMessageViewVisible)
            }
        }
    }
}

2. 在MessageView中接收绑定并实现关闭逻辑 #

让MessageView接收这个状态的绑定值，在按钮点击时修改绑定变量，就能让主视图自动移除当前子视图：

struct MessageView: View {
    // 接收来自主视图的绑定，用来控制自身的显示/隐藏
    @Binding var isVisible: Bool
    
    var body: some View {
        VStack(spacing: 20) {
            Text("这是非模态的MessageView")
                .font(.headline)
            
            Button("关闭视图") {
                // 修改绑定变量，主视图会自动更新并移除当前视图
                isVisible = false
            }
            .buttonStyle(.borderedProminent)
        }
        .padding()
        .background(Color.white)
        .cornerRadius(12)
        .shadow(radius: 6)
    }
}

可选：添加过渡动画（提升体验） #

如果想要更流畅的关闭效果，可以给MessageView加上过渡动画，只需要在主视图的条件渲染处添加修饰符：

if isMessageViewVisible {
    MessageView(isVisible: $isMessageViewVisible)
        .transition(.move(edge: .bottom)) // 添加入场/退场动画
}

同时在主视图的VStack上加上动画触发：

VStack {
    // ...主视图内容
}
.animation(.easeInOut(duration: 0.3), value: isMessageViewVisible)

这种方式本质是利用SwiftUI的条件渲染特性，当状态变量变化时，视图层级会自动更新，从而实现非模态子视图的关闭～

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