CODEWITHSUNDEEP
ios5uitabbarcontrollertabbar
Ricardo
Ricardo

Reputation: 2943

Wrong image Y when customizing a tab bar in iOS 5.

iOS includes setFinishedSelectedImage:withFinishedUnselectedImage: for customize the tab bar. I created a few textures with a 49 height, and I saw a strange black border at the bottom. Then, after adding an alpha channel, I realized the problem was that the images were displaced about 4 points up. I send you a screenshot. Moreover, this one has the same problem (the black strange line), although is difficult to see it. http://kurrytran.blogspot.com.es/2011/10/ios-5-tutorial-creating-custom-tab-bar.html

enter image description here

This is the code: UIImage *selectedImage0 = [UIImage imageNamed:@"count_button_pressed"]; UIImage *unselectedImage0 = [UIImage imageNamed:@"count_button_released"];

UIImage *selectedImage1 = [UIImage imageNamed:@"date_button_pressed"];
UIImage *unselectedImage1 = [UIImage imageNamed:@"date_button_released"];

UIImage *selectedImage2 = [UIImage imageNamed:@"stats_button_pressed"];
UIImage *unselectedImage2 = [UIImage imageNamed:@"stats_button_released"];

UITabBar *tabBar = self.tabBar;
UITabBarItem *item0 = [tabBar.items objectAtIndex:0];
UITabBarItem *item1 = [tabBar.items objectAtIndex:1];
UITabBarItem *item2 = [tabBar.items objectAtIndex:2];

[item0 setFinishedSelectedImage:selectedImage0 withFinishedUnselectedImage:unselectedImage0];
[item1 setFinishedSelectedImage:selectedImage1 withFinishedUnselectedImage:unselectedImage1];
[item2 setFinishedSelectedImage:selectedImage2 withFinishedUnselectedImage:unselectedImage2];

Do you know what happens? Thanks in advance.

Upvotes: 4

Views: 1457

Answers (2)

morgan_il
morgan_il

Reputation: 1531

You can create transparent image and configure your UITabbar to use it as selection image. It's clear and elegant in my opinion :)

// Create Transparent image on the fly
CGRect rect = CGRectMake(0, 0, 1, 1);
UIGraphicsBeginImageContext(rect.size);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(context, [[UIColor clearColor] CGColor]);

CGContextFillRect(context, rect);
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
// Set tabbar selection image to be the transparent image we've created before
tabBar.selectionIndicatorImage = img;

Upvotes: 0

javieralog
javieralog

Reputation: 1337

tabbaritem finished images are not vertically centered on the tabbar, since they are a replacement for standard tab bar item icons.

Tab bar item images are displaced to the top, thus leaving space for the tab bar item title text.

tabbaritem finished images should contain the icon only. To change the selected item background in a tabbar use the selectionIndicatorImage property in UITabBar

Upvotes: 2

Related Questions