In part 1 of the series, we covered the very basics of NSSplitView. We ended with a NSSplitView with two subviews. We were able to constrain the minimum size of each.

In this part of the series, we are going to add collapsible subviews.

Collapsible subviews

There are several ways to support collapsible subviews. The first is supported directly by NSSplitView. As the user drags a divider to its minimum position, if subviews are collapsible, additional movement will result in the subview snapping shut.

We can support this behavior by adding the canCollapseSubview method.

1
2
3
4
5
6

- (BOOL)splitView:(NSSplitView *)splitView canCollapseSubview:(NSView *)subview;
{
    NSView* rightView = [[splitView subviews] objectAtIndex:1];
    NSLog(@"%@:%s returning %@",[self class], _cmd, ([subview isEqual:rightView])?@"YES":@"NO");
    return ([subview isEqual:rightView]);
}

Dragging the divider to the right most edge of the window will result in the right subview snapping shut. The divider will still be show on the rightmost margin of the view. This collapsing behavior is our first bit of good news. When we collapse and uncollapse our right subviews, the layout is not munged as it was in part one when we effectively reduced the right subview width to zero. We’ll use the observation later when we add programmatic collapsing.

We can hide the divider when the right subview is collapsed.

1
2
3
4
5

- (BOOL)splitView:(NSSplitView *)splitView shouldHideDividerAtIndex:(NSInteger)dividerIndex;
{
    NSLog(@"%@:%s returning YES",[self class], _cmd);
    return YES;
}

If you keep you’re finger on the mouse while moving the divider, you can observe it collapse the right subview and then moving the divider back to the left – uncollapse it.

If you didn’t keep your finger on the mouse, the right view collapsed and there is no way now to get the view back. Hovering over the right edge of the window won’t do it. There aren’t any buttons to press, nothing to double click.

Before we fix this issue, change shouldHideDividerAtIndex back to returning NO.

We’ll add one more bit of goodness before we tackle programming collapsing.

Double Click to collapse

NSSplitViewDelegate includes an optional method shouldCollapseSubview:forDoubleClickOnDividerAtIndex: – it does its name suggests. If we answer YES, double-clicking on the divider will collapse the right subview. Double-clicking on the divider while the right subview is collapsed will uncollapse the right subview.

Here’s the implementation:

1
2
3
4
5
6

- (BOOL)splitView:(NSSplitView *)splitView shouldCollapseSubview:(NSView *)subview forDoubleClickOnDividerAtIndex:(NSInteger)dividerIndex;
{
    NSView* rightView = [[splitView subviews] objectAtIndex:1];
    NSLog(@"%@:%s returning %@",[self class], _cmd, ([subview isEqual:rightView])?@"YES":@"NO");
    return ([subview isEqual:rightView]);
}

Sweet!

Programmatic Double Click

Programmatic double-click will allow us to hook the action selector of a menu item, a toolbar button or other UI control to a method that will toggle the collapsed state of the collapsible subview.

First we’ll add a toolbar to our window to have a convenient place to put the toggle button.

In MySplitViewController, we’ll add the logic to toggle right subview.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

-(IBAction)toggleRightView:(id)sender;
{
	BOOL rightViewCollapsed = [[self mySplitView] isSubviewCollapsed:[[[self mySplitView] subviews] objectAtIndex: 1]];
    NSLog(@"%@:%s toggleInspector isCollapsed: %@",[self class], _cmd, rightViewCollapsed?@"YES":@"NO");
	if (rightViewCollapsed) {
		[self uncollapseRightView];
	} else {
		[self collapseRightView];
	}
}
 
-(void)collapseRightView
{
 
	NSView *right = [[[self mySplitView] subviews] objectAtIndex:1];
	NSView *left  = [[[self mySplitView] subviews] objectAtIndex:0];
    NSRect leftFrame = [left frame];
    NSRect overallFrame = [[self mySplitView] frame]; //???
    [right setHidden:YES];
    [left setFrameSize:NSMakeSize(overallFrame.size.width,leftFrame.size.height)];
	[[self mySplitView] display];
}

