XLPagerTabStrip ButtonBar sticks behind Navigation Bar

Question

I'm using XLPagerTabStrip in a swift 3 application, I use the default ButtonBar and everything works fine but the bar is hidden when I have a navigation bar enabled like this:

If I hide the navigation bar, it shows like this:

How do I get it below the navigation bar not behind it, because I need the navigation bar right there?

import UIKit
import XLPagerTabStrip

class DesignersController: ButtonBarPagerTabStripViewController {

override func viewDidLoad() {

    buttonBarView.backgroundColor = .white
    settings.style.buttonBarBackgroundColor = .white
    settings.style.selectedBarBackgroundColor = UIColor(netHex: 0x4a4a4a)
    settings.style.selectedBarHeight = 1
    settings.style.buttonBarItemBackgroundColor = .white
    settings.style.buttonBarItemTitleColor = UIColor(netHex: 0x8c8c8c)

    super.viewDidLoad()
}

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)
    self.navigationController?.setNavigationBarHidden(true, animated: animated)
}

override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)
    //self.navigationController?.setNavigationBarHidden(false, animated: animated)
}

var isReload = false

override func viewControllers(for pagerTabStripController: PagerTabStripViewController) -> [UIViewController] {
    let child_1 = ChildExampleViewController(itemInfo: "Top")
    let child_2 = ChildExampleViewController(itemInfo: "Men")
    let child_3 = ChildExampleViewController(itemInfo: "Women")

    guard isReload else {
        return [child_1, child_2, child_3]
    }

    var childViewControllers = [child_1, child_2, child_3]

    for (index, _) in childViewControllers.enumerated(){
        let nElements = childViewControllers.count - index
        let n = (Int(arc4random()) % nElements) + index
        if n != index{
            swap(&childViewControllers[index], &childViewControllers[n])
        }
    }
    let nItems = 1 + (arc4random() % 8)
    return Array(childViewControllers.prefix(Int(nItems)))
}

override func reloadPagerTabStripView() {
    isReload = true
    if arc4random() % 2 == 0 {
        pagerBehaviour = .progressive(skipIntermediateViewControllers: arc4random() % 2 == 0, elasticIndicatorLimit: arc4random() % 2 == 0 )
    }
    else {
        pagerBehaviour = .common(skipIntermediateViewControllers: arc4random() % 2 == 0)
    }
    super.reloadPagerTabStripView()
}
}


import Foundation
import XLPagerTabStrip

class ChildExampleViewController: UIViewController, IndicatorInfoProvider {

var itemInfo: IndicatorInfo = "View"

init(itemInfo: IndicatorInfo) {
    self.itemInfo = itemInfo
    super.init(nibName: nil, bundle: nil)
}

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}

override func viewDidLoad() {
    super.viewDidLoad()

    let label = UILabel()
    label.translatesAutoresizingMaskIntoConstraints = false
    label.text = "XLPagerTabStrip"

    view.addSubview(label)
    view.backgroundColor = .red

    view.addConstraint(NSLayoutConstraint(item: label, attribute: .centerX, relatedBy: .equal, toItem: view, attribute: .centerX, multiplier: 1, constant: 0))
    view.addConstraint(NSLayoutConstraint(item: label, attribute: .centerY, relatedBy: .equal, toItem: view, attribute: .centerY, multiplier: 1, constant: -50))
}

// MARK: - IndicatorInfoProvider

func indicatorInfo(for pagerTabStripController: PagerTabStripViewController) -> IndicatorInfo {
    return itemInfo
}
}

Thanks in advance.

Yeah.. creating a demo app and checking, give it some time Thanks :) — Annie Gupta, Oct 13 '16 at 12:31

score 4 · Accepted Answer · answered Oct 21 '16 at 16:46

4

I just faced the same problem. Just add a CollectionView to VC in Interface Builder, and set its class to "ButtonBarView".Here Then connect its outlet with view in left panel.Like this Thats all, now buttonBar should be under NavigationBar.

answered Oct 21 '16 at 16:46

Gotaras

56
2

In my case, I just was ignoring `SafeArea` and had constrains aligned to `SuperView` (see [UIStoryBoard - Prevent overlapping status bar](https://stackoverflow.com/a/46279345/8740349)) – Top-Master Mar 20 '21 at 18:27

score 3 · Answer 2 · edited Jun 20 '19 at 13:41

3

This helped me and works for iPhone X:

self.navigationController!.navigationBar.isTranslucent = false

edited Jun 20 '19 at 13:41

Paul Roub

36,322
27
84
93

answered Jun 20 '19 at 13:25

Tural Veliyev

59
1
3

score 0 · Answer 3 · answered Jun 02 '17 at 01:49

0

self.edgesForExtendedLayout = []

I used nib to create PagerViewController and wrote the above code within viewDidLoad()

answered Jun 02 '17 at 01:49

Stephen C

57
1
8

This does show the tabs, but it also makes my nav bar background color white, and kills the transparency. I need my navigation bar transparent. – Slobodan Antonijević Jun 09 '17 at 08:30

score 0 · Answer 4 · answered Mar 03 '20 at 22:00

0

This Helped me

self.edgesForExtendedLayout = UIRectEdge()

answered Mar 03 '20 at 22:00

Raza Baloch

334
4
9

XLPagerTabStrip ButtonBar sticks behind Navigation Bar

4 Answers4

Linked