Remove tab bar background when using custom layer

Question

I have created a custom rounded floating tab bar successfully but how can i removed the default tabbar (shown with arrow in the picture). I tried to set tabbar background to UIImage() and set background color to clear but it is still not working. My code:

let layer = CAShapeLayer()
    guard let tabBar = tabBarController?.tabBar else {return}
    layer.path = UIBezierPath(roundedRect: CGRect(x: 30,
                                                  y: tabBar.bounds.minY + 5,
                                                  //y: tabBar.bounds.minY - 28,
                                                  width: tabBar.bounds.width - 60,
                                                  height: tabBar.bounds.height - 24),
                              cornerRadius: (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.masksToBounds = false
    layer.fillColor = UIColor.white.cgColor
    
    tabBar.layer.insertSublayer(layer, at: 0)

Have you tried checking the superviews if any of them have background color? — Aswath, Jul 23 '21 at 03:18

score 2 · Answer 1 · answered Jul 23 '21 at 15:01

2

Use the tab bar appearance:

        let app = UITabBarAppearance()
        app.backgroundEffect = .none
        app.shadowColor = .clear
        tabBar.standardAppearance = app

answered Jul 23 '21 at 15:01

matt

515,959
87
875
1,141

Tried this solution and still not working – IskandarH Jul 25 '21 at 05:16
Works for me, sorry. – matt Jul 25 '21 at 05:20
Do you use storyboard or create ui programatically? – IskandarH Jul 26 '21 at 02:17
I started with the storyboard. But I don't see what difference it would make. – matt Jul 26 '21 at 02:29

score 0 · Answer 2 · answered Mar 20 '23 at 19:03

For All iOS Versions

self.tabBar.backgroundColor = UIColor.white
self.tabBar.isTranslucent = false

// set a specific tab bar color
if #available(iOS 13.0, *) {
    let tabBarAppearance = UITabBarAppearance()
    tabBarAppearance.configureWithOpaqueBackground()
    tabBarAppearance.backgroundEffect = .none
    tabBarAppearance.shadowColor = .clear
    tabBarAppearance.backgroundColor = UIColor.white
    UITabBar.appearance().standardAppearance = tabBarAppearance
    if #available(iOS 15.0, *) {
        UITabBar.appearance().scrollEdgeAppearance = tabBarAppearance
    }
}

Remove tab bar background when using custom layer

2 Answers2