Page 1 of 1

Scaling images to any resolution : Guidelines and Best Practices

Posted: Thu Feb 27, 2014 9:58 am
by themac

Hi, i'm currently developing a quite simple cross platform app.
The target resolution will be from 800x480 to 2048x1536 (both portrait AND landscape).

So, is better to insert only one image on maximum resolution and let the app/system rescale it ?

And what about aspect ratio ? i think one solution could be to insert a square image to be sure no stretch will be applied and so that it will be centeerd.

but how to be sure that the image (and i have a map in another page too) will be centered ? How to center ?
I thought also about a solution : inserting a dynamic grid..a 3x3 one and using only the center cell, But doesn't seem to work.

Thanks in advance.

I shared my app with a href="mailto:support@appery.io" rel="nofollow"support@appery.io/a , to be sure :) (baciuzziproducts)

TheMac


Scaling images to any resolution : Guidelines and Best Practices

Posted: Thu Feb 27, 2014 11:41 am
by Maryna Brodina

Hello!
[quote:]inserting a dynamic grid..a 3x3 one and using only the center cell[/quote]Could you clarify how did you do that? And what is expected result? Do you want to place image in the center of the screen (vertically and horizontally aligned)?


Scaling images to any resolution : Guidelines and Best Practices

Posted: Thu Feb 27, 2014 11:46 am
by themac

yes, exactly, !

Thus maximizing the space for image (and, obviously , minimizing "blank" space).

Otherwise i should have many images for the different aspect ratio.

Thanks !

TheMac


Scaling images to any resolution : Guidelines and Best Practices

Posted: Thu Feb 27, 2014 4:43 pm
by Illya Stepanov

Hi -

You can try to add style for tags on the page, let's say: 'mobilecontainer'

prebackground: url(image.jpg) no-repeat 50% 50%;/pre
note: you will need to set the full path name to the image file.


Scaling images to any resolution : Guidelines and Best Practices

Posted: Sat Mar 01, 2014 11:33 am
by themac

why 50% ? and , i'll have to use Javascript ? like : $("mobilecontainer").css.background(url,"image.jpg","50%",50%") ??

Thanks


Scaling images to any resolution : Guidelines and Best Practices

Posted: Sat Mar 01, 2014 11:27 pm
by Alena Prykhodko

Please find more here http://docs.appery.io/documentation/b...
As styling is common JS rule, you can search online how to use more attributes.