Creating gradient background for iPhone Tab Bar

If you want to have a gradient on the background of your UITabBar in iPhone 3.0, it’s fairly easy.

Step 1: Create an image with width of 1px and height of 49px with a gradient of your choice. Save the image as png with the name of your choice (tabbar_back_.png).

Step 2: Add the image to your project.

Step 3: Extend UITabBarController. Assuming you already have Tab Bar Controller in your xib file, go to Xcode and create a new UIViewController subclass with the name of your choice (MyUITabController).
Change the header file to:
@interface MyUITabController : UITabBarController{}@end
Change the implementation file to:

- (void)viewDidLoad {
[super viewDidLoad];
CGRect frame = CGRectMake(0, 0, 480, 49);
UIView *viewWithColor = [[UIView alloc] initWithFrame:frame];
UIImage *backgroundImage = [UIImage imageNamed:@"tabbar_back_.png"];
UIColor *backgroundColor = [[UIColor alloc] initWithPatternImage:backgroundImage];
viewWithColor.backgroundColor =backgroundColor;
[backgroundColor release];
[[self tabBar] insertSubview:viewWithColor atIndex:0];
[viewWithColor release];

}

Save the project.

Step 4. Go to Interface Builder and select UITabBarController. Press Command+4 this should bring up Controller Identity Window. Select your new file name (MyUITabController) from Class Identity Class drop down. Save. Build and go!!!!!

Tags:

Leave a Reply