iOS 11 iPhone X simulator UITabBar icons and titles being rendered on top covering eachother

Question

Anyone having issue with the iPhone X simulator around the UITabBar component?

Mine seem to be rendering the icons and title on top of each other, I\'m not sure if I

Answer 1

override UITabBar sizeThatFits(_) for safeArea

extension UITabBar {
    static let height: CGFloat = 49.0

    override open func sizeThatFits(_ size: CGSize) -> CGSize {
        guard let window = UIApplication.shared.keyWindow else {
            return super.sizeThatFits(size)
        }
        var sizeThatFits = super.sizeThatFits(size)
        if #available(iOS 11.0, *) {
            sizeThatFits.height = UITabBar.height + window.safeAreaInsets.bottom
        } else {
            sizeThatFits.height = UITabBar.height
        }
        return sizeThatFits
    }
}