object:scale problem

I’m having an issue resizing an image using the object:scale() method. I use the following code:

[lua]

local photo = display.newImageRect(picName, system.DocumentsDirectory, display.contentWidth/2, display.contentHeight/2)
local theScale = display.contentHeight/photo.height
photo:scale(theScale, theScale)

[/lua]

However, when I do this, the image is squished (it is wider than it should be). Is this a bug?

Fixed it. Rather than using newImageRect, I used newImage, which solved the problem.

The last two parameters for display.newImageRect are the width and height of the image.  You are saying make it’s with half the screen with and it’s height half the screen height.  If the image is not in that aspect ratio to begin with, it will be stretched into the set size.  Thinks about it like this on an iPhone 4 that is 640 x 960, the screen is 1.5X taller than the width (1.5 to 1 aspect ratio or 3:2). If you load a square image (1:1), it’s going to stretch it vertically to 1.5 to 1) since you’re saying use have of the height an width.   display.newImage() takes no width and height, so it loads in at it’s natural aspect ratio thus no distorting.  Had you passed in the real width and height to display.newImageRect() it would have worked too.

Rob

To expand on Rob’s answer, sometimes you don’t know the width/height of an image beforehand (e.g. a downloaded image). however it’s likely that you will know how big you want the image to appear (based on the rest of your UI). 

For those circumstances, I tend to use newImage and then scale the image until it fits a size that I have defined:

local myImage = display.newImage("mydownloadedimage.png") --let's assume that my UI has space for a rectangular image which is 512\*256 local targetWidth, targetHeight = 512, 256 --this is the variable we will use to scale the whole image --we want to scale the width and height by the same value, to keep the aspect ratio correct local scaleValue = 1 --set the scale: we want to use the image's largest dimension to fit it to size --e.g. if the image is tall rather than wide we want to scale it until it fits within the height we have allowed if myImage.width \> myImage.height then --if image is wide then use the width to determine scale scaleValue = targetWidth / myImage.width else --if it is tall (or square) then use the height scaleValue = targetHeight / myImage.height end --apply the scale to the image myImage.xScale, myImage.yScale = scaleValue, scaleValue

I just did this quickly, so apologies if there are any typos.

Fixed it. Rather than using newImageRect, I used newImage, which solved the problem.

The last two parameters for display.newImageRect are the width and height of the image.  You are saying make it’s with half the screen with and it’s height half the screen height.  If the image is not in that aspect ratio to begin with, it will be stretched into the set size.  Thinks about it like this on an iPhone 4 that is 640 x 960, the screen is 1.5X taller than the width (1.5 to 1 aspect ratio or 3:2). If you load a square image (1:1), it’s going to stretch it vertically to 1.5 to 1) since you’re saying use have of the height an width.   display.newImage() takes no width and height, so it loads in at it’s natural aspect ratio thus no distorting.  Had you passed in the real width and height to display.newImageRect() it would have worked too.

Rob

To expand on Rob’s answer, sometimes you don’t know the width/height of an image beforehand (e.g. a downloaded image). however it’s likely that you will know how big you want the image to appear (based on the rest of your UI). 

For those circumstances, I tend to use newImage and then scale the image until it fits a size that I have defined:

local myImage = display.newImage("mydownloadedimage.png") --let's assume that my UI has space for a rectangular image which is 512\*256 local targetWidth, targetHeight = 512, 256 --this is the variable we will use to scale the whole image --we want to scale the width and height by the same value, to keep the aspect ratio correct local scaleValue = 1 --set the scale: we want to use the image's largest dimension to fit it to size --e.g. if the image is tall rather than wide we want to scale it until it fits within the height we have allowed if myImage.width \> myImage.height then --if image is wide then use the width to determine scale scaleValue = targetWidth / myImage.width else --if it is tall (or square) then use the height scaleValue = targetHeight / myImage.height end --apply the scale to the image myImage.xScale, myImage.yScale = scaleValue, scaleValue

I just did this quickly, so apologies if there are any typos.