Managing Sizes - Images in Mobile (was Mobile Template)

[Paul Hibbert]

> If your image is 240px * 240px at 240dpi, and you change the resolution in photoshop to 72dpi, the image is still 240px * 240px and the quality isn't changed. It is just a reference for if the image is to be printed.

Assuming you are talking about the menu option [Image > Image Size…], that sounds like pretty dangerous advice, it really depends on the settings used in Photoshop, if you have the 'Resample' option checked it will reduce your image to 72px x 72px and lose a great deal of data.

> If you're using an image onscreen you can ignore the dpi, it will only ever display the number of pixels.

DPI (dots per inch) is the output device resolution, PPI (pixels per inch) is the image resolution, they will have an optimum relationship depending on the output device and the final quality required. Unfortunately DPI is often used in the wrong context and it can cause confusion.

DPI vs PPI terminology is explained here…

https://forums.adobe.com/thread/370714

> which begs the question: when saving for retina 2048 X1536: what PPI should we choose on save?

PPI is not really relevant to LC, but the pixel dimensions of your image are. If you have an image that is 240px X 240px at 72ppi and place it on a card in LC, assuming you don't resize it, it will be 240 pixels by 240 pixels, the same image at 240ppi will still be 240 pixels by 240 pixels on the card.

Try it and you may understand better, make 2 images in Photoshop, both 240px square and set one to 72ppi and the other one to 240ppi then place them side by side in LiveCode, they will both import at the same size when placed on the card.

So if your image was to take up 70% of the screen area then an image of 1434px x 1075px would be correct. LC places images at 1:1 pixel size so just choose a resolution that you are comfortable with and stick to it, it won't make any difference to LC and is not important unless you intend scaling images or producing stacks that print high resolution images, then you just need to do the maths.

If you are making re-sizeable stacks for different devices, then you may need to either work to the highest resolution device and allow the images to scale down, or use the system described here…

http://lessons.runrev.com/m/15262/l/156530-how-do-i-support-different-device-screen-densities
(Especially note the paragraph titled Example towards the end of the article).

The benefit of this approach is that you can ignore "Retina" and design for standard screen sizes and the high-res stuff takes care of itself.

HTH

Paul