toggleRightView: is the public method that we’ll connect UI elements to. It queries the NSSplitView to see if the right subview is collapsed. If not, it calls collapseRightView otherwise, we’ll uncollapseRightView:. The key element here is to ensure that the ‘collapsed’ status of the right view is set correctly. My first several attempts to make this work involved setting the frame width of the right view to 0. NSSplitView did not answer YES to isSubviewCollapsed: under those circumstances. Remember the observation earlier that when we snapped the right view closed and reopened it the view had not been mangled by autoresize logic? That suggests that the view was never shrunk to zero width, but rather hidden. I confirmed this with a F-Script session.

uncollapseRightView: is equally straight forward –

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

-(void)uncollapseRightView
{
	NSView *left  = [[[self mySplitView] subviews] objectAtIndex:0];
	NSView *right = [[[self mySplitView] subviews] objectAtIndex:1];
    [right setHidden:NO];
 
	CGFloat dividerThickness = [[self mySplitView] dividerThickness];
 
    // get the different frames
	NSRect leftFrame = [left frame];
	NSRect rightFrame = [right frame];
    // Adjust left frame size
	leftFrame.size.width = (leftFrame.size.width-rightFrame.size.width-dividerThickness);
	rightFrame.origin.x = leftFrame.size.width + dividerThickness;
	[left setFrameSize:leftFrame.size];
	[right setFrame:rightFrame];
	[[self mySplitView] display];
}

The cool thing about all of this is that we’re not saving frame rects or adding additional data structures to hold this state. I can assure you that my first several attempts to understand NSSplitView had loads of code to deal with view frames, collapse states, notifications to enable/disable view resizing etc. It is true, at least in this case, that if you’re fighting the frameworks, there may be a more enlightened path awaiting discovery.

We can now go back and hide the divider when the right subview is collapsed. The app should now look like this.

Conclusion and Next Steps

We’ve accomplished quite a bit. I know, it’s hard coded to collapse only the right subview and only handles a single split, but the concepts at work are illustrated plainly. The next few topics for future posts will include adding animated adjustments, controlling the effective drag area, customizing dividers and generalizing the solution.

The code for this segment can be downloaded here: Part-2

There are many examples of Mac applications that leverage split views to great effect. Apple uses split views in many applications that we use every day – Mail.app, Preview.app, Xcode.app etc. Many third parties use NSSplitView as well. Gauging from the number of posts on the net, there is also a lot of confusion about how to accomplish the basics (or the expected) using the default NSSplitView class provided in the SDK. This point is accentuated by the presence of several third party frameworks that provide these expected behaviors.

Pre-leopard behavior of NSSplitView gave rise to several of the third party frameworks. In 10.5 Apple cleaned up the implementation of NSSplitView and ostensibly provides everything one needs to use split views effectively.

My experiences (and occasional frustrations) with third party frameworks led me to dig in and try to understand what Apple offers, how it works and how (if) I could package that up in a reusable form for use in my own applications.

Requirements

Everyone has there own pet list of requirements for a usable split view solution, but my list includes the following:

• collapsible subviews – A common UI capability today is a button or key combination that hides a subview
• Intelligent subview resizing – There are a lot of documented issues with autoresizing Cocoa views – we need a splitview solution that doesn’t trash subviews when they are collapsed
• Ability to specify additional drag areas for splitters
• Ability to specify custom divider visuals
• Sexy animation when toggling the visibility of subviews

First, it’s worth looking at a few of the frameworks that are out there, what problems they solve and those that they don’t (from my perspective).

RBSplitView

The excellent RBSplitView emerged in 2004 in the pre-leopard days. In addition to providing the runtime framework, RBSplitView includes an Interface Builder palette that supports IB modification of most of the desired behaviors, including divider selection, collapsible views, and min and max settings for view sizes.

RBSplitView also includes support for animating view adjustments such as collapse/uncollapse.

There are a long list of applications that use RBSplitView .

RBSplitView is, from my experiments, very solid code. Capabilities such as toggling splits works, preserving subview layouts.

The primary issue with RBSplitView is that the animation used is pre Core Animation. Running on my 8 core mac pro, this is not an issue, but it gets a bit jumpy on my MacBook Pro. Further, by implementing the animations in the framework, RBSplitView limits ones ability to leverage a consistent CA based animation scheme throughout the application.

Bottom line – in a 10.6 world, is RBSplitView still the best solution?

BWSplitView

I have to say that I really want to like BWSplitView – Brandon Walkin’s framework that provides a modern NSSplitView based solution. On the surface, it meets all of the requirements outlined above. It is supported by a rich IB palette with a slew of conveniences. Brandon’s site includes some great screencasts illustrating the promise of BWSplitView.

