iOS Navigation with side menu - ios

I need to create a navigation in iOS app like following screenshot.
It contains a Tab Bar and a Side menu.
The problem is the right navigation menu button, should be visible in all tabs. Even all inner screens of each tab.
When user selects an option from side menu, it should be displayed on screen.
Now each tab should be accessible from each option item, and each option menu should be accessible in each tab. Its like a many-to-many relationship in DB.
How should I design it?
I have tried following so far.
Within each tab, there is a containerViewController. Which consists of my FrontViewController and SideMenuViewController.
When an option is selected from side menu, a message is passed to containerViewController which removes the old FrontViewController from view and adds new OptionViewController.
The menu button and navigation bar is added in containerViewController, so that if should be visible every time, at any screen.
Problems
Now facing some problems using this approach.
As the navigation bar is added in containerViewController. I have access it using parent property of my FrontViewController. Suppose if I need to use PushViewController in my FrontViewController, I have to use parent property. Like this
[self.parent.navigationController pushViewController:newVC animated:YES ];
[self.parent.navigationController popViewControllerAnimated:YES];
I have to use this approach within each tab. Means code is repeating 5 times.
Can anyone suggest a simple solution. Any help is appreciated.

You can try to use InteractiveSideMenu for your purpose. It supports interactive opening/closing menu and following customization:
Animation duration
Visible content width
Content scale
Using spring animation with params customization
Animation options like animation curve
You should use 3 basic ViewControllers for creating subclasses for implementing your side menu.
MenuContainerViewController is a host for menu and content views
MenuViewController is a container for menu view
MenuItemContentControlller is a container for content that corresponds menu item
Here is an example of setup Host controller.
import InteractiveSideMenu
class HostViewController: MenuContainerViewController {
override func viewDidLoad() {
super.viewDidLoad()
self.menuViewController = self.storyboard!.instantiateViewController(withIdentifier: "NavigationMenu") as! MenuViewController
self.contentViewControllers = contentControllers()
self.selectContentViewController(contentViewControllers.first!)
}
private func contentControllers() -> [MenuItemContentViewController] {
//here is instantiation of content view controllers
}
}

I would think about subclassing UINavigationController and adding your button management logic there. When any view controller is pushed into the nav controller, set its bar button item.
The side menu shouldn't be inside each tab. Your root view controller should really control the main and side views and the main view has your tab controller which has a navigations controller as the root of each tab.
Now that the navigation bar doesn't need to be managed by a different container controller things become easier.
Bar button actions push up to the root view controller only, a reference to it can be set when the navigation controllers are created. Option selection would traverse root VC -> main (tab) VC -> selected tab nav controller -> push.

It could be easier to use a cocoapod for iOS side menus such as APMultiMenu. I've used it and it's simple to use and follow

Related

What is the standard method for implementing navigation menus in swift?

I'm trying to create navigation through the use of a menu in my app, but I'm not sure how it should be done. I currently have a system set out like this:
ContainerViewController
|
+---CenterNavigationController
|
+---ViewControllerA [i.e. the root view controller which will be changed]
|
+---MenuViewController [pushed to navigation stack on btn press]
and when a item in the menu is pressed to load another view controller, MenuViewController calls a delegate method in the ContainerViewController which replaces the NavigationController with a new one with a different root
let newVC = ViewControllerB()
CenterNavigationController = UINavigationController(rootViewController: newVC)
However this looks janky, both in the code and in the aesthetics of the app.
I'm not sure how to do this properly. I'm wanting the menu to be overlayed onto the current view, and have the ability to click 'back' in the menu to go back to what was showing on screen before the menuVC was loaded. How can I do this?
You do all correct. If navigation animation isn't good, then improve it. You can show menu animated from the left side and reload CenterNavigationController without animation. As for transparence, then just change the color of the main view of the menu view controller to semitransparent. The first subview that contains all menu items should be non-transparent and have lower width and sticked to the left side. That's it.
I think you should not push menu view controller into the navigation stack. Just load it right into the UINavigationView controller.
You can check loadViewController (line 251) method here https://gitlab.com/seriyvolk83/SwiftEx/blob/master/Source/UIExtensions.swift
It loads view controller into another view controller in a given bounds. To remove it later (close menu) you can use remove() (see line 321)
Hamburger menu is antipattern on iOS, I suggest using UITabBarController. If someone is holding a gun to your head and forcing you to put a hamburger menu in your app then use something like this: https://github.com/jonkykong/SideMenu

Add Tab Bar to Navigation Controller

