CODEWITHSUNDEEP
iosswiftxcode
M1X
M1X

Reputation: 5374

iOS Top Navigation Bar

Which is the best approach in order to create a Top Navigation Bar like this one on Instagram?

I have a Tab Bar controller which has 5 views but I do not understand how to create another navigation bar inside one of this views. Should I create two labels and connect each of them with another view or is there something better to achieve this?

enter image description here

Upvotes: 0

Views: 2211

Answers (1)

Karlo A. López
Karlo A. López

Reputation: 2668

Your approach is good, would be nice to see some screenshots or code to fully understand it.

If you want to put navigation bar inside those tab bar views you need to put a container view that connects to a navigation controller.

I created a simple project to show you how I achieved this.

Using a scrollview to contain another two view containers embedded with some navigation controllers:

The view containers allows you to embed any type of view / controller:

Apple docs has a nice reference of how to do this, in your case you just need to change ViewController to NavigationController.

And if you don't mind to use third party code, well there are plenty of options for you to choose:

PolioPager 

import PolioPager

class ViewController: MainContainerViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func tabItems()-> [TabItem] {
        return [TabItem(title: "One"),TabItem(title: "Two")]
    }

    override func viewControllers()-> [UIViewController]
    {
        let storyboard = UIStoryboard(name: "Main", bundle: nil)

        let viewController1 = storyboard.instantiateViewController(withIdentifier: "cont1")
        let viewController2 = storyboard.instantiateViewController(withIdentifier: "cont2")

        return [viewController1, viewController2]
    }
}

In above example you can use PolioPager to instantiate 2 different navigation view controllers, identified by storyboard identifier cont1 cont2 for example.

Other trip party libraries:

https://github.com/XuYanci/GLViewPagerController

https://github.com/rechsteiner/Parchment

Upvotes: 1

Related Questions