That said, I struggled in real world usage of BWSplitView. Documented open issues around the splitter drag behavior created some showstopper issues for me.

In fact, it was my attempts to fix some of the BWSplitView issues that led me to explore how NSSplitView works.

Digging in

The canonical example of splitter view behavior is perhaps Mail.app. Two splitters, a vertical split for the Mailboxes and main view. The main view is horizontally split into the messages list and the message viewer.

To understand what NSSplitView offers out of the box, let’s build a sample app with a single splitter. If we can understand what is going on with a single split view, we can generalize that as we add additional split views.

In order to verify the subview resizing challenges, one of our subviews will have several standard cocoa controls with autoresizing turned on.

The app looks like this:

Dragging the divider all the way to the right and then back towards the middle quickly borks up the autoresizing behavior.

To end part 1 of this exploration, let’s add minimum sizes for our split view.

We instantiate a new controller class, we’ll call it MySplitViewController (as it stands now, its just a delegate but we’ll be adding other functionality to it as we move along).

Instantiate an instance of this class in the XIB and hook the delegate outlet of the NSSplitView outlet to the new class.

There are a bunch of optional methods declared in the NSSplitViewDelegate – we’ll implement only two. constrainMinCoordinate and constrainMaxCoordinate. The documentation is sparse on the functionality of these methods, but the header file for NSSplitView does a pretty good job of laying out the basics.

constrainMin… and constrainMax are called repeatedly while the divider is being dragged. In the example implementation, we’ll answer proposedMinimum+200 for the constrainMinCoordinate call, which in our example will have the effect of limiting the left subview to 200 pixels. Judicious use of NSLog will show that the proposedMinimum will be 0 — we’re adding 200 and hence the minimum position of the divider will be 200 pixels. When you begin having splitviews with more than two subviews, the concept is the same, but you are now responsible for determining which subview is being referenced. In our example there is only one divider and its index will always be zero.

The constrainMaxCoordinate method works in a similar fashion. The splitview sends in a proposedMaximumPosition that is the width of splitview – in this case, the entire width of the window. We’ll answer with that value – 100 resulting in a maximum divider position of the window width – 100 pixels.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

@implementation MySplitViewController
 
/*
 * Controls the minimum size of the left subview (or top subview in a horizonal NSSplitView)
 */
- (CGFloat)splitView:(NSSplitView *)splitView constrainMinCoordinate:(CGFloat)proposedMinimumPosition ofSubviewAt:(NSInteger)dividerIndex;
{
    NSLog(@"%@:%s proposedMinimum: %f",[self class], _cmd, proposedMinimumPosition);
    return proposedMinimumPosition + 200;
}
 
/*
 * Controls the minimum size of the right subview (or lower subview in a horizonal NSSplitView)
 */
- (CGFloat)splitView:(NSSplitView *)splitView constrainMaxCoordinate:(CGFloat)proposedMaximumPosition ofSubviewAt:(NSInteger)dividerIndex;
{
    NSLog(@"%@:%s proposedMaximum: %f",[self class], _cmd, proposedMaximumPosition);
    return proposedMaximumPosition - 100;
}

After compiling and running, we can now see that both the left and right subview are indeed constrained. Although the 100 pixel extent of the right view does not prevent the view from looking terrible, it does prevent the autoresize funkiness of the first example.

Conclusion and Next Steps

We’ve only scratched the surface of NSSplitView. We limited the complexity of our NSSplitView example to the simplest possible case and illustrated some of the challenges in using NSSplitView. In the end, we were able to introduce a few delegate methods that exert additional control over the behavior of NSSplitView.

In the next article, we’ll add support for collapsible subviews and then add programatic collapsing. Additional topics for future posts will cover adding animated adjustments, controlling the effective drag area, customizing dividers and generalizing the solution.

The code for this segment can be downloaded here: Part 1 Sample Projects

It is often the late night exploration of code in the wild that gives rise to these cute little hacks.

With my wrist tiring of flipping between safari and terminal, the following was born.

Goal

git clone the repository ref found in the system pasteboard

Scenario

When perusing gitHub, I’ll find something I want to check out. I click on the “clone” button which copies the git reference to the clipboard. I typically flip over to a terminal session, change directory to my favorite dumping grounds, and do a git clone Cmd-V enter.

