UITabBar images visible on simulator, disappear on the device - iphone

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?

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.

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.

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.

Related

UiTabbar Icon doesn't display correctly

I am trying to upgrade my app to display icons that look great on the retina screen of the iPhone 5. AS of right now I am not setting my icons using code, I'm simply selecting the image within xcode and it loads it on its own ( I don't know how to code in the icon so that's why I am doing it this way).
Anyways, when I set the icon I have to use a 24x24 icon or else it wont fit.
When I use my high-res icons 64x64 they do not fit correctly. My question is, how do I go about making it so my icons will be scaled to fit but still retain the high-res quality?
1) If your non-retina icon is 24x24, then your retina icon should be 48x48
2) You should set your icon to be the non-retina version in interface builder. The retina version will be swapped out automatically if its on a retina device, as long as you follow the standard naming scheme:
name.png (non-retina image)
name#2x.png (retina image)
Note also: if you do set an image in code, you can simply use [UIImage imageNamed:#"whatever"] and the retina image will be swapped out automatically for you too (you don't have to do if-else or anything like that).
just try to set this code in your .m file of your particular tabBar's parent view.. in viewDidLoad: method..
self.tabBarItem.image = [UIImage imageNamed:#"home#2x.png"];/// set your image name instead of home

Use different icons for iphone 3gs & iphone 4 / 4s

I have icons inside my application for uibutton & on uitable cell. Lets say I have image named "sampleImage.png". Can my app use the image named "sampleImage#2x.png iphone with retina display automatically provide it is in my app bundle ?
If yes how can write code for it because I have code like
cell.imageview.image = [UIImage named:#"sampleImage.png"];
Does it work even if I hardcoded the image name?
Any kind of help is appreciated.Thanks
Yes, UIImage will automatically use the #2x version of an image on a retina display.
Searching for an answer of your question I came across this: what is the code to detect whether ios app running in iPhone, iPhone Retina display, or iPad?
One of the answers mentions this:
There's often no need to determine directly whether you're on a retina display because UIImage handles that automatically when you use imageNamed and append "#2x" to your high resolution image file names (see Supporting High-Resolution Screens in the Drawing and Printing Guide for iOS).

Does #2x for retina work on all images, and how do i test for a retina display?

I have 3 short questions, very related:
How do i detect if the user is using a retina device?
I want to save an image inside my app in documents, if i detect that they're using a retina display phone and save the image ending in #2x.jpg will it work as it does with imported images, where it'll automatically go for that one instead on a retina device?
If i were to reference an image which didn't exist, but a #2x.jpg version existed, would it go to that by default?
Use [UIScreen mainScreen].scale, it's 2.f when it's a retina screen.
I'm not sure, but I think it'll automatically detect #2x-versions here too (as long as you use UIImage to load them).
If it's a retina screen, it'll look to the #2x-version first, if it doesn't exist, it'll fallback to the default-version. If that version doesn't exist, it'll return nil. A non retina screen however, will never look to the #2x-version.
You call it a x2.jpg-file, however, it isn't:
Your default file is something like background.png.
Then your retina file should be like background#2x.png.
You load the image using UIImage *image = [UIImage imageNamed:#"background.png"];.
In most situations you don't need to know if it's a retina screen, iOS will handle this.

Correct colour display of Default.png on iPhone

I'm using the Default.png method to create a splashscreen. I'm using the same file for my background and the Default.png (except default.png has the 20 pixel status bar at the top).
However, the iphone isn't displaying them in them the same. The Default.png is being displayed darker than the background, so it's painfully obvious when the app is loaded.
As a visual example of what I mean, please see below:
The image on left is the Default.png whereas the image on the right is when the app has loaded. The difference looks subtle here but when the whole image changes, it looks quite drastic.
Is this an issue with the colour-formatting of the pngs? Or is this an iOS feature whereby the Default.png appears slightly darker anyway?
It's probably not worth mentioning but I'm using Monotouch to develop my app, I doubt that would have anything to do with this.
I had a problem like this after editing a screenshot with OSX's Preview to cut out the status bar (as needed for iPad splashes). Preview sticked a color profile, and splash screen appears darker than the real thing in device.
If you open the image with GIMP, it shows a dialog offering to convert the color profile to SRGB. Take it (press "Convert") and save the image. This fixes the color difference.
Solved the problem. The designer sent me new versions of the backgrounds and the Default.png is now displaying the correct colour.
I have a feeling I had saved the previous version with a different colour profile to the background, hence why it was being displayed differently.

iPhone screenshot different colour when displayed

I've taken a screenshot of my iPhone app running and I'd like to use that image as a png to be drawn by the app instead of generated graphics.
When I take the screenshot, it looks fine. However, when that is saved as a PNG file, added to the Xcode project and then displayed back on the screen of the phone (or simulator) the colours are different.
Can anyone explain to me why it's changing? (I'm guessing there's a colour space conversion happening).
How can I stop this from changing?
You might be saving the png image with some incorrect settings which is either reducing the quality or number of colors used. Try the PNG-24 with transparency to see if that helps at all.