Increased height of one of the tab bar items

Question

I have a tab-based app created, which has 5 tabs.

I want the 3rd tab bar item to be of greater height than all other tabs.

The size of this 3rd tab bar item will always remain greater than other tabs.

How do I do it in a tab-based app? Is it possible without having a custom tab bar ?

Please help

Thanks in advance

Answer 1

You can easily achieve this effect by overlaying a custom view or button. Here's what I do in an application to achieve this effect (as seen below). I don't believe it's possible to do this without an additional subview.

UIButton *middleButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[middleButton addTarget:self action:@selector(tappedMiddleButton:) forControlEvents:UIControlEventTouchUpInside];

CGRect frame;
frame.size.height = 54;
frame.size.width = 72;
frame.origin.x = ceil(0.5 * (tabBarController.view.bounds.size.width - frame.size.width));
frame.origin.y = tabBarController.tabBar.bounds.size.height - frame.size.height;
[middleButton setFrame:frame];

[[tabBarController tabBar] addSubview:middleButton];

Then you can have your method that is called:

-(void)tappedMiddleButton:(id)sender {

}

Inside of that method you could set the selected index of the tab bar:

[tabBarController setSelectedIndex:2];