navigation bar an tab bar gradient color

Question

This is the code I have written for my Tab bar controller :

class TabBarUiViewController: UITabBarController {

    let layerGradient = CAGradientLayer()


    override func viewDidLoad() {

        layerGradient.colors = [UIColor.init(red: 247/255, green: 146/255, blue: 30/255, alpha: 1).cgColor, UIColor.init(red: 236/255, green: 104/255, blue: 66/255, alpha: 1).cgColor]
        layerGradient.startPoint = CGPoint(x: 0, y: 0.5)
        layerGradient.endPoint = CGPoint(x: 1, y: 0.5)
        layerGradient.frame = CGRect(x: 0, y: 0, width: view.bounds.width, height: view.bounds.height)
        self.tabBar.layer.insertSublayer(layerGradient,at:0)
        self.tabBar.unselectedItemTintColor = .black

        super.viewDidLoad()

    }

}

I want the same color and pattern for navigation controller bar. what should I do? As i tried it wasn't as easy as tab bar gradient I'm looking for a new swift source

Possible duplicate of [How can I set the UINavigationbar with gradient color?](https://stackoverflow.com/questions/30884170/how-can-i-set-the-uinavigationbar-with-gradient-color) — Kamran, Jul 15 '18 at 05:59
I have tried this link that you sent, but does not make any effect on my bar!!!!!! — Am1rFT, Jul 15 '18 at 06:01
the second one which has a red navigation bar is a swift code but does not work at all, that is the reason why I added this question — Am1rFT, Jul 15 '18 at 06:08
I have no code, I have the tab bar code and I'm looking for the navigation bar code! — Am1rFT, Jul 15 '18 at 06:16

shiju86.v · Accepted Answer · 2018-07-15T06:04:08.747

For Tabbar: use addSublayer instead of insertSublayer.

class TabBarUiViewController: UITabBarController {

let layerGradient = CAGradientLayer()

override func viewDidLoad() {
    super.viewDidLoad()

    layerGradient.colors = [UIColor.red.cgColor, UIColor.yellow.cgColor]
    layerGradient.startPoint = CGPoint(x: 0, y: 0.5)
    layerGradient.endPoint = CGPoint(x: 1, y: 0.5)
    layerGradient.frame = CGRect(x: 0, y: 0, width: view.bounds.width, height: view.bounds.height)
    self.tabBar.layer.addSublayer(layerGradient)
}

}

And for navigation bar:

override func viewDidLoad() {

super.viewDidLoad()

self.title = "Gradient Navigation Bar"

if let navFrame = self.navigationController?.navigationBar.frame {

  let newframe = CGRect(origin: .zero, size: CGSize(width: navFrame.width, height: (navFrame.height + UIApplication.shared.statusBarFrame.height) ))

  let image = gradientWithFrametoImage(frame: newframe, colors: [UIColor.red.cgColor, UIColor.blue.cgColor])!

  self.navigationController?.navigationBar.barTintColor = UIColor(patternImage: image)

 }
}

func gradientWithFrametoImage(frame: CGRect, colors: [CGColor]) -> UIImage? {
  let gradient: CAGradientLayer  = CAGradientLayer(layer: self.view.layer)
  gradient.frame = frame
  gradient.colors = colors
  UIGraphicsBeginImageContext(frame.size)
  gradient.render(in: UIGraphicsGetCurrentContext()!)
  let image = UIGraphicsGetImageFromCurrentImageContext()
  UIGraphicsEndImageContext()
  return image
 }

Hope this helps you.

it works fine for the tab bar , i don't know how to code it for navigation controller bar — Am1rFT, Jul 15 '18 at 05:53
OP's code is working for `TabBar`. The question is about `NavigationBar` — Kamran, Jul 15 '18 at 05:54
@shiju86.v It didn't change anything :| !!!!!!!! maybe I'm doing it in a wrong way!!!! I have created a uinavigationcontroller and I connected my uinavigationcontroller to that file — Am1rFT, Jul 15 '18 at 06:15
I also added : gradient.startPoint = CGPoint(x: 0, y: 0.5) gradient.endPoint = CGPoint(x: 1, y: 0.5) to make it left to right — Am1rFT, Jul 15 '18 at 06:23
is that possible to use this func to have gradient color for buttons too? — Am1rFT, Jul 15 '18 at 06:39

navigation bar an tab bar gradient color

1 Answers1