SwiftUI中NavigationView场景下self.presentation.wrappedValue.dismiss()无法关闭视图，需自定义不占满顶部栏且不与背景融合的返回按钮

嘿，我完全理解你想要的效果——一个能和背景清晰区分开、又不会占满整个顶部栏的自定义返回按钮，你提到的.toolbar确实是实现这个需求的绝佳方案！咱们直接来修改你的detailedView代码，一步步达到你想要的效果：

核心修改思路 #

1. 用.toolbar替代手动添加的Dismiss Me!按钮，把自定义按钮放在导航栏的默认返回位置
2. 给按钮添加独立样式（背景、圆角），避免和背景图片融合
3. 设置导航栏背景透明，让它不会突兀占据整个顶部空间

修改后的detailedView代码 #

import SwiftUI
struct detailedView: View {
    var info : Hour
    // iOS 15+ 推荐使用更简洁的@Environment(\.dismiss)
    @Environment(\.dismiss) private var dismiss
    // 如果需要兼容iOS 14及以下，保留这段代码替代上面的dismiss：
    // @Environment(\.presentationMode) var presentationMode

    public var body: some View {
        let rawTime = info.time
        let displayTemp_F = Int(Double.rounded(info.temp_f)())
        let displayFeelslike_f = Int(Double.rounded(info.feelslike_f)())
        let displayWind_mph = Int(Double.rounded(info.wind_mph)())
        
        GeometryReader{geo in
            VStack{
                Spacer()
                Group{
                    Text(info.condition?.text ?? "API error")
                    Text("Time: \(String(rawTime[rawTime.lastIndex(of: " ")!...]))")
                    Text("Temperature: \(displayTemp_F) degrees fahrenheit")
                    Text("Feels like: \(displayFeelslike_f) degrees fahrenheit")
                    Text("Wind MPH: \(displayWind_mph)")
                }
                .frame(width: UIScreen.main.bounds.width - 30, height: 50, alignment: .center)
                .background(Color.white.opacity(0.5))
                .cornerRadius(20)
                .foregroundColor(.black)
                .font(.system(size: 18).bold())
                Spacer()
                Spacer()
                Spacer()
            }
            .frame(width: geo.size.width, height: geo.size.height, alignment: .top)
            .background(
                Group{
                    if (timeToInt(info.time) < 19 && timeToInt(info.time) > 5){
                        Image("\(info.condition?.code ?? 1000)")
                            .resizable()
                            .scaledToFill()
                            .frame(width: geo.size.width, height: geo.size.height, alignment: .top)
                    }else{
                        Image("night")
                            .resizable()
                            .scaledToFill()
                            .frame(width: geo.size.width, height: geo.size.height, alignment: .top)
                    }
                }
            )
            // 添加自定义工具栏按钮
            .toolbar {
                ToolbarItem(placement: .navigationBarLeading) {
                    Button(action: {
                        // iOS15+ 用法
                        dismiss()
                        // iOS14兼容用法：
                        // presentationMode.wrappedValue.dismiss()
                    }) {
                        // 自定义按钮样式，确保和背景区分
                        HStack(spacing: 4) {
                            Image(systemName: "chevron.left")
                            Text("Back")
                        }
                        .padding(.horizontal, 12)
                        .padding(.vertical, 6)
                        .background(Color.white.opacity(0.8))
                        .cornerRadius(12)
                        .foregroundColor(.black)
                        .font(.system(size: 16).bold())
                    }
                }
            }
            // 设置导航栏背景透明，避免占据顶部空间
            .toolbarBackground(.transparent, for: .navigationBar)
            // 隐藏系统默认返回按钮
            .navigationBarBackButtonHidden(true)
        }
        .frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height, alignment: .top)
    }
}

关键细节说明 #

• 按钮位置：ToolbarItem(placement: .navigationBarLeading)确保按钮放在用户习惯的返回按钮位置，符合iOS交互逻辑
• 独立样式：通过padding、半透明白色背景和圆角，让按钮和你的背景图片彻底区分开，不会出现融合问题
• 导航栏优化：.toolbarBackground(.transparent)让导航栏只显示我们的自定义按钮，不会占据整个顶部栏空间
• 兼容性：提供了iOS15+和iOS14两种 Dismiss 写法，你可以根据项目需求选择

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