UITabBar images visible on simulator, disappear on the device

Question

in an iPhone app, I have a UITabBar with three tabs. One has a system image, two more have custom images. These are PNGs, 30x30, palette-based, mostly transparent. These images show up fine in the simulator, but on the device, all I see is a grey gradiented square on a tab. The shapes on these images are grey to begin with, but they do show up as expected on the simulator.

Any ideas, please?

Answer 1

The image should be white on transparent. It's in the UI design guide. In my case, it was grey on transparent. Simulator forgives that, the device does not.

Answer 2

The device itself is pickier about image formats than the simulator is. I've had a number of instances where things showed up in the simulator and didn't on the phone. What has always worked for me is to encode all of my PNGs as 24-bit PNG-24 (in Photoshop) -- for icons and the like, the increased file size is trivial, and it solves my issues with images not showing up.

Answer 3

After about 3 hours I noticed the not so obvious... the name of the file is processed with case sensitive rules on the device, but not within the XCode simulator (As of XCode 4.6).

For example:

If the actual file name (resource) is "first.png" then the following needs to be the case in your code ---

//DO THIS self.tabBarItem.image = [UIImage imageNamed:@"first.png"];

//NOT THIS self.tabBarItem.image = [UIImage imageNamed:@"First.png"];

Look into this first before changing your code.