8

I am looking to implement a custom Tab Bar in iOS where selected item is bigger size than the rest of the tabs and peeks out over the content similar to this screenshot. enter image description here

Could someone point to a tutorial of how to accomplish this preferably in Swift?

AlexVPerl
  • 7,652
  • 8
  • 51
  • 83

2 Answers2

8

I faced with this task several times. I found a lot of tutorials but I've never found one that gives the ability to create a center button that part of it is out of the tab bar.

At the end, I created an approach to have it done correctly. I implemented a simple example project with instructions how to do that. Please check my Custom Tabbar Center Button repo as an example.

One more benefit of it it's center button hides correctly with the tab bar when you use Hide Button Bar on Push property.

enter image description here

Rostyslav Druzhchenko
  • 3,673
  • 3
  • 33
  • 38
2

A UITabBar contains an array of UITabBarItems, which inherit from UIBarItem. But unlike UIBarButtonItem that also inherits from UIBarItem, there is no API to create a UITabBarItem with a customView.

So instead of trying to create a custom UITabBarItem, we’ll just create a regular one and then put the custom UIButton on top of the UITabBar

Not swift, but should be easily translated.

https://github.com/boctor/idev-recipes/tree/master/RaisedCenterTabBar

This one is Swift: https://github.com/itsKaynine/SwiftRaisedTab

Source code for a similar question, using Swift 3: https://stackoverflow.com/a/36016377/300897

Community
  • 1
  • 1
bradenkeith
  • 2,397
  • 1
  • 17
  • 26
  • Thanks for this. Its one possible approach. But I'm looking to have a selected tab raised not just a center one. These solutions place a custom button at the center, any idea how I can do this for any selected tab not just the center one? – AlexVPerl Jan 14 '17 at 01:23
  • Ah, I see. I misunderstood your intent. I'll post back if I find anything. – bradenkeith Jan 14 '17 at 01:48