Paging Control vs UITabBar on iOS

Question

This is the starting page of my App.

Trips, Chats and Settings at the bottom are in UITabBar

If user clicks on a trip/group, (s)he is leaded to the following Group Home. (This page is 'pushed' on 'Trips' NavigationVC)

Now I want the bottom options Timeline, Plans, Conversation and Budget to be working like UITabBarOptions. But this is against Apple UX Guidelines of using UITabBarController, as there should be just one TabBarController throughout the App.

The other alternative is to use PagingView Controller which looks like this:

But this doesn't look as simple as the Tab Bar. What UX should I go with, or is there a better UX design to present this whole scenario?

Answer 1

As you said:

But this is against Apple UX Guidelines of using UITabBarController, as there should be just one TabBarController throughout the App.

Therefore bottom tabbar is out since you already have a main tabbar.

Since I don't have the full back story, I'm assuming Timeline, Plans, Conservation and Budgets are the page sub-links.

Here are some common best practices for mobile sub navigation links:

• Arranged the most important links from left to right.
• Do not hide the links.
• Icons take up space and mobile has limited screen estate. If its preventing you from showing more content, you might want to consider removing them.
• Navigation links should be obvious to the user, tab or colored links are great choice.
• Sufficient paddings around the link to make it easy for the fingers to tap on.

I would go for the paging view controller.

^{download bmml source – Wireframes created with Balsamiq Mockups}

You might also want to consider this approach to surface more content:

^{download bmml source}

Unless your target group are really tech and design savvy, I would a adopt a more common and conventional way of styling my sub-links.

Answer 2

First: Not what I would recommend, but what it seems more like what you have in mind.

There is a common UI to do this, and its the UISegmentedView,

Second: I think a scrolling UI with all the info on the same view, grouping relevant info is better. Let me give you some examples.

I have circled every category, this be the way to show your trip. Notice that some of this are just previews/summaries of the information, you have to go to a different view controller to have more detail.

Also your chat would need to be on another view controller as chats don't go inside tabs usually.

I would suggest something like this:

^{download bmml source – Wireframes created with Balsamiq Mockups}