How to toggle visibility of NSSplitView subView + hide Pane Splitter divider?

Question

We have a parent Split view (NSSplitView), and two subviews, Content and SideBar (the sidebar is on the right).

What would be the optimal Cocoa-friendly way to toggle the SideBar view?

I would really love it, if the suggested solution includes animation
I really don't need any suggestions related to external plugins, etc (e.g. BWToolkit)

HINT : I've been trying to do that, but still I had issues hiding the divider of the NSSplitView as well. How could I do it, while hiding it at the same time?

score 8 · Accepted Answer · answered Mar 23 '12 at 18:22

8

Here's a pretty decent tutorial that shows how to do this: Unraveling the Mysteries of NSSplitView.

Hiding the divider is done in NSSplitView's delegate method splitView:shouldHideDividerAtIndex:.

You will have to animate the frame size change yourself if you don't like the way NSSplitView does it.

answered Mar 23 '12 at 18:22

Nathan Kinsinger

23,641
2
30
19

1

`shouldHideDividerAt` only works if the divider is at the edge of the split view, not if it is between 2 panes. – Feb 11 '20 at 08:59

score 6 · Answer 2 · edited May 19 '23 at 19:31

6

Easiest way to do it is as follows - and it's animated: [SWIFT 5]

    splitViewItems[1].animator().isCollapsed = false // Show side pane
    splitViewItems[1].animator().isCollapsed = true // hide side pane

edited May 19 '23 at 19:31

Soid

2,585
1
30
42

answered Jul 19 '19 at 05:52

rs7

1,618
1
8
16

This answer uses `NSSplitViewController`. – Willeke Dec 23 '22 at 01:31

score 4 · Answer 3 · answered Jan 21 '15 at 20:53

I wrote a Swift version of the content in the link from @Nathan's answer that works for me. In the context of my example splitView is set elsewhere, probably as an instance property on an encompassing class:

func toggleSidebar () {
    if splitView.isSubviewCollapsed(splitView.subviews[1] as NSView) {
        openSidebar()
    } else {
        closeSidebar()
    }
}

func closeSidebar () {
    let mainView = splitView.subviews[0] as NSView
    let sidepanel = splitView.subviews[1] as NSView
    sidepanel.hidden = true
    let viewFrame = splitView.frame
    mainView.frame.size = NSMakeSize(viewFrame.size.width, viewFrame.size.height)
    splitView.display()
}

func openSidebar () {
    let sidepanel = splitView.subviews[1] as NSView
    sidepanel.hidden = false
    let viewFrame = splitView.frame
    sidepanel.frame.size = NSMakeSize(viewFrame.size.width, 200)
    splitView.display()
}

These functions will probably methods in a class, they are for me. If your splitView can be nil you obviously have to check for that. This also assumes you have two subviews and the one at index 1, here as sidePanel is the one you want to collapse.

Peter Ahlberg · Answer 4 · 2017-10-10T11:32:17.637

4

In Xcode 9.0 with Storyboards open Application Scene select View->Menu->Show sidebar. CTRL-click Show Sidebar, in sent actions delete the provided one, click on x. From the circle CTRL drag to First Responder in application scene and select toggleSideBar to connect to. Open storyboard and select the first split view item and in attributes inspector change behaviour from default to sidebar. Run and try with view menu item show/hide. All done in interface builder no code. toggleSideBar handles the first split view item. https://github.com/Dis3buted/SplitViewController

edited Oct 10 '17 at 11:32

answered Sep 29 '17 at 14:41

Peter Ahlberg

1,359
2
24
26

1

Thanks! Do you know if this can be extended to work with two different sidebars? – Josh May 07 '18 at 06:04

score 3 · Answer 5 · answered May 06 '16 at 03:57

I got some artifacts with the code above, likely because it was out of context. I am sure it works where it was meant to. Anyway, here is a very streamlined implementation:

// this is the declaration of a left vertical subview of
// 'splitViewController', which is the name of the split view's outlet

var leftView: NSView {
    return self.splitViewController.subviews[0] as NSView
    }

// here is the action of a button that toggles the left vertical subview
// the left subview is always restored to 100 pixels here

@IBAction func someButton(sender: AnyObject) {

    if splitViewController.isSubviewCollapsed(leftView) {
        splitViewController.setPosition(100, ofDividerAtIndex: 0)
        leftView.hidden = false
    } else {
        splitViewController.setPosition(0, ofDividerAtIndex: 0)
        leftView.hidden = true
    }
}

To see a good example using animations, control-click to download this file.

score 1 · Answer 6 · answered Jan 15 '21 at 14:33

1

If your NSSplitView control is part of a NSSplitViewController object, then you can simply use this:

splitViewController.toggleSidebar(nil)

answered Jan 15 '21 at 14:33

Ely

8,259
1
54
67

How to toggle visibility of NSSplitView subView + hide Pane Splitter divider?

6 Answers6

Linked