iosswiftuitabbar

How to apply a gradient on a UI Tab Bar In Swift?


I built the tab bar through the storyboard, and to customise the colour I change it in the app delegate, with UITabBar.appearance().barTintColor = Color,

I have a gradient method which is this:

func setGradientBackground(colorOne: UIColor, colorTwo: UIColor)  {
    let gradientlayer = CAGradientLayer()
    gradientlayer.frame = bounds
    gradientlayer.colors = [colorOne.cgColor, colorTwo.cgColor]
    gradientlayer.locations = [0, 1]
    gradientlayer.startPoint = CGPoint(x: 1.0, y: 0.0)
    gradientlayer.endPoint = CGPoint(x: 0.0, y: 0.0)

    layer.insertSublayer(gradientlayer, at: 0)

}

How do I apply this to the background of my tab bar?


Solution

  • Just create a subclass of UITabBarController

    class GradientTabBarController: UITabBarController {
    
            let gradientlayer = CAGradientLayer()
    
            override func viewDidLoad() {
                super.viewDidLoad()
                setGradientBackground(colorOne: .yellow, colorTwo: .red)
            }
    
            func setGradientBackground(colorOne: UIColor, colorTwo: UIColor)  {
                gradientlayer.frame = tabBar.bounds
                gradientlayer.colors = [colorOne.cgColor, colorTwo.cgColor]
                gradientlayer.locations = [0, 1]
                gradientlayer.startPoint = CGPoint(x: 1.0, y: 0.0)
                gradientlayer.endPoint = CGPoint(x: 0.0, y: 0.0)
                self.tabBar.layer.insertSublayer(gradientlayer, at: 0)
            }
    }
    

    Assign GradientTabBarController class in the storyboard instead of UITabBarController

    Main pros of this methodology are below.

    1. No need to define delegate methods of UITabBar
    2. No need to write code in each UIViewController