XCode Tabbed Application won't load icons

Question

I'm creating a Tabbed Application, and I'm having some trouble getting my icons to show up on the tabs. I've compared my code to a previous example I had worked on out of the book, and it seems to match, but the icons in the new application just show up as blank squares. I've tried to include all the relevant code without all the fiddly bits, but if you'd like to see more, just ask, and I'll edit more in as the need dictates. I've already checked that the case is identical on the imageNamed:string and the icon name.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    ... // initializers for ViewControllers 1-3, which are custom viewControllers
        // that have the tab properties set in (void)viewDidLoad
    globalUINavigationController = [[UINavigationController alloc] initWithNibName:
                                @"DemoTabbedFourthViewController" bundle:nil];
    globalUINavigationController.title = NSLocalizedString(@"Fourth", @"Fourth");
    globalUINavigationController.tabBarItem.image = [UIImage imageNamed:@"fourth.png"];

    UIViewController *viewController4 = [[DemoTabbedFourthViewController alloc] 
                    initWithNibName:@"DemoTabbedFourthViewController" bundle:nil];

    [globalUINavigationController pushViewController:viewController4 animated:YES];
    self.tabBarController = [[UITabBarController alloc] init];
    self.tabBarController.viewControllers = [NSArray arrayWithObjects:viewController1, viewController2,
                                         viewController3, globalUINavigationController, nil];
    self.window.rootViewController = self.tabBarController;
    [self.window makeKeyAndVisible];
}

I'm using the globalUINavigationController as my example, because if I can get that one working, I should be able to get the others working based on it. If you have any questions or comments about the code, let me know. I'm new to Objective C and iPhone App development, and I'll take all the help I can get.

score 0 · Answer 1 · answered Jul 26 '12 at 16:13

0

That's because either the image is too big, or your icons are squares. What I mean is, XCode will only grab your image as a mask (meaning colors won't matter). It has to be a PNG image and about 30x30 in size. From class reference;

image The item’s image. If nil, an image is not displayed. The images displayed on the tab bar are derived from this image. If this image is too large to fit on the tab bar, it is clipped to fit. The size of a tab bar image is typically 30 x 30 points. The alpha values in the source image are used to create the unselected and selected images—opaque values are ignored.

answered Jul 26 '12 at 16:13

ohr

1,717
14
15

They are PNG images, and the images are 30x30 (60x60 for the Retina Display images, but those are appropriately named, ie "fourth@2x.png"). I don't really understand what you mean by "square icons", could you explain it a bit further? – Chance Jul 26 '12 at 16:17
Do the icons have transparency? [Here](http://devinsheaven.com/creating-uitabbar-uitoolbar-icons-in-adobe-illustrator/) is an example in Illustrator. – ohr Jul 26 '12 at 16:21

score 0 · Accepted Answer · edited May 23 '17 at 12:03

I think the problem is that you initialize the UINavigationController with a nib file. I actually never tried this. You should first initialize the ViewController and than add this to the NavigationController in its init message. Also you have to set the title on the content view controller, not on the navigation controller, as the navigation controller asks its topViewController for the title it should display.

I haven't compiled the code below so there might be some missing commas or something like that, but it should give you an idea of what I meant.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    ... // initializers for ViewControllers 1-3, which are custom viewControllers
        // that have the tab properties set in (void)viewDidLoad
    UIViewController *viewController4 = [[DemoTabbedFourthViewController alloc] 
                initWithNibName:@"DemoTabbedFourthViewController" bundle:nil];

    globalUINavigationController = [[UINavigationController alloc] initWithRootViewController:viewController4];
    globalUINavigationController.tabBarItem.image = [UIImage imageNamed:@"fourth.png"];

    [globalUINavigationController pushViewController:viewController4 animated:YES];
    self.tabBarController = [[UITabBarController alloc] init];
    self.tabBarController.viewControllers = [NSArray arrayWithObjects:viewController1, viewController2,
                                     viewController3, globalUINavigationController, nil];
    self.window.rootViewController = self.tabBarController;
    [self.window makeKeyAndVisible];
}

If this doesn't fix the problem, it might be because your icon files are regular images. Just the alpha channel of the image is used for tab bar items.

//EDIT: In this case, have a look at this question: UITabBarItem images just appear as a grey block

You are correct, I need to make them a different image type. The article had two sample images that worked for me. Thanks for your help! — Chance, Jul 26 '12 at 16:33

XCode Tabbed Application won't load icons

2 Answers2