Image resolution problem in iPhone 4

I am having a problem in iphone 4. The images used in iPhone less than 4 are fine but when I upgraded to iphone 4 the images looks distorted.

Here is the link.

The image size I have used is 320 开发者_如何学Pythonx 480.

http://img822.imageshack.us/img822/8431/download22.png

Thanks.

The fact is that the resolution of iPhone4 is 960x640 instead that 480x320 so the image is scaled with linear (or bilinear, not sure) filtering.. the result is what you get: a blurry image.

Just redo the image with the proper resolution to solve the problem, you mainly notice these kinds of artifacts because you have rasterized text on an image..

You obtain this effect whenever you resize an image to fit a wider area of pixels: the missing pixels must be filled somehow and filtering comes into play. So you will have to consider also that part of the screen is used by the top bar to have an exact sized picture.

Create a @2x suffix to each of your png that you use. example: Icon.png Icon@2x.png

The runtime environment will choose the double-resolution on retina display devices.

It looks like your original image is 480x320, but you aren't accounting for the fact that the status bar is compressing your image slightly (or perhaps it does on the iPhone4 but on the older iPhones it is cropping instead).

I'd check the image view settings for that background image.