iOS UITabBarItem image selectedImage and image show incorrect

Question

Xcode: 8.2.1

- (instancetype)init {
    if (self = [super init]) {
        self.title = self.localStringModel.tab_title_market;
        self.tabBarItem.image = [UIImage imageName:@"unselected"];
        self.tabBarItem.selectedImage =[UIImage imageName:@"selected"];
    }
    return self;
}

description: when I unselected the tabBarItem the unselectedIamge the car lights cannot show.

picture:

It's been bothering me for a long time，I try use UIImageRenderingModeAlwaysOriginal but not work,by the way my image resources is 'pdf',can anyone help me ?

Answer 1

Objective C

@interface BaseClassVC (){
    UITabBarController *tabBarController;
}
@end
@implementation  BaseClassVC
- (void)viewDidLoad {
    [super viewDidLoad];
    [self setTabBarItemAction];
}
-(void)setTabBarItemAction{


    UIStoryboard *storyBoard = [UIStoryboard storyboardWithName:@"Home" bundle:[NSBundle mainBundle]];
    //    UITabBarController *tabBarController = (UITabBarController *)[storyBoard instantiateViewControllerWithIdentifier:@"Hometab"];
    tabBarController = (UITabBarController *)[storyBoard instantiateViewControllerWithIdentifier:@"Hometab"];


    // Assign tab bar item with titles
    UITabBar *tabBar = tabBarController.tabBar;
    UITabBarItem *tabBarItem1 = [tabBar.items objectAtIndex:0];
    UITabBarItem *tabBarItem2 = [tabBar.items objectAtIndex:1];
    UITabBarItem *tabBarItem3 = [tabBar.items objectAtIndex:2];
    UITabBarItem *tabBarItem4 = [tabBar.items objectAtIndex:3];
    UITabBarItem *tabBarItem5 ;///= [tabBar.items objectAtIndex:4];


    tabBarItem1.title = @"Home";
    tabBarItem2.title =  @"My cards";
    tabBarItem3.title = @"Withdraw Locations";
    tabBarItem4.title = @"Taxi";

    tabBarItem5.title = @"More..";

    tabBarItem3.badgeValue = @"0";
    tabBarItem4.badgeValue = @"0";



    [tabBarItem1 setImage:[[UIImage imageNamed:@"icn_tab_home_Normal"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
    [tabBarItem1 setSelectedImage:[[UIImage imageNamed:@"icn_tab_home_Selected"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

    [tabBarItem2 setImage:[[UIImage imageNamed:@"icn_nearby_deals_tab"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
    [tabBarItem2 setSelectedImage:[[UIImage imageNamed:@"icn_nearby_deals_tab_Selected"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];


    [tabBarItem3 setImage:[[UIImage imageNamed:@"icn_tab_ATM_Normal"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
    [tabBarItem3 setSelectedImage:[[UIImage imageNamed:@"icn_tab_ATM_Selected"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

    [tabBarItem4 setImage:[[UIImage imageNamed:@"icn_tab_Taxi_Normal"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
    [tabBarItem4 setSelectedImage:[[UIImage imageNamed:@"icn_tab_Taxi_Selected"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

    [tabBarItem5 setImage:[[UIImage imageNamed:@"icn_tab_more_Normal"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
    [tabBarItem5 setSelectedImage:[[UIImage imageNamed:@"icn_tab_more_Normal"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];



    tabBarController.tabBar.translucent = false;

    [[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys: TABBAR_NORMAL_TEXT_COLOURS, NSForegroundColorAttributeName,
                                                       nil] forState:UIControlStateNormal];
    [[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:
                                                       TABBAR_SELECTED_TEXT_COLOURS, NSForegroundColorAttributeName,
                                                       nil] forState:UIControlStateSelected];



    [[UITabBar appearance] setBarTintColor:ThemeColor];
    UIImage *whiteBackground = [Utility imageWithColor:TABBAR_SELECTED_COLOURS];
    [[UITabBar appearance] setSelectionIndicatorImage:whiteBackground];
    tabBarController.tabBar.translucent = false;



    /*
     [[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:
     [UIColor whiteColor], NSForegroundColorAttributeName,
     nil] forState:UIControlStateNormal];
     UIColor *titleHighlightedColor = [UIColor colorWithRed:153/255.0 green:192/255.0 blue:48/255.0 alpha:1.0];
     [[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:
     titleHighlightedColor, NSForegroundColorAttributeName,
     nil] forState:UIControlStateHighlighted];
     */



    [self.navigationController showViewController:tabBarController sender:nil];
    //  [self presentViewController:tabBarController animated:YES completion:nil];



}

Swift 2.3

    override func viewDidLoad() {
        super.viewDidLoad()
            methodTabBarController()

}



extension BaseClassVC {

    func methodTabBarController() -> Void{
        let storyboard = UIStoryboard(name: "HomePage", bundle: NSBundle.mainBundle())
        let tabBarController:UITabBarController = (storyboard.instantiateViewControllerWithIdentifier("idTabBarHometab") as? UITabBarController)!
        methodCustomtabBar(tabBarController)
        // presentViewController(tabBarController, animated: true, completion: nil)

        self.navigationController!.showViewController(tabBarController, sender: nil)

        // self.navigationController?.pushViewController(tabBarController, animated: true)

    }

    func methodCustomtabBar(tabBarController: UITabBarController) -> Void{

        // Assign tab bar item with titles
        let tabBar: UITabBar = tabBarController.tabBar
        let tabBarItem1: UITabBarItem = tabBar.items![0] as UITabBarItem
        let tabBarItem2: UITabBarItem = tabBar.items![1] as UITabBarItem
        let tabBarItem3: UITabBarItem = tabBar.items![2] as UITabBarItem
        let tabBarItem4: UITabBarItem = tabBar.items![3] as UITabBarItem

        tabBarItem1.title = "Home"
        tabBarItem2.title = "Nearby ATM"
        tabBarItem3.title = "Near By Shops"
        tabBarItem4.title = "Taxi"

        tabBarItem2.badgeValue = "0"
        tabBarItem3.badgeValue = "0"
        tabBarItem4.badgeValue = "0"

        tabBarItem1.image = UIImage(named: "icn_tab_home_Normal")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
        tabBarItem1.selectedImage = UIImage(named: "icn_tab_home_Selected")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)

        tabBarItem2.image = UIImage(named: "icn_tab_withdrawl_location_Normal")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
        tabBarItem2.selectedImage = UIImage(named: "icn_tab_withdrawl_location_Selected")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)

        tabBarItem3.image = UIImage(named: "icn_tab_nearbyshop_Normal")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
        tabBarItem3.selectedImage = UIImage(named: "icn_tab_nearbyshop_Selected")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)


        tabBarItem4.image = UIImage(named: "icn_tab_Taxi_Normal")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
        tabBarItem4.selectedImage = UIImage(named: "icn_tab_Taxi_Selected")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)




        // Sets the default color of the icon of the selected UITabBarItem and Title
        // UITabBar.appearance().tintColor = UIColor.redColor()

        // Sets the default color of the background of the UITabBar
        UITabBar.appearance().barTintColor = ThemeColor

        // Sets the background color of the selected UITabBarItem (using and plain colored UIImage with the width = 1/5 of the tabBar (if you have 5 items) and the height of the tabBar)
        // UITabBar.appearance().selectionIndicatorImage = UIImage().makeImageWithColorAndSize(UIColor.blueColor(), size: CGSizeMake(tabBar.frame.width/5, tabBar.frame.height))

        /*
         UITabBar.appearance().selectionIndicatorImage = UIImage().makeImageWithColorAndSize(UIColor.blueColor(), size: CGSizeMake(tabBar.frame.width/5, tabBar.frame.height))

         // Uses the original colors for your images, so they aren't not rendered as grey automatically.
         for item in self.tabBar.items as! [UITabBarItem] {
         if let image = item.image {
         item.image = image.imageWithRenderingMode(.AlwaysOriginal)
         }
         }
         }
         */


        UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: ColorConstant.TABBARITEMS.setTitleTextNormal], forState:.Normal)
        UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName:  ColorConstant.TABBARITEMS.setTitleTextSelected], forState:.Selected)



    }



}

Answer 2

Please, look into this. Change tab bar item selected color in a storyboard

It will solve your problem.

Use tintColor, and unSelectedItemTintColor Properties for UITabBar.

Answer 3

I think the problem is that your unselected image has solid white color in the lights. Try filling them with transparency instead, alpha = 0.0. It is always the alpha channel of the images that is used for drawing.