Tab Bar corner radius not showing transparent corners - ios

Question

I'm trying to add a corner radius to my Tab Bar in the top left and top right corners.
Here is my code:
import UIKit
class TabBarController: UITabBarController, UITabBarControllerDelegate {
override func viewDidLoad() {
super.viewDidLoad()
self.tabBar.layer.cornerRadius = 32
self.tabBar.layer.masksToBounds = true
self.tabBar.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]
}
}
And here is my Interface Builder for the Tab Bar:
But my Tab Bar comes out looking like this:
As you can see, if you look at the corners, they're not transparent, they're white. It should show the image behind it. So it looks like something is going wrong with masking, but I'm not sure what.
What am I doing wrong?
Here is my other IBDesignable class that might be affecting this:
import UIKit
#IBDesignable
class DesignableView: UIView {
}
#IBDesignable
class DesignableButton: UIButton {
}
#IBDesignable
class DesignableLabel: UILabel {
}
#IBDesignable
class DesignableTextField: UITextField {
}
extension UIView {
#IBInspectable
var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
layer.masksToBounds = newValue > 0
}
}
#IBInspectable
var shadowOffset: CGSize {
get {
return layer.shadowOffset
}
set {
layer.shadowOffset = newValue
}
}
#IBInspectable
var shadowColor: UIColor {
get {
return UIColor(cgColor: layer.shadowColor!)
}
set {
layer.shadowColor = newValue.cgColor
}
}
#IBInspectable
var shadowRadius: CGFloat {
get {
return layer.shadowRadius
}
set {
layer.shadowRadius = newValue
}
}
#IBInspectable
var shadowOpacity: Float {
get {
return layer.shadowOpacity
}
set {
layer.shadowOpacity = newValue
}
}
#IBInspectable
var borderWidth: CGFloat {
get {
return layer.borderWidth
}
set {
layer.borderWidth = newValue
}
}
#IBInspectable
var borderColor: UIColor {
get {
return UIColor(cgColor: layer.borderColor!)
}
set {
layer.borderColor = newValue.cgColor
}
}
}
Update:
I've found that if I change the background color of the View Controller behind the tabs, the corners of the tab bar match that color:
If I debug the view, you can actually see the little red corners in one of the views:
What does this mean?

Answer 1

I created a project with just the TabBarController. In that, I used your code and set the corner radius, border width and border color.
In the first ViewController, I did the following:
Checked to see if "Under Bottom Bars" is checked in the ViewController.
Added an image and extended it to go under the bottom bar.
It all seemed to work as expected. See image below. May be you can double check your code to see if any of the above steps help.