Here’s a script that will do all of that. The secret sauce is teaming this up with something like FastScripts (an excellent status bar accessory).

1
2
3
4
5
6
7
8
9
10
11

#!/bin/sh
REPO=`pbpaste`
DUMPDIR=~/dev/extern
 
cd $DUMPDIR && /usr/local/git/bin/git clone $REPO
EXITCODE=$?
if [ "$EXITCODE" -ne "0" ]; then
	echo "Download of $REPO failed: $EXITCODE" | /usr/local/bin/growlnotify -p 1 "Clone Failed"
else
	echo "Download of $REPO successful" | /usr/local/bin/growlnotify "Clone Succeeded"
fi

What’s happening here?

First we grab the repo reference from the pasteboard using pbpaste. Then we cd to our dumping grounds, execute the git clone. If it fails (because it’s already there, no access, etc) we use growlnotify to throw up the appropriate message.

I bind this script in ~/Library/Scripts/Applications/Safari and then use Cmd-Shift-C – so click to copy, Cmd-Shift-C to clone.

In Mike Ash’s excellent series “Friday Q&A”, he recently wrote about defensive programming.

I’ve been tightening the screws on my first commercial Mac desktop app and reviewing my code for potential errors is front and center. It’s fair to say that all developers should heed Mike’s advice. I think its even more important (and fodder for a subsequent post) that indie developers heed this advice. Programming solo in the echo chamber has its share of challenges – someone to look over your shoulder occasionally is not a bad thing.

One thing that has bitten me a few times as I’ve reswizzled my UI and cleaned up ivars is missing IB connections. In Uli Kusterer excellent article on Defensive coding in Objective-C there is an excellent point about using NSAssert in your -awakeFromNib method to verify IB connections.

We’re getting there. The issue is that I’ve been disappointed with the behavior of NSAssert in my work to date. I will say up front that I may be missing something with NSAssert, but when I’m writing code and using assertions – I want a strong indication that something’s amiss. Pouring through console logs to find a missing IB connection doesn’t do it for me.

Using the following in my awakeFromNib

1
2
3
4
5

-(void) awakeFromNib
{
    NSAssert(button,@"IB connection for button is missing");
    NSLog(@"I'm the next line, but you'll never see me");
}

results in

*** Assertion failure in -[VerifyIBConnectionAppDelegate awakeFromNib], ..../VerifyIBConnectionAppDelegate.m:24
2009-10-30 10:20:45.824 VerifyIBConnection[35323:903] An uncaught exception was raised
2009-10-30 10:20:45.824 VerifyIBConnection[35323:903] IB connection for button is missing
2009-10-30 10:20:45.850 VerifyIBConnection[35323:903] *** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'IB connection for button is missing'

This is great. The app is terminated, giving me strong feedback that something is amiss.

If however I move the assertions to -applicationDidFinishLaunching, I get

*** Assertion failure in -[VerifyIBConnectionAppDelegate applicationDidFinishLaunching:], .../VerifyIBConnectionAppDelegate.m:35
2009-10-30 10:23:28.746 VerifyIBConnection[35429:903] IB connection for button is missing

and – the app is still running. The same assertions, in the same class, called at different points in the lifecycle have dramatically different results. So now, in addition to coding defensively, I also need to ponder where I’m asserting what – or else.

Vincent Gable has a nice post on NSAssert considered harmful which brings out this and several other points.

So while you and I decide whether to use NSAssert or the more dramatic assert, I put together the following macro to reduce the verbosity of coding such assertions.

1
2
3
4

// NSAssert version
#define IBVERIFY(condition) NSAssert((condition), @"IB Connection not established for %s", #condition)
// assert version
#define IBVERIFY(condition) assert((condition)!=nil && "IB Connection not established for:" #condition)

The NSAssert version behaves as above. The assert version results in

Assertion failed: ((button)!=nil && "IB Connection not established for:" "button"), function -[VerifyIBConnectionAppDelegate awakeFromNib], file .../VerifyIBConnectionAppDelegate.m, line 25.
Program received signal:  “SIGABRT”.

Outside of the gratuitous additional double quotes (which I’m sure someone will point out how to eliminate) – this version has the comforting side effect of killing my app – wherever it’s invoked from. I take comfort in getting that kind of direct feedback.

Should my opinion of NSAssert change, IBVERIFY can be easily retargeted to use such.