Saturday, August 1, 2015

iOS UISplitView Basics

When a project is created with MasterDetailView template, internally it uses the UISplitViewController to achieve this. To learn internal workings of a UISplitViewController, thought to go through the tutorial at the link in references. Since the Xcode was version 6 at this writing, the Xcode options looked to be different. Below are the few simple steps to get the UISplitViewCotnroller into project

1. Create New Application as Single View Application (In the latest Xcode, there is no Empty Application template. so)
2. The story board by default will have a View Controller, drag and drop UISplitView Controller from the object box and delete the already existing view controller
3. Remember to set the Entry point as the Split view controller. Run and see in both iPad and iPhone 

When added the UISplitViewController, it added a bunch of things, mainly the below ones

1. A SplitViewController => To this, the Main View Controller and a Navigation Controller is added 
2. The Navigation controller hosts the TableViewController for navigational purposes 

These individual controllers can be customized by providing sub class and then setting the sub classes as the class names in the Storyboard Scene properties for individual scenes. 

From iOS 8.0, below call back is called whenever the popover appears on top of the main view detialed view controller to reveal the left view controller

- (void)splitViewController:(UISplitViewController *)svc willChangeToDisplayMode:(UISplitViewControllerDisplayMode)displayMode NS_AVAILABLE_IOS(8_0)
{
    NSLog(@"-- Will change to display mode is called --");
}

Though the concept is much useful in iPad, the iPhone part of experience is not so good. IF user need to go to the left view controller, the Detail view controller is completely removed from the scene. It is not similar to how a Left navigation list similar to Facebook where that can be created using view controller containment mechanism. 

Some of the screenshots are below 

iPad 



iPhone 6 Plus

iPhone 6



references:

No comments:

Post a Comment