Custom Image in Tab Bar Item

[taimur]

I am trying to add custom image for the Tab Bar Item. Its not a greyscale Image. I have tried everything to add it through methods available in the library but couldn't add it.

I have added subview to tabbar using this code.

UIImage *imgPlaceAd = [UIImage imageNamed:@"placeAd-tab-bar"];
UIImageView *imgTab = [[UIImageView alloc] initWithFrame:CGRectMake(self.tabBarController.tabBar.center.x - imgPlaceAd.size.width/2,
                                                    8.0,
                                                    imgPlaceAd.size.width,
                                                    imgPlaceAd.size.height)];

    imgTab.image = imgPlaceAd;

    [self.tabBarController.tabBar addSubview:imgTab];

Doing that, it changes the Item's class and it is now UITabBarItem and not ESTabBarItem

I have checked in the ESTabBar class and print the class in this function

internal func select(itemAtIndex idx: Int, animated: Bool) 
{....}

---

When I try to add Image using the init function of ESTabBarItem I get a circularly grey image.

PlaceAdView *placeAdVC = [[PlaceAdView alloc] init];

placeAdVC.tabBarItem = [[ESTabBarItem alloc] init:[[TabBarBouncesContentView alloc] init] title:@"" image:[UIImage imageNamed:@"placeAd-tab-bar"] selectedImage:[UIImage imageNamed:@"placeAd-tab-bar"] tag:2];

[eggswift]

First, it is not suggested to add subview to UITabBar. You can set ESTabBarItemContentView's renderingMode

[eggswift]

20

[taimur]

@eggswift

You are right subview should NOT be added in a TabBar. I tried everything and then went for this solution.

I tried adding the image through image Rendering Mode but that didnt help too.

PlaceAdView *placeAdVC = [[PlaceAdView alloc] init];

placeAdVC.tabBarItem = [[ESTabBarItem alloc] init:[[TabBarBouncesContentView alloc] init] title:@""
              image:[[UIImage imageNamed:@"placeAd-tab-bar"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]
              selectedImage:[[UIImage imageNamed:@"placeAd-tab-bar"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]
              tag:2];

[taimur]

Can you please mention how can I use ESTabBarItemContentView's renderingMode

[eggswift]

@taimur

See ESTabBarItemContentView

/// Icon imageView renderingMode, default is .alwaysTemplate like UITabBarItem
    open var renderingMode: UIImageRenderingMode = .alwaysTemplate {
        didSet {
            self.updateDisplay()
        }
}

You can set this method to .automatic.

[taimur]

Thanks a lot @eggswift I have found another way to change rendering for the particular tabBarItem.

((ESTabBarItem *)placeAdVC.tabBarItem).contentView.renderingMode = UIImageRenderingModeAutomatic;