I created @2x.png images for retina display. For example,
logo_small_ps.png - 161px 34 px (326 dpi)
email@example.com - 322px 69px (326 dpi)
I also tried to use firstname.lastname@example.org directly as image source, but image showed up very large on screen.
I realize that i created regular image also with higher dpi value, don't think that will cause any issues.
Am i missing something?
Hi, Chandresh, there is no automatic switching of icons between regular iPhone vs. iPhone Retina, except in places where we explicitly support two sets of icons - for example in springboard or application icons. I assume you don't want to go with the smaller icon because the icon would look pixelated?
You can either try to compose an EL for the source that would go to a particular image based on the screen width or height, or simply create two image components and then show/hide based on the screen size. You may run into a bug with parsing EL expression when you try to go with the first approach, though. Second approach maybe the easiest though not elegant.
We already spoke about this in a meeting but just to close on this for the sake of the forum....
When using images, it is recommended to only use/package the highest resolution images and scale them down accordingly. Example: Your image should be 50x50 in pixels so you should be using a 100x100 image and setting the width/height of the image (using inlineStyle or styleClass) to 50x50. This way the image sizes perfectly and will look very crisp in both retina and standard.