Density scaling is enabled by default for all apps build with LiveCode 6.5 and above. Simple create a stack at the screen resolution of the natural density of your target device and it will run on the low and high density versions of the device automatically.

For example:

To create an iPad app, create a stack that is 1024x768. It will automatically be scaled to 2048x1536 when running on an iPad with a retina screen.

To create an iPhone app, create a stack that is 480x320. It will automatically be scaled to 960x640 when running on an iPhone with a retina screen.

To create an Android app, create a stack at the natural density of the target device. It will automatically be scaled up to to the density of the screen of the device.

LiveCode by default will seek high/low resolution version of images within your application. To take advantage of this feature you must:

1. Used referenced images: LiveCode will only automatically seek high/low resolution versions of images for referenced images. By that we mean images whose filename property is pointing to a local image.
2. Include multiple image files in the some location as the referenced image: LiveCode will search for low/high resolution images next to the referenced images.
3. Name your images correctly: LiveCode will seek images based on their filename. The name convention is detailed below.

Image naming convention

• <image>@ultra-low.<ext> - 0.25x
• <image>@extra-low.<ext> - 0.5x
• <image>@low.<ext> - 0.75x
• <image>@medium.<ext> / <image>.<ext> - 1x
• <image>@high.<ext> - 1.5x
• <image>@extra-high.<ext> / <image>@2x - 2x
• <image>@ultra-high.<ext> - 4x

Example

Take for example a simple iPad application with a large background image. The structure of the app might look something like this:

app.livecode

images/background.png - This image is 1024x768 pixels

images/[email protected] - This image is 2048x1536 pixels

The application would contain an image object with the filename set to "images/background.png". When run on a retina iPad, which has a screen density of 2, LiveCode would automatically substitute in the "@extra-high" version of the image, which is twice the density of the standard image.

In the rare case that you wish to use all the pixels of the target device to layout your app, you can do by setting the 'useDeviceResolution' of the stack to true. This will override all the automatic scaling performed by LiveCode.

For example. With the default settings enable. LiveCode will report the screen size at it's natural device density, regardless of the actual device density. For example:

• An iPad will report the screen height to be 1024
• An iPad with retina screen will report the screen height to be 1024

However, if the 'useDeviceResolution' has been set to true for the same stack, the true pixel height of the stack will be reported:

• An iPad will report the screen height to be 1024
• An iPad with retina screen will report the screen height to be 2048