Search code examples
iosxcodeuitabbarcontrolleruitabbaritem

iOS : How to add Underline in UITabBarItem


I am working in a application where i need to add underline in UITabbarItem.

so i would like to add underline under the selected UITabbarItem in Default UITabbarcontroller of iOS.

I have already created subclass of UITabbarcontroller but didn't find any way to add line in that.

I want to do something like below image.

UITabbarWithUnderline Image

If anyone have any idea for this please share here.


Solution

  • Please try this one. I have used in my application once and hope it will help you too.

    This is how I have created Tab bar programmatically:

          UITabBarController *tab = [[UITabBarController alloc]init];
          ViewController1 *v1 = [[ViewController1 alloc]init];
          ViewController1 *v2 = [[ViewController1 alloc]init];
          ViewController1 *v3 = [[ViewController1 alloc]init];
          ViewController1 *v4 = [[ViewController1 alloc]init];
    
          tab.viewControllers = [NSArray
    arrayWithObjects:v1,v2,v3,v4,nil];
    
          [[tab.tabBar.items objectAtIndex:0]setImage:[UIImage imageNamed:@""]];
          [[tab.tabBar.items objectAtIndex:1]setImage:[UIImage imageNamed:@""]];
          [[tab.tabBar.items objectAtIndex:2]setImage:[UIImage imageNamed:@""]];
          [[tab.tabBar.items objectAtIndex:3]setImage:[UIImage imageNamed:@""]];
          int divide = 4;
          if([UIDevice currentDevice].userInterfaceIdiom ==UIUserInterfaceIdiomPad)
              divide =6;
          }
          UIView *view = [[UIView alloc]initWithFrame:CGRectMake(tab.tabBar.frame.origin.x,tab.tabBar.frame.origin.y, self.view.frame.size.width/divide, 56)];
    
          UIImageView *border = [[UIImageView alloc]initWithFrame:CGRectMake(view.frame.origin.x,view.frame.size.height-6, self.view.frame.size.width/divide, 6)];  
          border.backgroundColor = “your color”;
          [view addSubview:border];
          [tab.tabBar setSelectionIndicatorImage:[self changeViewToImage:view]];
    
    //This is the method that will draw the underline
    -(UIImage ) changeViewToImage : (UIView ) viewForImage {
          UIGraphicsBeginImageContext(viewForImage.bounds.size);
          [viewForImage.layer   renderInContext:UIGraphicsGetCurrentContext()];
          UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
          UIGraphicsEndImageContext();
          return img;
    }