Issue in setting background image in UITabBar

Question

I'm trying to set the background image in UITabBar. The height of the tab bar and the background image is 49 px. It works well in all the devices except iPhone X and above. In iPhone X the image is only partially filled, to be precise the 49 px of the total height.

To fix this issue I have increased the image height so that it fits perfectly in the iPhone X device. It works well in the iPhone 8 device (the original background image is resized to 49 px) running in iOS 13 as well, unfortunately, in iOS 12 version of iPhone 8 it breaks and the background image is showing in its exact height.

Does anyone know why this is happening? Is there any workaround for this issue?

Answer 1

UITabBar is pretty capricious. If you did find a solution for each size of tabbar, you should use an extension , that lets you easily detect the type of device.

After that, you can use switch:

switch UIDevice().type {
    case .iPhone4, .iPhone4S, .iPhone5, .iPhone5C, .iPhone5S, .iPhone6, .iPhone6S, .iPhone6Plus, .iPhone6SPlus, .iPhone7, .iPhone7Plus, .iPhone8, .iPhone8Plus:
        imageView.contentMode = .scaleAspectFill
    case .iPhoneX, .iPhoneXR, .iPhoneXS, .iPhoneXSMax, .iPhone11, .iPhone11Pro, .iPhone11ProMax:
        imageView.contentMode = .scaleAspectFit
    default:
        ()
    }

You can use any specific customization for you image or use different images inside this block.

Hope that helps!