Hi I am new in iOS development and came across with challenge that I am struggling to overcome. Basically I would like to add corner radius to UITabBarController, however I do not know how. I checked several resources in Stackoverflow and also Youtube and the solutions that people shared either were too complicated to understand or were giving errors such as "Value of type 'UITabBarController' has no member 'layer'.". By the way I don't use storyboard.
(Note: The comments in the code are for styling purposes. Since I could not make them work I commented them.)
Code:
import UIKit
class TabBarViewController: UIViewController, UITabBarControllerDelegate {
var tabBarCnt: UITabBarController!
override func viewDidLoad() {
super.viewDidLoad()
createTabBar()
setUpBarStyle()
}
func createTabBar(){
// viewcontroller.tabBarItem.title = "Dash"
// viewcontroller.tabBarItem.image = UIImage.init(named: "imageName")
// viewcontroller.tabBarItem.selectedImage= UIImage.init(named: "imageName")
tabBarCnt = UITabBarController()
tabBarCnt.tabBar.barStyle = .default
// let mapVC = MapViewController()
let homeVC = HomeView()
// mapVC.tabBarItem.title = "Map"
homeVC.title = "Home"
tabBarCnt.viewControllers = [homeVC]
self.view.addSubview(tabBarCnt.view)
}
func setUpBarStyle(){
// would like to add corner radius
let layer = CAShapeLayer()
//
// layer.path = UIBezierPath(roundedRect: CGRect(x: 30, y: self.tabBarCnt.bounds.minY + 5, width: self.tabBar.bounds.width - 60, height: self.tabBar.bounds.height + 10), cornerRadius: (self.tabBar.frame.width/2)).cgPath
// layer.shadowColor = UIColor.lightGray.cgColor
// layer.shadowOffset = CGSize(width: 5.0, height: 5.0)
// layer.shadowRadius = 25.0
// layer.shadowOpacity = 0.3
// layer.borderWidth = 1.0
// layer.opacity = 1.0
// layer.isHidden = false
// layer.masksToBounds = false
// layer.fillColor = UIColor.white.cgColor
//
// self.tabBarCnt.layer.insertSublayer(layer, at: 0)
// if let items = self.tabBarCnt.items {
// items.forEach { item in item.imageInsets = UIEdgeInsets(top: 0, left: 0, bottom: -15, right: 0) }
// }
//
// self.tabBarCnt.itemWidth = 30.0
// self.tabBarCnt.itemPositioning = .centered
}
}
You can modify the existing tabBar in your UITabBarController
.
func setUpBarStyle(){
// Clipping needs to be enabled, otherwise rounded corners won't show.
tabBarCnt.tabBar.clipsToBounds = true
tabBarCnt.tabBar.layer.cornerRadius = 20
// I guess you want to mask to top left and right corners. If not, change the maskedCorners to what you want.
tabBarCnt.tabBar.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]
}