Xlpagertabstrip: Style unselected items

[bishalg]

I have to style Unselected Items which on design looks as follows.
i.e Selected items are white color text where as unselected are slight gray.

But looks like there is property to style selected items only !

        settings.style.buttonBarBackgroundColor = .black
        settings.style.buttonBarItemTitleColor = .white
        settings.style.buttonBarItemBackgroundColor = .clear
        settings.style.selectedBarBackgroundColor = UIColor(red:0, green:0.66, blue:0.88, alpha:1)
        settings.style.selectedBarHeight = 2.0
        settings.style.buttonBarItemLeftRightMargin = 10.0
        settings.style.buttonBarItemsShouldFillAvailiableWidth = true

[tinblanc]

+1

[nickcastel50]

Hi @bishalg, @tinblanc

Add this to your viewDidLoad or similar:

//need this to change background color of the selected button contentview
        changeCurrentIndexProgressive = { (oldCell: ButtonBarViewCell?, newCell: ButtonBarViewCell?, progressPercentage: CGFloat, changeCurrentIndex: Bool, animated: Bool) -> Void in
            guard changeCurrentIndex == true else { return }

            //change contentview and textlabel colors
            oldCell?.label.textColor = .topNavTextColor()
            newCell?.label.textColor = .white
            oldCell?.contentView.backgroundColor = .white
            newCell?.contentView.backgroundColor = .secondaryColor()

            if animated {
                UIView.animate(withDuration: 0.1, animations: { () -> Void in
                    newCell?.transform = CGAffineTransform(scaleX: 1.0, y: 1.0)
                    oldCell?.transform = CGAffineTransform(scaleX: 0.8, y: 0.8)
                })
            }
            else {
                newCell?.transform = CGAffineTransform(scaleX: 1.0, y: 1.0)
                oldCell?.transform = CGAffineTransform(scaleX: 0.8, y: 0.8)
            }
        }

I've added some extra things like transformations to show some of the functionality available, let me know if you have any questions.

[bishalg]

@nickcastel50 : this solution almost works but will have follow effect -

i.e. Active Tab is white, the next tab is gray but the issue is 3rd tab is NOT which is inactive but still white in text color.
But again if the user slides to the tabs and comes back it will work.

To force load all the tab I added following to viewDidAppear even this does not solve the issue -
moveToViewController(at: 1, animated: false) moveToViewController(at: 2, animated: false) moveToViewController(at: 0, animated: false)

[nickcastel50]

@bishalg,

You have settings.style.buttonBarItemTitleColor set to white. That property is for the text color of the unselected tabs. Set it to the color you want to get your desired effect.

Maybe I was a bit unclear, my solution was for the highlighted tab. Change the buttonBarItemTitleColor to apply the faded gray text color and then use the solution in my post above to style your highlighted tab and that should fix your issue.

[hellaandrew]

Thank you @bishalg for this.