top of page
  • Writer's pictureJennifer Eve Vega

Navigation Controller and a Tabbar Controller in One View

If you wanted to show a Navigation Controller and a Tabbar Controller in one view, should the navigation controller be inside the tabbar controller or is it the other way around? 

Most beginners happen to do this in an INappropriate manner. The answer to my first question is that the Navigation Controller should be put inside the Tabbar Controller. And the worst part for those who do not know how to do that is that they will just put a Navigation bar at the top part of the view. Don\’t do this, let me help you how to do it properly.

If you could still remember how we created a Tabbed Application, do it first before following the next steps. Follow this tutorial up until Step 10. (http://iosmadesimple.blogspot.com/2012/09/tabbed-application-using-interface.html)

Let\’s Begin!

1. Expand the Placeholders/Objects Panel, and the Tab Bar Controller. Drag a Navigation Controller Object under the TabBar Controller.

2. Since I only want two tabs for my TabBar Controller, I will make my first tab a Navigation-Based view, so I will delete one View Controller below the Navigation Controller object.


For Step 1 and 2.

I edited the tint of the Navigation Bar and its Navigation Title.



Hit run and it should look like this.


3. Did you follow the tutorial above and reached step 10? If so, I\’ll assume that you created two view controllers already (the FirstViewController and the SecondViewController). In my FirstViewController, I added a button which will be used later on in this tutorial.

4. Import the two ViewControllers, then, go back to our MainWindow.xib, change the class of the ViewController inside the Navigation Controller. So as the ViewController inside the Tabbar Controller.


5. Create another ViewController, let\’s name it \”ThirdViewController,\” put a label to indicate that it\’s the ThirdVC.

6. Import ThirdViewController in FirstViewController Class. Create an IBAction method that will push the ThirdVC and show it.

– (IBAction)goToThirdView:(id)sender {

ThirdViewController *thirdVC = [[ThirdViewController alloc] init];

    [self.navigationController pushViewController:thirdVC animated:YES];

}

7. Connect the IBAction to our Button in FirstViewController.xib.


8. Hit Run, and you should be able to navigate from FirstVC to the ThirdVC and still have the TabbarController.


#UITabbarController #tabbar #UINavigationandUITabbarController #iOSTutorial #NavigationandTabbarController #tabbarcontroller #UINavigationController #NavigationController #iOS #Navigation

14 views0 comments

Recent Posts

See All

Hi Everyone! It has been a very long while since I last posted in this blog. This time, I will be making a tutorial in using blocks when we are accessing our API or web services. Disclaimer: I am also

Post: Blog2 Post
bottom of page