Hallo. I am trying to fit an image in a mobile application. I want to use it as background image. My code is:
<s:Image width="100%" height="100%" id="myImage">
<s:MultiDPIBitmapSource source160dpi="@Embed('/assets/sfondo_160dpi.jpg')" source240dpi="@Embed('/assets/sfondo_240dpi.jpg')" source320dpi="@Embed('/assets/sfondo_320dpi.jpg')"/>
The image is fitting the screen but its quality is not good as the original one. I am testing it inside all simulators inside flex and not on device.
Is there a way to adapt a background image for multiple screens and multiple resolution without loosing quality??.. What is the right way to proceed??
Thx a lot
Just some general thoughts:
If your image is going to be scaled to 100% width and height and run on multiple devices, you're eventually going to have some scaling of the image and consequently some loss of quality. What's the original resolution of the images you are using? As a general rule, scaling down will provide better results than scaling up, e.g. if I have to target a screen that's 775x600, I'd rather start with something that's 1024x768 and scale down than use a 640x480 image and scale up.
If the image can be encoded as a set of FXG vector graphics commands then scaling effects will be much less problematic.