Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Rounded corners for UITabBar

Tags:

swift

uitabbar

I would like to create a UITabBar with rounded corners. Is there a way I can make the UITabBar have rounded corners? It would take the shape of the second picture.

The app starts off with a tableView. When the user taps a topic, they are sent to a tabBar controller.

enter image description here

This is the shape I want it to take

-----edit-----

This is my AppDelegate:

func application(_application: UIApplication,
willFinishLaunchingWithOptions launchOptions: [NSObject : AnyObject]?) -> Bool{

    let tabBarController = window?.rootViewController as! UITabBarController
    let image = UIImage(named: "bar")
    let tabBarImage = resize(image: image!, newWidth: tabBarController.view.frame.width)
    tabBarController.tabBar.backgroundImage = tabBarImage
    

    return true
}

func resize(image: UIImage, newWidth: CGFloat) -> UIImage {

UIGraphicsBeginImageContext(CGSize(width: newWidth, height: image.size.height))
image.drawInRect( CGRect(x: 0, y: 0, width: newWidth, height: image.size.height))
let newImage = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()

return newImage!
}

enter image description here

Edit: Dec '21 Replaced image to omit name on project.

like image 651
DrPepperGrad Avatar asked Nov 28 '22 04:11

DrPepperGrad


2 Answers

Hope this help you

self.tabBar.layer.masksToBounds = true 
self.tabBar.isTranslucent = true 
self.tabBar.barStyle = .blackOpaque 
self.tabBar.layer.cornerRadius = 20 
self.tabBar.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]
like image 126
Jeri P.M Avatar answered Dec 22 '22 06:12

Jeri P.M


Its working fine for me

override func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()

        self.tabBarController?.tabBar.layer.masksToBounds = true
        self.tabBarController?.tabBar.isTranslucent = true
        self.tabBarController?.tabBar.barStyle = .default
        self.tabBarController?.tabBar.layer.cornerRadius = 25
        self.tabBarController?.tabBar.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]

    }
like image 42
Kathiresan Murugan Avatar answered Dec 22 '22 06:12

Kathiresan Murugan