I want to add a tab bar with three options (Home) the first view, (Incidences) with the second view, and (Info) with the third view, in the first view I have 2 buttons that shows the second and the third view.
What I have to do to add tab bar with these 3 tabs, always visible in the App?
I have this structure now:
New project -> Tabbed Application.
Replace the First and Second Views with your viewControllers. There will be no need for your left hand side view as the tabs will be your buttons
Each UIViewController in UITabBarController could be embedded in an UINavigationController at your convenience, that way you'll be able to use all of the features that you need.
Apple guideline for Tabbar: Tab Bar Controllers
Basically, you need to select the View Controller of (associated with) Tab Controller ▶ click on Editor menu item ▶ select Embed in and click on Navigation Controller
For correct flow of navigation using tabbar you need to bind tabbar
controller with View Controller first and then embed navigation
controller to tabbar. Similar way you can also embed navigation
controller to tabbar controller, but its not the correct flow.

How to create a UIView with NavigationBar and TabBar

I would like to introduce in my app a View that will contains both navigation bar and a tab bar at the bottom. View contains a Table View with multiple entries and once user tap on a cell a push segue takes him to another view with details regarding the cell he has previously tapped. If he decides, user can go back to parent view by tapping on 'Back' button of the navigation bar on top. In addition to this, I would like my view to have a tab bar at the bottom with extra tools for the user. So, if he decides to check the 'Creator' of the app, he can by simply tap on 'Creator' TabBarItem at the bottom.
I would like to ask you what is the best way to achieve the above. I have already tried to use UITabBarController combined with UINavigationController. Didn't achieve what I was looking for because I would like the view with the table on it to be independent from the TabBarController and NOT a part of it (by part I mean by accessible through tabs).
Do you believe a UINavigationController view with UITabBarView would be a better choice?
UPDATE
What I mean by, "independent from the TabBarController and NOT a part of it":
Once the app loaded, I would like to see my main view (with table) contains Navigation Bar on top and Tab Bar at the bottom. However, I don't want to see the first tab of the Tab Bar selected because my main view will not be accessible through tabs of the Tab Bar but through Navigation Bar. If, for example, I am in Main view and tap on 1st tap, I would like to move to another view that will contains some other info.
Option 1:-
Create a tab bar Controller and on that TabbarController assign your navigation Views.
say nav1 with tab1 , nav2 with tab2...
Option 2:-
Create a Navigation View Controller and than add the tabbarcontroller on that navigationView Controller by using addSubView.
So when the user clicks on a row in a table u will go to a different View which doesn't have the TabbarController and when the user comes back he will again see the TabbarController.
This is what I will do:
First I will subclass UITabbarController and create for example ParentTabBarController. This controller will contain all the tabs necessary and what they will do if they are clicked so on.
Next for each viewcontroller I create, I will subclass from this ParentTabBarController so that the tabs are already in. You can add additional functionality or override it depending on your situation.
In your appdelegate pass in a navigation controller and every time push and dismiss the viewcontrollers you created in second step.
Hope this helps..

Tab bar disappears when trying to go back from new view

I am very new to Xcode and have encountered an issue with my app. I am trying to create a tab bar app. On one of the tabs I have a button that brings the user to a different ViewController. I want to have it so the user can select a button that would return them to the tab that had the button. I tried to set up an action from the button to the previous view (the tabbed screen), however the tab bar disappears. I hope this is makes sense.
Here is a link to a screenshot...
Easiest way to do this is to place a UINavigationController as the root view controller of the TabBarController. You can do this in storyboard by simply ctrl+dragging from the tabbar controller to the navigation controller and adding it as a relationship.
Here's an example using storyboards:
The next step is to set the third controller (in this case the table view controller) to your player view controller class.
Then, you can use the default back button and animation that comes with the navigation controller. If you prefer to hide the navigation bar at the top of the screen, then you can use your custom back button to call
[self.navigationController popViewControllerAnimated:YES];
You can also choose custom animations / segues, etc. but using a navigation controller to help you navigate screens is probably the simplest approach.

How to go from a single view to a tab bar view

need some help here
My problem is, my app starts with a single view, it shows a menu made with buttons that takes me to different places, one of this places is another kind of menu, but this menu is a tab bar menu, so the thing is, I made a new file with its .xib, I added the tab bar controller, and i Linked all the sections of my tabs with its viewcontrollers...
this means that I have my first menu ready, I have my view controllers ready, I have my menu on the tab bar ready....
so my problem is...
how can I go from my single view (the first view that I see and that doesnt include a tab bar), to the new screen with tab bar controller in it after pressing a button???
help me please
Note: I'm using XCode 4.2 and I'm not working with storyboards (requirements of the app)
You have three options to show your viewController content :
1.using presentModalViewController:
2.add the viewController view as a subView to the current viewController. in your case : [singleViewController.view addSubView:tabBarViewController.view];
3.or if your simple ViewController is the navigation root viewController you can push other viewControllers to its navigation stack. (as #roronoa zorro described).
You might have added all the next viewControllers on the taBarController so if you have want to tabbar on to next screen you simplr have to push the tabbarcontroller on the navigationcontroller.
[self.navigationController pushViewController:TabBarControllerObj];

Resources