42

Solutions

Web Apps. Mobile Apps. Awesome!

Blog

Playing With iOS SplitView

May 20, 2016
by

Bromoji - iPad in Landscape

Looking at the above screenshot, you can see that we’ve put the help screen to the left and the main content of the app to the right on the iPad. In iOS terms, that usually means that the left-hand item is the Primary View Controller (PVC) while the right-hand item is the Secondary View Controller (SVC). Ordinarily, this is not a problem because the PVC will be something like a ListView while the SVC will be something like a ScrollView or something else that holds all the content the ListView was pointing towards.

But the way we have it structured on the iPhone is that the actual screen of scrollable bromoji is the PVC while clicking the “info” icon will push the help screen’s controller on top of the navigation controller as the SVC. So… how did we change it for the iPad?

Part of it was actually pretty simple. In the SplitViewController‘s -(void)viewDidLoad method I added this:

1
2
3
4
5
6
7
if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad) {
   UINavigationController *master = (UINavigationController*)self.viewControllers.firstObject;
   UIViewController *detail = self.viewControllers.lastObject;
   NSArray *reverse = @[detail, master];
   self.viewControllers = reverse;
   self.presentsWithGesture = NO;
}
if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad) {
   UINavigationController *master = (UINavigationController*)self.viewControllers.firstObject;
   UIViewController *detail = self.viewControllers.lastObject;
   NSArray *reverse = @[detail, master];
   self.viewControllers = reverse;
   self.presentsWithGesture = NO;
}

So far, so good. I check to see if we’re using an iPad. If we are, I grab the two controllers, stuff them into a new array in the reverse order that they had been in before, then re-assign that to the SplitViewControllers viewControllers property.

But notice the last line: self.presentsWithGesture = NO;

This is used because, if you swipe back from the SVC, it will try to show the PVC. The problem here is that, because we reversed them in code but not in the storyboards, it will try to default back to the way the storyboard had it and you’ll end up with a giant box of gray that you can never escape from, short of killing the app and launching it again.

There’s one more bit of code that also has to go within the SplitViewController:

1
2
3
4
5
6
7
- (BOOL)splitViewController:(UISplitViewController *)splitViewController collapseSecondaryViewController:(UIViewController *)secondaryViewController ontoPrimaryViewController:(UIViewController *)primaryViewController {
    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone) {
        return YES;
    } else {
        return NO;
    }
}
- (BOOL)splitViewController:(UISplitViewController *)splitViewController collapseSecondaryViewController:(UIViewController *)secondaryViewController ontoPrimaryViewController:(UIViewController *)primaryViewController {
    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone) {
        return YES;
    } else {
        return NO;
    }
}

Essentially, this prevents the now reversed PVC and SVCs from getting confused and doing strange UI behaviors.

There are probably better ways to do this but I had to figure this out because I wanted two things, if possible. First was to invert the standard window layout of a SplitView, where the right-hand side was the larger side and the left-hand side was the shorter side. Short of that, I wanted to keep the larger left-hand display regardless of orientation and size class the app was being given.

I tried to re-size the relative windows but, it turns out, there’s really only so much that can be done with that. There are some properties of UISplitViewController such as preferredPrimaryColumnWidthFraction, minimumPrimaryColumnWidth, and maximumPrimaryColumnWidth but, even when playing with various numbers, I couldn’t get it to reverse the built-in display style. Which has me wondering whether this is planning for the future, where there will be a lot more flexibility in layouts. These were introduced in iOS 8 and we’re on 9 now, which introduced App SplitViews*, so maybe now that Apps can have multiple windows and multiple apps can be shown side-by-side, the next thing is to allow more flexibility of views within multi-views… if any of that even makes sense.

If anyone has done this before or think that have a better solution, I’d love to hear it. Always looking for new ways to push iOS to do what I want it to do.

(* I hate how Apple used the same term for splitting windows within an app as for splitting the screen between two apps. It’s really made it quite difficult to look up documentation because you end up with 101 CNet article reviewing the new “Split View” feature on iOS 9. Like they really couldn’t have come up with another term? Also, look how confusing the above paragraph is…)

You can download Bromoji from the App Store here or feel free to contact 42 Solutions for an estimate on building your app or custom keyboard.

Back to Blog

42 Tags: , , , ,

Comments

Content for class "bottomYellow" Goes Here
Content for class "bottomBlue" Goes Here

42 Solutions

Working with 42 Solutions, you’ll find that it’s not the technology that’s important, it’s the idea. Regardless of whether your company is based on proprietary software or open source, we will find the right tools to get the job done.

Invite us to your office and we’ll send a pair of consultants armed with laptops and bright ideas, ready to solve your problem and offer solutions. We pride ourselves in getting to know how you do business and integrating into your process.