3

Under iOs7, and not earlier versions, I've a line who pass through my Tab Bar (shown with green arrow on example picture from the link below).

I don't know where the problem come from. Any idea how to correct it ?

Thank you very much.

Tab Bar with a line

Lorenzo Bevilacqua
  • 365
  • 7
  • 16
PatriceK
  • 37
  • 1
  • 6

6 Answers6

11

If you're referring to the couple of pixel shadow on top of the bar, it's easy to remove. All you have to do is enable clipsToBounds on your tab bar, like so:

[self.tabBarController.tabBar setClipsToBounds:YES];
Mick MacCallum
  • 129,200
  • 40
  • 280
  • 281
  • Thank you for your help. The line I don't want is not the 2 pixels of shadow but the 1 pixel line who pass through the buttons, right where the green arrow is. But your information was useful to see that this line was the bounds of the tab bar... Can't this line be hidden ? I can reduce the buttons but I would want the home button higher... – PatriceK Sep 13 '13 at 18:42
  • Same problem with me, this is my question http://stackoverflow.com/questions/29160096/an-unwanted-line-on-tab-bar-controller-under-ios-8-1-in-iphone-6 , i have use your way but its not working , i have add snapshot of my screen in question please check it and tell me something....Please – Ravi Ojha Mar 22 '15 at 16:50
5

Add these two line after you create the TabBar 

[[UITabBar appearance] setShadowImage:[[UIImage alloc] init]];
[[UITabBar appearance] setBackgroundImage:[[UIImage alloc] init]];
Xu Yin
  • 3,932
  • 1
  • 26
  • 46
gaurish.salunke
  • 1,059
  • 10
  • 18
4
UIImage* tabBarBackground = [UIImage imageNamed:@"transparentImage.png"];
[[UITabBar appearance] setShadowImage:tabBarBackground];
[[UITabBar appearance] setBackgroundImage:tabBarBackground];

/////transparentImage.png - empty 1x1px image //// It's resolve my problem

Sergey Rudenko
  • 51
  • 5
1

I think you have to check the height of UITabBar in iOS 7. It is possible Apple has decreased the height of UITabBar, as per height of UITabBar you have to redesign your image for accurate result.

imDeveloper
  • 804
  • 1
  • 8
  • 16
  • Thank you for your answer. It seems exact the height of UITabBar as been decreased. No method to hide this line ? – PatriceK Sep 13 '13 at 18:46
  • To hide that line you must have to resize your background image of UITabbar specially for iOS 7 as per new height of UITabBar & programmatically you have to check that if (iOS 7) then setup iOS7-navigationbarbgimage image else iOS6-navigationbarbgimage, i think it should be proper solution i guess. – imDeveloper Sep 15 '13 at 05:37
  • I have chosen this method and redone my background images to stuch to the UITabbar. Thx. – PatriceK Sep 18 '13 at 16:09
  • One Property has been added from iOS 7 i.e barStyle update that property to UIBarStyleBlack. – imDeveloper Nov 20 '13 at 05:33
  • 2
    and then set up shadow image like this [tabBar setShadowImage:[UIImage new]]; – imDeveloper Nov 26 '13 at 09:02
  • Hi @Mur.. I am facing the same issue.. Do i have to get my new image made with dimensions 320X49 pixels?? At present i am using 320X64 pixels, which seem to bring a line in the middle of my image.. – Shradha Dec 16 '13 at 08:47
  • Yes, You have to update your image size as tabBar height is 49 pts. – imDeveloper Dec 16 '13 at 17:54
0

use this [[UITabBar appearance] setShadowImage:[UIImage imageNamed:@"transparentImage.png"]];

transparentImage.png can be image with 0 alpha size 1x1 pixel

AccBLue
  • 41
  • 2
0

In case you are struggling with a custom UITabBarItem taller than the UITabBar height, a solution that let you preserve your default UITabBar shadowImage and backgroundImage (with the blur effect) is achieved by using CALayer.

I am using this code in my UITabBarController subclass:

- (id) init
{
    if ((self = [super init]))
    {
        self.delegate = self;

        CALayer * superLayer = self.tabBar.layer;
        CALayer * layer = [CALayer layer];
        layer.bounds = CGRectMake (0.0f, 0.0f, 62.0f, 56.0f);
        layer.contents = (id) [UIImage imageNamed: @"custom-tabbaritem"].CGImage;
        layer.anchorPoint = CGPointMake (0.5f, 1.0f);
        layer.position = CGPointMake (superLayer.bounds.size.width / 2.0f, superLayer.bounds.size.height);
        layer.zPosition = 1.0f;
        [self.tabBar.layer addSublayer: layer];
    }

    return self;
}

Note that you can also use layer.frame = CGRectMake (...) in place of bounds, anchorPoint and position. I am using these ones to better deal with images with various heights by anchoring the sublayer to the bottom of the UITabBar. By implementing a UITabBarControllerDelegate method such as tabBarController:shouldSelectViewController: it is possible to make this UITabBarItem do custom actions, for example presenting a modal view controller.

In this case I used a plain UIViewController as the view controller for the custom UITabBarItem (the other ones are all subclasses):

- (BOOL)  tabBarController: (UITabBarController *) tabBarController
shouldSelectViewController: (UIViewController *) viewController
{
    if ([viewController isMemberOfClass: [UIViewController class]])
    {
        SomeViewController * modal = [SomeViewController new];
        [tabBarController presentViewController: modal
                                       animated: YES
                                     completion: nil];
        modal = nil;

        return NO;
    }

    return YES;
}
Lorenzo Bevilacqua
  • 365
  • 7
  • 16