Image on UITabBar gets squished

Question

Hey I am using a custom sized UITabBar with extra large images.

I add the images to the tab bar item like this:

UITabBar *tabBar = self.tabBar;
    UITabBarItem *tabBarItem1 = [tabBar.items objectAtIndex:0];
    [tabBarItem1 setImage:[UIImage imageNamed:@"image"]];
    [tabBarItem1 setImageInsets:UIEdgeInsetsMake(0, 0, 20, 0)];

Also because the images are larger I want them to hover more in the middle of the tab bar, so I add the inset.

My issue is when I program the inset and then click on the button, the button squishes in on its self. It maintains its width, but its height squishes in on its self. I of course don't want this to happen, but I can't seem to find out whats going on.

Thanks, Krtko

-Note for Mods Please lock this thread

-Note for people answering my question. I appreciate your help but it was a known bug at the time, so please stop answering this question. Thank you

Answer 1

Are you seeing this on iOS 7 only?

7.1 seemed to introduce a bug with tab bar image insets. If you continually tap or hold the tab, it grows or shrinks depending on the insets. If you tap on another tab, the tab bar image goes back to normal right?

Answer 2

When using UIEdgeInsetsMake the important point is to have the top inset "BE EQUAL" to the bottom inset. For example : item.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);

Answer 3

Remove your insets for the image. Use an image that is exactly of the size you want. We have to follow this approach till Apple fixes this issue.

Answer 4

You may put a UIView on top of the tab bar, and add a UITapGestureReognizer to the UIView. When tapped, I determine where it is and call the appropriate selected item for the tabbar. Hack, but works quite nicely and lets you keep your inset values to whatever you want.

 @property UIView  tabBarCover;//place on top of uitabbar and give it clear color background

 - (void)viewDidLoad
 {
   [tabBar setSelectedItem:[tabBar.items objectAtIndex:0]];
    UITapGestureRecognizer *singleFingerTap =
                        [[UITapGestureRecognizer alloc] initWithTarget:self
                                        action:@selector(handleSingleTap:)];
   [tabBarCover addGestureRecognizer:singleFingerTap];

 }

Then each time the UIView is tapped, set the selected item based on where the user touched. I had 3 tab bar items, so I just did some logic for the x coordinate.

-(void) handleSingleTap:(UITapGestureRecognizer *) recognizer
{
    CGPoint location = [recognizer locationInView:[recognizer.view superview]];
    //NSLog(@"tapped it %lf", location.x);
    if(location.x<=105){
        //1st 3rd tapped, do something

    }
    else if(location.x >105 && location.x<=210)
    {
       //do nothing, selected item stays same. this is glas
    }else{
       //must be in 3rd section so do that load

    }

}

Hope it helps.

Answer 5

You just check if ios7 then setFrame again inside

• (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController