如何在SwiftUI中设置视图实现Always on top始终置顶效果

你当前编写的是macOS平台的SwiftUI代码，视图本身没有直接的「始终置顶」修饰符，这个效果是窗口级属性，需要通过修改底层NSWindow的层级实现，你现有ContentView内部的按钮布局代码不需要改动。

方法1：快速配置（适合单窗口入门项目） #

如果是Xcode默认创建的SwiftUI生命周期项目（入口带@main标记的App结构体），直接在根视图加载时获取当前窗口修改层级即可：

import SwiftUI

@main
struct YourTestApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
                .onAppear {
                    // 拿到当前应用的窗口，设置为悬浮置顶层级
                    guard let currentWindow = NSApplication.shared.windows.first else { return }
                    // 悬浮层级会固定显示在所有普通应用窗口上方
                    currentWindow.level = .floating
                    
                    // 可选配置：如果需要窗口在全屏应用/其他空间上方也保持显示，打开下面这行
                    // currentWindow.collectionBehavior = [.canJoinAllSpaces, .fullScreenAuxiliary]
                }
        }
    }
}

方法2：精准绑定窗口（推荐，避免多窗口场景出错） #

如果项目后续会开多个窗口，可以通过NSViewRepresentable桥接的方式精准拿到当前视图所属的窗口，不会误改其他窗口属性：

1. 先写一个轻量的窗口获取辅助组件

struct WindowBinder: NSViewRepresentable {
    var onWindowAppear: (NSWindow) -> Void
    
    func makeNSView(context: Context) -> NSView {
        let emptyView = NSView()
        DispatchQueue.main.async {
            guard let targetWindow = emptyView.window else { return }
            onWindowAppear(targetWindow)
        }
        return emptyView
    }
    
    func updateNSView(_ nsView: NSView, context: Context) {}
}

2. 在你的ContentView中挂载这个组件，配置置顶属性

struct ContentView: View {
    var body: some View {
        HStack{
            Button("Button1") {}
            .padding(20)
            .frame(width: 150, height: 40)
            
            Button("x") {
                NSApplication.shared.terminate(nil)
            }
            .padding(10)
            .frame(width: 70, height: 40)
        }
        .background(WindowBinder { window in
            window.level = .floating
            // 同方法1，需要跨空间显示就打开下面配置
            // window.collectionBehavior = [.canJoinAllSpaces, .fullScreenAuxiliary]
        })
    }
}

注意事项 #

• 普通置顶需求用.floating层级即可，不要随意使用.statusBar、.screenSaver等更高的系统保留层级，会和系统UI产生冲突
• 如果后续需要取消置顶效果，只需要把对应窗口的level改回.normal就能恢复普通窗口状态
• 这个配置只作用于当前窗口，不会影响你内部视图的布局、交互逻辑

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