Split View Controller

This is known as a split view controller, where there is a view controller on the left that takes up about 30% of the space, and a view controller on the right that takes up 70% of the screen estate.

In portrait mode, there is a button to tap which brings up a view controller known as a Popover Controller. This PopoverController is the exact same controller that was on the left in the previous slide.

Let’s start off first with a Split View Controller. We simply create it as usual, and then set the viewControllers property to an array of view controllers. Take note that we should only have two view controllers here.

Create split view controller

UISplitViewController* splitVC = [[UISplitViewController alloc] init];

Set viewControllers 

splitVC.viewControllers = [NSArray arrayWithObjects:firstVC, secondVC, nil];

For the popover controller, it is slightly different. We have to create the controller with an already existing view controller and set the delegate. Furthermore, we need to have a custom property that contains this popoverController.
After which, we can present the popover from a UIBarButtonItem or a rectangle. In here, permittedArrowDirections means which way the arrow of the popovercontroller can point.

Create Popover Controller/set delegate

UIPopoverController* aPopover = [[UIPopoverController alloc] initWithContentViewController:content];
aPopover.delegate = self;

Set in custom property
self.popoverController = aPopover;

Present controller

[self.popoverController presentPopoverFromBarButtonItem:sender permittedArrowDirections:UIPopoverArrowDirectionAny animated:YES];

[popoverController presentPopoverFromRect:CGRectMake(0,0,100,100) inView:self.view
permittedArrowDirections:UIPopoverArrowDirectionAny animated:YES];

As mentioned earlier, the view controllers in the split view controller and the popover controller are the same. We have to do a bit of extra work to ensure all is smooth. Let’s first take care of it when the iPad rotates from a landscape to a portrait orientation. Firstly, the delegate method, willHideViewController withBarButtonItem forPopoverController will be called. In here, we have to point the UIBarButtonItem which has been created by the method and set it to our popoverController property which we have. This is where the property comes into use.

Supporting Orientation Changes

// Called when rotating to a portrait orientation. 
– (void)splitViewController: (UISplitViewController*)svc willHideViewController:
(UIViewController *)aViewController withBarButtonItem: (UIBarButtonItem*)barButtonItem forPopoverController: (UIPopoverController*)pc{
barButtonItem.title = @”Root List”; 
NSMutableArray *items = [[toolbar items] mutableCopy]; 
[items insertObject:barButtonItem atIndex:0]; [toolbar setItems:items animated:YES]; 
[items release]; 
self.popoverController = pc;


When we rotate it back to the landscape position, we do the exact opposite, by removing the UIBarButtonItem and setting the popoverController to be nil.

Supporting Orientation Changes

// Called when the view is shown again in the split view, invalidating the button and popover controller.

– (void)splitViewController: (UISplitViewController*)svc willShowViewController: (UIViewController *)aViewController invalidatingBarButtonItem:(UIBarButtonItem
*)barButtonItem {
NSMutableArray *items = [[toolbar items] mutableCopy]; 
[items removeObjectAtIndex:0]; 
[toolbar setItems:items animated:YES]; 
[items release]; 
self.popoverController = nil;