Why can't I blur my UITabBarController?

Question

I have a UITabBar and I want to make it blurry. I wrote the following code:

 import UIKit class TabBarController:UITabBarController { override func viewDidLoad() { super.viewDidLoad() let blur = UIBlurEffect(style: UIBlurEffectStyle.Light) let blurView = UIVisualEffectView(effect: blur) blurView.frame = self.view.bounds blurView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight] self.view.layer.insertSublayer(blurView, atIndex: 0) } } 

but somehow the last line throws an error:

Unable to convert value of type UIVisualEffectView to expected argument type 'CALayer'

how can i fix this?

I changed the last line to:

 self.tabBar.addSubview(blurView) 

but now the whole tab is blurred (even with icons, and they are not visible). When I changed this line to:

 self.tabBar.sendSubviewToBack(blurView) 

then the panel is visible but not blurry. I want to get the effect of the accepted answer from here Black background on transparent UITabBar , but here it is uitabbar, and I use uitabbarcontroller ... Can you help me with applying blur in my case?

Answer 1

You just add the blur as a preview:

 self.view.addSubview(blurView) 

Since you just want the blue tab bar, and this class is the tab bar controller, you can do:

 self.tabBar.addSubview(blueView) 

You also need to change the frame:

 blurView.frame = self.tabBar.bounds 

Answer 2

If I understood correctly from the following comment that you posted, you want to change the color of the UITabBar to black, but still blurry.

And yes, I noticed that the UITabBarController is blurry by default, but I would like to make it blurry with a specific style (.Dark).

Doing this since iOS 7 has really become quite simple. Just change the barStyle your UITabBar to .black . Put the following code in your UIViewController viewDidLoad method (note that UITabBar is translucent by default, so you don't need to specify it again).

 tabBarController?.tabBar.barStyle = .black 

If you want to set it back to a regular, white barStyle , return it to .default .

 tabBarController?.tabBar.barStyle = .default 

You can even do this from within the Interface Builder by selecting the tab bar in the UITabBarController hierarchy and changing its Style to black.

Answer 3

why don't you just use the barTintColor property on the TabBarController ?

 self.tabBar.translucent = true self.tabBar.barTintColor = UIColor.blackColor() 

You do not even need to subclass UITabBarController . You can call this on any UIViewController .

 self.tabBarController?.tabBar.translucent = true self.tabBarController?.tabBar.barTintColor = UIColor.blackColor() 

Answer 4

I have a solution, all you need to do is configure your UITabBar as follows:

 // next code will make tabBar fully transparent tabBar.isTranslucent = true tabBar.backgroundImage = UIImage() tabBar.shadowImage = UIImage() // add this if you want remove tabBar separator tabBar.barTintColor = .clear tabBar.backgroundColor = .black // here is your tabBar color tabBar.layer.backgroundColor = UIColor.clear.cgColor 

If you want to add blur, do the following:

 let blurEffect = UIBlurEffect(style: .dark) // here you can change blur style let blurView = UIVisualEffectView(effect: blurEffect) blurView.frame = tabBar.bounds blurView.autoresizingMask = .flexibleWidth tabBar.insertSubview(blurView, at: 0) 

As a result: