How to programmatically change tabbarItem image

I am developing a shopping cart tab. Initially, I simply use the default icon value to show how many items are in the basket on the bottom tab. Now the designer wants to be a fantasy, he wants to show another image based on the number of items in the basket. For example, if there is, show cartTab-1.png, if 2, show cartTab-2.png ...

I tried changing the tabaritem image ( UITabBarItem ), but this did not work for me. Is it possible? I discussed with my colleague, he said that I may have to draw an image on top of the tab. Do you have any suggestions? thanks

more details:

  • I created a tabItem using InterfaceBuilder and installed the image and name there.
  • I need to support ios4. Therefore, I cannot use setSelectedImage ...
  • In my case, this is KVO, if the basket counter changes, it notifies about the method of updating the image. not at the initialization stage.

Does anyone know why [self.tabBarItem setImage:[UIImage imageNamed:@"cartxxx.png"]] does not work? When I debug, the property changes, but the user interface remains the same

Update

below code works. Thanks to all!

 UIImage* cartTabImage = [UIImage imageNamed:cartTabImageName]; [[self.tabBarController.tabBar.items objectAtIndex:3] setImage:cartTabImage]; 
+4
source share
7 answers
 UITabBarItem *tabBarItem0 = [self.tabBarController.tabBar.items objectAtIndex:0]; [tabBarItem0 setImage:[[UIImage imageNamed:@"iconGray.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]]; [tabBarItem0 setSelectedImage:[[UIImage imageNamed:@"iconBlue.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]]; 
+5
source

Swift 3.0 version for 2 tabs,

 self.tabBar.items?[0].image = UIImage(named: "inactive_image_0")?.withRenderingMode(.alwaysOriginal) self.tabBar.items?[0].selectedImage = UIImage(named: "active_image_0")?.withRenderingMode(.alwaysOriginal) self.tabBar.items?[1].image = UIImage(named: "inactive_image_1")?.withRenderingMode(.alwaysOriginal) self.tabBar.items?[1].selectedImage = UIImage(named: "active_image_1")?.withRenderingMode(.alwaysOriginal) 
+5
source

The easiest way I've found is

  self.tabBarItem.image=[UIImage imageNamed:@"myImage.png"]; 
+3
source

Try the following:

 int numItems = 0; // count of items in your shopping cart NSString *imageName = [NSString stringWithFormat:@"cartTab-%d",numItems]; // change your image [[self.tabBar.items objectAtIndex:myIndex] setImage:[UIImage imageNamed:imageName]]; // or, if you want to set it when initializing the tabBar UITabBarItem *item = [[[UITabBarItem alloc] initWithTitle:myTitle image:[UIImage imageNamed:imageName] tag:someTag]; 
+2
source

This answer may help you.

  UITabBarItem *i5=[[UITabBarItem alloc]initWithTitle:@"Profile" image:[UIImage imageNamed:@"profile.png"] tag:5]; 
+1
source
 - (void)setFinishedSelectedImage:(UIImage *)selectedImage withFinishedUnselectedImage:(UIImage *)unselectedImage 

selectedImage is displayed when the user has selected a tab. unselectedImage is displayed when the user selects another tab.

in viewDidLoad: do

 UIImage *c1 = [UIImage imageNamed:@"cart1.png"]; UIImage *c2 = [UIImage imageNamed:@"cart1unselected.png"]; [[self tabBarItem] setFinishedSelectedImage:c1 withFinishedUnselectedImage:c2]; 
+1
source

As mentioned in the updated question and other answers, in most cases UITabBarItem needs to be obtained directly through the UITabBarController .

IOS seems to be creating an instance of UITabBarItem , which explains why updating the self.tabBarItem property self.tabBarItem not reflect changes in the user interface:

Two instances of UITabBarItem

I suppose this happens when the elements of the tab bar are created programmatically and not by the storyboard, but this is just an assumption.

Then the solution, as indicated, accesses the array of Tab Bar elements through the controller of the tab bar. This solution is bad in that it depends on knowing the index of the tab element:

 UITabBarItem *tabBarItem = [self.tabBarController.tabBar.items objectAtIndex:0]; [tabBarItem setImage:image]; [tabBarItem setSelectedImage:image]; 

Remember to update both images by default and selected states.

0
source

Source: https://habr.com/ru/post/1390785/


All Articles