Dynamic image scaling issue

Solar2D Daily Builds and Public Releases
#1

Images may get scaled a little bit in cases where they shouldn’t, which affects their perceived quality.

The refresh icon on the left is a screenshot from Nexus One:
display.newImageRect(“refresh.png”, 48, 48)

The refresh icon on the right is a screenshot from iPhone:
display.newImageRect(“refresh@1.5.png”, 72, 72)

In both cases the very same 72x72 image is used: “refresh@1.5.png”.
For Nexus One it is loaded indirectly by the dynamic image scaling.
But they look different!

If you don’t see it, here is a scaled up version of the above image:

Here is a test project to reproduce the bug. Check it out in the emulator for both the iPhone and Droid/Nexus. [import]uid: 52103 topic_id: 11130 reply_id: 311130[/import]

#2

It looks like a universal problem, which is most obvious with small images:

Here, a 9x9 image is loaded with newImageRect specifying its dimensions. You would assume no scaling will take place, yet the result is horrible.

The dot should look like this:

I have updated the test project to reflect this.

Another observation: removing width and height values from config.lua fixes ugly rendering of refresh icon, but the dot image still stays ugly. [import]uid: 52103 topic_id: 11130 reply_id: 40418[/import]

#3

Can somebody from Ansca look into this? It is a glaring issue. Easily reproducible in the emulator and on device with the attached example(tested with Windows/Android). [import]uid: 52103 topic_id: 11130 reply_id: 41016[/import]

#4

Hey,

Images should not be an odd number of pixels - resizing your dot to 8x8 or 10x10 will eliminate the issue.

Peach :slight_smile: [import]uid: 52491 topic_id: 11130 reply_id: 41135[/import]

#5

Indeed. Thanks a lot! Is that also true for images in sprites?

But what about jagged edges of the 72x72 refresh icon? They can be quite apparent with some backgrounds, e.g. translucent ones:

EDIT: never mind, it has to do with the way Inkscape renders SVGs when you export them to PNG.

In case someone’s interested, the solution is to render a larger image in Inkscape and then downscale it to desired resolutions in Photoshop, ImageMagick or whatever. [import]uid: 52103 topic_id: 11130 reply_id: 41152[/import]