How can I hide title bar in SwiftUI? (for MacOS app)

Question

I know how to hide the title bar with Storyboard.

But I can't do this in SwiftUI.

I want to hide the title bar and the control buttons and make a floating image view.

May be it helps: https://www.reddit.com/r/SwiftUI/comments/k0yyy0/how_to_remove_the_maximize_button_on_macos/ — Kishan Bhatiya, Dec 28 '21 at 05:42
@KishanBhatiya Thank you so much. I got the result. you are my life saver — Retriever, Dec 28 '21 at 07:16

score 11 · Answer 1 · answered Dec 28 '21 at 04:41

11

import SwiftUI
@main
struct TestApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }.windowStyle(HiddenTitleBarWindowStyle())
    }
}

try HiddenTitleBarWindowStyle()

answered Dec 28 '21 at 04:41

bdeviOS

449
1
6

I aleady tried this. It just make hidden title. I want to hide control buttons too(like I attached gif image) – Retriever Dec 28 '21 at 05:10
navigationItem.backBarButtonItem = UIBarButtonItem(title: "", style: .plain, target: nil, action: nil) plz try this – bdeviOS Dec 28 '21 at 05:25
Could you tell me where I insert your code I'm a noob in SwiftUI. I don't know where can I get 'navigationItem'. – Retriever Dec 28 '21 at 07:07
The code should be inserted at the App level not the View level. You will most likely find this in the [your app name]App file in your file structure. – Jokz Dec 30 '21 at 17:24
2

@Jokz Sorry, My question was not enough. I wanna know MacOS app case. – Retriever Dec 31 '21 at 11:25

score 3 · Answer 2 · answered Aug 04 '22 at 18:37

I could not find a way to hide the toolbar entirely in SwiftUI. But this is a possible workaround. You can put this code in your AppDelegate file.

func applicationDidFinishLaunching(_ aNotification: Notification) {
    let window = NSApplication.shared.windows.first!
    window.titlebarAppearsTransparent = true
    window.backgroundColor = .white
    window.standardWindowButton(.closeButton)!.isHidden = true
    window.standardWindowButton(.miniaturizeButton)!.isHidden = true
    window.standardWindowButton(.zoomButton)!.isHidden = true
}

Using this code will make it appear that the toolbar is hidden when in reality, it is still there. But the buttons are hidden, and the background is transparent.

score 1 · Answer 3 · answered Dec 28 '21 at 15:27

Removing the Title Bar in Your Mac App Built with Mac Catalyst

Display content that fills the entire height of a window by removing the title bar.

By default, Mac apps built with Mac Catalyst display a title bar across the top of their windows. A horizontal line separates the title bar from the content of the window. Some Mac apps such as Messages and Contacts have no title bar in their main window. Instead, the top of the window shows only the Close, Minimize, and Zoom buttons with no separator between them and the window's content. In this UI design, the content area fills the entire height of the window. The following image illustrates these styles in two windows. The first window displays a title bar, while the second has none. Screenshot of two windows, one stacked above the other, with a dark background in the content area of each window.

Remove the Title Bar If you choose to design your window without a title bar, you must remove it from the window. To remove the title bar, set the title bar’s titleVisibility property to UITitlebarTitleVisibility.hidden and the toolbar property to nil. The following code shows how to remove the title bar and its separator from the window during the setup of a new scene.

func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
    
    guard let windowScene = (scene as? UIWindowScene) else { return }
    
    #if targetEnvironment(macCatalyst)
    if let titlebar = windowScene.titlebar {
        titlebar.titleVisibility = .hidden
        titlebar.toolbar = nil
    }
    #endif

}

Click here for more information

Thank you for your comment. But I need AppKit or SwiftUI solution. — Retriever, Dec 30 '21 at 04:55

score 1 · Answer 4 · answered Mar 21 '23 at 12:01

Also, if you have SwiftUI based App @main you can use use the .windowStyle() modifier to hide the title bar and AppDelegate to hide the buttons, like so:

import SwiftUI

@main
struct MyApp: App {
    @NSApplicationDelegateAdaptor(AppDelegate.self) var appDelegate

    var body: some Scene {
        WindowGroup {
            ContentView()
        }
        .windowStyle(HiddenTitleBarWindowStyle())
    }
}

class AppDelegate: NSObject, NSApplicationDelegate {
    func applicationDidFinishLaunching(_ notification: Notification) {
        hideTitleBar()
    }

    func hideTitleBar() {
        guard let window = NSApplication.shared.windows.first else { assertionFailure(); return }
        window.standardWindowButton(.closeButton)?.isHidden = true
        window.standardWindowButton(.miniaturizeButton)?.isHidden = true
        window.standardWindowButton(.zoomButton)?.isHidden = true
    }
}

And for Catalyst, the title bar could be hidden using .onAppear { } modifier and UITitleBar api:

import SwiftUI

@main
struct MyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
                .onAppear { hideTitleBarOnCatalyst() }
        }
    }

    func hideTitleBarOnCatalyst() {
#if targetEnvironment(macCatalyst)
        (UIApplication.shared.connectedScenes.first as? UIWindowScene)?.titlebar?.titleVisibility = .hidden
#endif
    }
}

How can I hide title bar in SwiftUI? (for MacOS app)

4 Answers4