Xcode 6 - Swift - customizable navigation bar

Question

I am trying to create a tabbed application with navigation elements inside a tab bar as shown in the figure below (red bar) using Swift / XCode 6.2. Basically, these three icons in the middle will direct the user to various view controllers. The other two icons will be context based. For example, on the table view page, you will see a menu icon and add a new icon as shown in the image. However, clicking on the line will change the menu icon to the back icon, and the add icon to something else.

This is a general idea, but it’s very difficult for me to implement something even close to this. The first problem is that whenever I embed a view in a tab bar controller, I cannot move the tab bar up. However, when I create a custom UITabView in the view controller, Control + Click and dragging the tab bar item to another view does not create a segue. I did not even begin to deal with the presence of navigation elements inside the panel.

I assume that I am asking, just for a little guidance, on which route to take to deal with this. I suppose I cannot use the tab bar controller or the navigation controller because it does not look like I can configure so many of them. So, the custom tab bar and navigation bar, and then programmatically change the changes and the changes to the button?

Thanks.

Answer 1

I will try to guide you from an architectural point of view (so you will not find much code below).

Using UITabBarController

In order to achieve what you offer, you are right , you cannot use the UITabBarController once , for several reasons, the most direct of them is that they should always be at the bottom , and you want it to be at the top (check out Apple docs ). The good news is that maybe you don't need it!

Note. If you still want to use the UITabBarController for any reason, see @Matt answer .

Using UINavigationController

You can use the UINavigationController to solve this problem, since the UINavigationBar for the UINavigationController can be customized. There are several ways to organize the hierarchy of views to achieve what you offer, but let me clarify one option:

• To configure the UINavigationBar buttons to add, you just need to set its navigationItem header :

   // Assuming viewWithTopButtons is a view containing the 3 top buttons self.navigationItem.titleView = viewWithTopButtons 

• To add the functionality of the hamburger menu to the UINavigationController , you can find a few posts on how to do this, and endless frames that you can use. Check out this other SO question for a more detailed answer (e.g. MMDrawerController , ECSlidingViewController to mention a couple).

• On organizing the hierarchy of views, it really depends on when the user deletes one of the main upper buttons, she will always refer to the first view controller in a new section or if you want to return it back to the last view in the section where it was.

  3.1 In the switching sections, the first view of the new section is displayed

  Your UIWindow application will have one UINavigationController on top of the hierarchy. Then, each of the top three buttons, when pressed, will change the root view controller of the UINavigationController .

  Then, when the user changes the section, the current navigation hierarchy is discarded , setting the view controller of the new section as the root view controller of the UINavigationController .

   self.navigationController = [sectionFirstViewController] 

  3.2. The switching sections display the last displayed view in a new section

  This will require a slightly modified version above, where each of your sections will have its own UINavigationController , so you can always keep the navigation hierarchy in each section.

  Then, when the user deletes one of the top buttons to switch the section, instead of changing as described above, you change the UIWindow root view controller to a new UINavigationController section.

   window.rootViewController = sectionNavigationController 

Using custom implementation

Of course, the latter, as well as the very correct option, is that you implement your own component to achieve your requirements. This is probably an option that requires a lot of effort in exchange for the highest customizability.

Choosing this option is definitely not recommended for less experienced developers.

Answer 2

I would like to take a hit on this - I think you can use the tab bar controller here.

• Your top-level controller will be a UITabBarController with a hidden UITabBar .
• Each tab is contained in a UINavigationController .
• All view controllers in the navigation controller will be a subclass of the view controller (for example, SwitchableViewController ).
• In the SwitchableViewController viewDidLoad you specify the title view of the navigation element (i.e., whatever is in the center; self.navigationItem.titleView ) - a view containing three central buttons. May be a UISegmentedControl or a custom view.
• Whenever you press any of the buttons, you change the topmost UITabBarController selected index to the view controller that you want to display.

Problems you may encounter:

• The table views inside the tabs will have scrollIndicatorOffset at the bottom, even if the tab bar is hidden.
  • Decision. Play with the automaticallyAdjustsScrollViewInsets tab bar controller or interior view controller. fooobar.com/questions/984251 / ...
• Your name will be animated every time you click on a new view controller in the navigation stack.
  • Decision. Take a look at creating custom transition animations for the UINavigationController.