2

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

iOSDev
  • 3,617
  • 10
  • 51
  • 91
  • 3
    Your app may get rejected by apple for violating the [HIG](http://developer.apple.com/library/ios/documentation/userexperience/conceptual/mobilehig/UIElementGuidelines/UIElementGuidelines.html#//apple_ref/doc/uid/TP40006556-CH13-SW52): `A tab bar does not change its opacity or height, regardless of device orientation.` – Richard J. Ross III Feb 04 '13 at 01:04
  • 1
    you may refer this thread. http://stackoverflow.com/questions/4192784/shopkick-application-ui-widgets – Dilshan Feb 04 '13 at 04:46

1 Answers1

9

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];
Aaron Wojnowski
  • 6,352
  • 5
  • 29
  • 46