Search code examples
swiftmacosappkitmacos-big-sur

How to avoid NSTrackingSeparatorToolbarItem from overflowing when resizing a SplitView?

I am working on a macOS app and I programmatically adding NSToolbarItems following Apple's documentation and I am adding the new NSTrackingSeparatorToolbarItem to support the new macOS 11 toolbar look and feel.

The tracking separator seems to work fine as long as I don't resize the split view below a certain width, then the separator breaks out and just looks out of place.

The tracking separator working as expected enter image description here

And the separator breaking out when the split view size is below a certain width. enter image description here

Is there a way to avoid this?? I know that I can set a minimum size for the split view, but is there a way to keep them synchronized (I don't want to hard code a minimum width)?? Especially if the user adds toolbar items dynamically.

Thanks in advance.

Solution

  • Ok I think I figured it out...

    I noticed a interesting behavior when playing around with the Mail app, which when the preview pane is showing the NSTrackingSeparatorToolbarItem follow the resizing of the split views but the moment the preview is collapsed the toolbar changes appearance and becomes like a static toolbar. Furthermore the NSTrackingSeparatorToolbarItem stays in place and looks just like a normal toolbar separator (like you might find on other OS's).

    So I played around in IB with my toolbar and discovered my error, my NSWindow had the titlebar set to transparent!!

    I unchecked the option and voila I could replicate the look and feel of the Mail app, all automatically.

    this property has to be set to false in NSWindow

    @available(macOS 10.10, *)
open var titlebarAppearsTransparent: Bool

    And of course the toolbar style should be set to unified

    @available(macOS 11.0, *)
    public enum ToolbarStyle : Int {
    // The default value. The style will be determined by the window's given configuration
    case automatic = 0
    // The toolbar will appear below the window title
    case expanded = 1
    // The toolbar will appear below the window title and the items in the toolbar will attempt to have equal widths when possible
    case preference = 2
    // The window title will appear inline with the toolbar when visible
    case unified = 3
    // Same as NSWindowToolbarStyleUnified, but with reduced margins in the toolbar allowing more focus to be on the contents of the window
    case unifiedCompact = 4
}

    Please note that the break out behavior still occurs but when this happens the toolbar changes look and feel and you don't see any ugly split view divider line like I had experienced. Hope this helps anyone else who might run into this issue.