Question

In XCode I am using the interface builder (StoryBoard) to lay out most of my layout. However I want some custom drawing on this. This works quite well.

There is however a problem what I am facing. I have a “bite” out of the active tab. (see http://cl.ly/Efno ) I want this bite fully transparent. (I have set an pink background color to see what part I want transparent which is not transparent.)

How I have changed the look and feel is the following.

• Set the UITabBar class to my own class in the interface builder for the corresponding tabbar.

• In the awakeFromNib of that class I have set the label position and image and selected image of each tabbar item. Like so

  [tabBarItem setFinishedSelectedImage:selectedImage withFinishedUnselectedImage:image];
  

Each image fully covers the entire tabbar in height and has the width of the tab item itself.

• Set the background image of the tabbar to none (a fully transparent image)
• Set the background color of the tabbar to a fully transparent color (now I have a pink color set to see where it goes wrong)
• In the interface builder uncheck “opaque” for the tabbar.

However, it is not transparent, the pink part is black. How can I make this transparent?

Thanks

Answer 1

Have a look at the appearance proxy for UITabBar, you might be able to do what you want there without having to use a custom subclass. There are tons of properties you can access and change. You could set the relevant properties in the app delegate. It is iOS5 only though, but I gather that you are using that already, since you mentioned storyboards.

E.g.

UIImage *tabBarBackground = [UIImage imageNamed:@"tabBarBackground.png"];
[[UITabBar appearance] setBackgroundImage:tabBarBackground];
[[UITabBar appearance] setSelectedImageTintColor:[UIColor colorWithRed:127.0/255.0 green:186.0/255.0 blue:235.0/255.0 alpha:1.0]];
[[UITabBar appearance] setSelectionIndicatorImage:[UIImage imageNamed:@"tabBarItemSelected.png"]];