Image scaling and Universal apps.

Solar2D General Questions/Discussion
#1

Hi all!

Random question when it comes to Universal apps and the way they are stretched/scaled.

Instead of using forms of scaling like letterbox, etc. for scaling an app to different devices, couldn’t you just adjust the location and size of every image like the background, ground, and objects relative to the device width and height?

For example:

Lets say you have a device with a 400x400 display size, and a device with a 800x600, just for simplicity.

If you did say:

local W = display.contentWidth

local H = display.contentHeight

then did:

local background

background = display.newImage(“XXXXX”)

background.x = W/2

background.y = H/2

background.width = W

background.height = H

local ground

ground = display.newImage('XXXXX")

ground.x = W/2

ground.y = H/16

ground.width = W

ground.height = H/8

On both the 400x400 display and the 800x600 display, and any other sized display for that matter, the images would be placed in the correct locations.

If you did this for every image in your game, with absolutely no fixed numbers…  technically wouldn’t this make the game universal without stretching anything and no need for multiple image resolutions? Granted you would want to start with images sized for a large device like an iPad.

Any thoughts on this?

Am I making it more confusing than it needs to be?

#2

@Crumble619,

The right solution for you is the right solution for you.  However…

Unless your app is extremely simple in form and layout, your idea will quickly become intractable.  If you think about it for a bit, there must be a reason why so much effort goes into providing multiple scaling options and features.  

So, I suggest you stick with scaling and learn to use it in your games and apps.  Furthermore, once you understand it well enough, I suggest coming up with a scaling recipe for yourself.  Having something you’ve made and adjusted for your own needs will serve you well in the future.

Cheers,

Ed

#3

Ditto what gamer said, and would also add that all that division is going to bite you at some point as well, and where you are going to really see this as a problem is when you start adding any kind of physics to your game.

#4

Even with scaling you’re still going to use things like your math to center things.  In fact we provide constants for that:  display.contentCenterX, display.contentCenterY.

The problem with your method, is what if you want something say 50 points right of center. You  have to get the scale factor of the device and do something like:

obj.x = W / 2 + (50 * display.contentScaleX). 

But if you let Corona SDK do it’s job, then you do:

obj.x = W / 2 + 50

and it just works out.  I’m fond of saying “Don’t fight the system.  Let it work for you.”.  Your code will be far more complex if you have to choose  your own images based on the device size and position them at locations other than center and the edges.

Rob

#5

@Crumble619,

The right solution for you is the right solution for you.  However…

Unless your app is extremely simple in form and layout, your idea will quickly become intractable.  If you think about it for a bit, there must be a reason why so much effort goes into providing multiple scaling options and features.  

So, I suggest you stick with scaling and learn to use it in your games and apps.  Furthermore, once you understand it well enough, I suggest coming up with a scaling recipe for yourself.  Having something you’ve made and adjusted for your own needs will serve you well in the future.

Cheers,

Ed

#6

Ditto what gamer said, and would also add that all that division is going to bite you at some point as well, and where you are going to really see this as a problem is when you start adding any kind of physics to your game.

#7

Even with scaling you’re still going to use things like your math to center things.  In fact we provide constants for that:  display.contentCenterX, display.contentCenterY.

The problem with your method, is what if you want something say 50 points right of center. You  have to get the scale factor of the device and do something like:

obj.x = W / 2 + (50 * display.contentScaleX). 

But if you let Corona SDK do it’s job, then you do:

obj.x = W / 2 + 50

and it just works out.  I’m fond of saying “Don’t fight the system.  Let it work for you.”.  Your code will be far more complex if you have to choose  your own images based on the device size and position them at locations other than center and the edges.

Rob