macOS: NSToolbar with translucency effect in Big Sur

1.2k views Asked by At

I am working with a new Xcode project for Big Sur, with a "Split View with Sidebar" scene in the main storyboard. I want to make the window title and toolbar have the translucency effect that you see in the toolbars in Safari or Finder. In my storyboard, I specify "Full Size Content View" and "Hide Title Text", and in the storyboard it looks like what I want:

enter image description here

But when I build and run it, the window's toolbar is plain white:

enter image description here

Now if I disable the "Hide Title Bar" checkbox, it looks fine in the storyboard with the title and the toolbar items on the same line:

enter image description here

Now when I build and run it, the toolbar has the translucency effect I want, but the title is on a 2nd level above the toolbar items:

enter image description here

I'm not sure what else I can do to control this. Ideally, I would hide the title bar and keep the translucency, but it doesn't seem to be working. Is there anything else I can try to control this?

If not, I would prefer the title to be on the same level as the toolbar items, like it does in the storyboard. But even that isn't working as desired.

Any ideas on what I can try? I've tried changing the toolbar styles, but they all have similar results.

EDIT: I've tried using Apple's own code for "Navigating Hierarchical Data Using Outline and Split Views" and after tweaking the storyboard with enabling both "Full Size Content View" and "Hide Title Bar" checkboxes, I'm seeing the same issue: i.e. the toolbar turns white. So it's likely an Apple framework bug? I'm not sure, so I have filed a bug to find out.

1

There are 1 answers

0
Yuma Technical Inc. On

I created an app that build fine on High Sierra and Catalina, it may build on OX11. It removes the titlebar, but I don't use a toolbar. Try this, it may do similar to what you want - you may have to comment-out some settings, etc.

Create a file "MainWindow" that is a subclass of NSWindowController. Fill the file with:

class MainWindow: NSWindowController {

    var controller: ViewController?


    override func windowDidLoad() {
        super.windowDidLoad()

        controller = self.contentViewController as? ViewController
        self.smartWindow()
        self.activateWindowDrag()
    }

}


// you may prefer the below as a separate file
extension NSWindowController {

    func smartWindow() {
        self.window?.styleMask.insert(NSWindow.StyleMask.unifiedTitleAndToolbar)
        self.window?.styleMask.insert(NSWindow.StyleMask.fullSizeContentView)
        self.window?.styleMask.insert(NSWindow.StyleMask.titled)
    
        self.window?.toolbar?.isVisible         = false
        self.window?.titleVisibility            = .hidden
        self.window?.titlebarAppearsTransparent = true
    }

    func activateWindowDrag() {
        self.window?.isMovableByWindowBackground = true
    }

}