Hide NSToolbar in fullscreen
Asked Answered
G

2

8

I'm making a Cocoa app, with a hidden unified NSToolbar and Titlebar. I've done so by adding a toolbar in the Window Controller and setting all the options to make this invisible and keep the 3 colored buttons. It works great in a normal window, but if I put this window in fullscreen, it shows an empty Toolbar at the top.

How to make this toolbar also transparent in fullscreen?

It can be possible as it is how it works in the new Mac AppStore in macOS Mojave (there is a hidden toolbar which is still hidden in fullscreen and only appear when the mouse is put at the top of the screen).

Bonus: I have enabled isMovableByWindowBackgroundable but is there an option to toggle the "maximize" action while double clicking on the window background like it normally works for titlebar?

Here's pictures:

How it looks with a transparent toolbar

How it looks in fullscreen, the toolbar is opaque

Gemology answered 6/11, 2018 at 14:29 Comment(0)
E
15

You can achieve the same effect as the Mac App Store by setting the NSWindow's delegate and implementing:

func window(_ window: NSWindow, willUseFullScreenPresentationOptions proposedOptions: NSApplication.PresentationOptions = []) -> NSApplication.PresentationOptions {
    return [.autoHideToolbar, .autoHideMenuBar, .fullScreen]
}

This will hide the toolbar and the menubar while in fullscreen appearing only when the mouse is at the top of the screen. Updates to the view may need to be implemented to update content but that is optional.

Ebon answered 16/6, 2019 at 16:59 Comment(2)
Works great. Here the same in ObjC: - (NSApplicationPresentationOptions)window:(NSWindow *)window willUseFullScreenPresentationOptions:(NSApplicationPresentationOptions)proposedOptions { return NSApplicationPresentationAutoHideToolbar | NSApplicationPresentationAutoHideMenuBar | NSApplicationPresentationFullScreen; }Phelan
Cheers mate! Made my week!Dimarco
A
1

I assume what you are looking for is a window condiguration like this.

window!.titleVisibility = .hidden
window!.titlebarAppearsTransparent = true
window!.styleMask = [window!.styleMask,  NSWindow.StyleMask.fullSizeContentView]

You would add this code in your NSWindowControllers windodDidLoad()

In the Mac App Store App I don’t see any toolbar. If you don’t want to display a toolbar you don’t need to add a NSToolbar to the window.

EDIT:

To get the view and change the color you can use the code below in windowDidLoad. Of course there is some more fine-tuning required to get it 100% like the Mac App Store window and its not a good idea to use a fixed color.

let button = window?.standardWindowButton(NSWindow.ButtonType.closeButton)
let containerView = button?.superview?.superview // NSTitlebarContainerView
containerView?.layer?.backgroundColor = CGColor.init(gray: 0.9, alpha: 1.0)

Hope this helps.

Autoxidation answered 6/11, 2018 at 17:57 Comment(6)
Your code can indeed hide the title bar, but the Close/minimize/maximize buttons are in the upper left corner. I want them to be just like they are when there is a unified toolbar. I can achieve this by adding an empty toolbar, and with the same code you provided, it is invisible like I want, but if I go fullscreen, the toolbar reappear, whereas without toolbar, the titlebar disappears but the 3 buttons are not where I want them to be.Gemology
For the Mac App Store, the fact that the buttons are where there are suppose to be if there were a toolbar, and if you go fullscreen and you put your mouse at the the top, the panel that's slides down showing the Close/minimize/maximize buttons is the size of a unified toolbar (which is translucent). That makes me think that they are using a transparent toolbar.Gemology
You are right, it looks some different. I extended my answer to show a way how you can access and modify the colour of the view. I found a way get the right view.Autoxidation
With this I can change the color of the bar but it has no effect in fullscreen. I want is to make the toolbar disappear in fullscreen. I'm not sure that it can be achieve by changing the color :/Gemology
What about your initial question -> How to make this toolbar also transparent (invisible) in fullscreen? You will get exactly this and the look and feel like the App Store App if you follow what I proposed to you. But if you are looking to make a window with a toolbar without having a toolbar I can only wish you good luck.Autoxidation
The toolbar is transparent in a normal window but it becomes opaque in fullscreen. Your code can change the background color, but if I put alpha to 0 then it still opaque in fullscreen. I've updated my post with pictures.Gemology

© 2022 - 2024 — McMap. All rights reserved.