views:

158

answers:

2

Situation
A Flex project exported as a Projector, showing fullscreen. The project has a background and several dots which each represent a "Location". These locations are fetched from an XML file and have their position set in percentages. The location in pixels is calculated (this works as it should) by the width and height of the Application. The dots are placed correctly.

The background is a JPG with a resolution of 1280*1024. At this moment, the background is set on a Canvas with backgroundSize = auto. This places the image in the center without stretching it. Stretching results in ugly, pixelated images and tears the proportions apart.

Problem
When we view the project on 2 different resolutions (1 = 1280*1024; 2 = 1024*768), the dots are in the good position, the background image is sharp. But - because of the background having the same resolution as 1, the background isn't fully shown in resolution 2 (because it isn't stretched. A logic result.

That's why I tried stretching the background. The results:
Dots placed in the correct way

On a smaller/other resolution:
alt text

Solution?
How should I solve this problem? I thought of always having the background centered on the bottom, leaving the proportions as they are. This is not an option because of missing details/parts of the image. Stretching results in ugly, pixelated images which are out of proportion.
I know stretching might be the only option to tackle the resolution problem without losing parts of the image, but how can I solve the problem where the dots aren't in the good position (like image 2 shows).

+1  A: 

Don't know if this is exactly what you mean but i'll give it a shot :P

  1. Get the original background size
  2. Get the size of the stretched background
  3. calc the width and height difference
  4. Reflect the difference on the points position
Daniel Boomgaardt
A: 

Big problem, simple solution (after working hours on this). We just forgot 1 simple thing in our calculations: reflect the size (width/height) of the dots in the position...

So if you face the same problem when calculating the location in pixels from percentages, don't forget to include (viewToBePositioned.width / 2) in your calculations :-)

MysticEarth