How to add a rounded tab bar with shadow to your app

Tab bars with a slight upper corner radius have really spiced up in a subtle way the classic iOS tab bars we’re used to.

And I must admit I understand why designers use them, they look really nice! Add also a shadow and you can use a white background and a white tab bar.

Skeuomorphic Tab Bar by Ali Kemal

How to implement that?

First thing first, we need to subclass UITabBarController class in order to be able to add a custom view that will have the shadow as adding the shadow directly to the tabBar will conflict with the corner radius.

The custom tab bar view needs to have it’s frame updated on viewDidLayoutSubviews so don’t forget to call the setupCustomTabBarFrame method!

The result

I hope you find this useful! 😊