I swear I saw a sample app here that either used the camera or something and then showed the image as a thumbnail on the screen but I cannot find it. I’m trying to figure out how to display an image on the screen but smaller as a thumbnail to the size I want it. Does anyone know how to do this? I’ll still search more and post it if I find it.
Thanks!
Warren
[import]uid: 184193 topic_id: 33390 reply_id: 333390[/import]
You would want to display the image as normal and then set the objects .xScale and .yScale property to a smaller number such as 0.3 for instance. We do something similar for the photo album in our Forever Lost game. [import]uid: 119420 topic_id: 33390 reply_id: 132611[/import]
Thanks, I didn’t know about that property. One question though is if I wanted to have the image just fit within the screen is there a way to know what to set the scaling to? Because depending on the camera setting the image saved from it can be a different size per device. I want to show the image to a certain size on the screen such as width of 250.
[import]uid: 184193 topic_id: 33390 reply_id: 132614[/import]
You’re in luck as we needed to do exactly that for Forever Lost and Forever Lost Camera. The lib we created for that is soon going to be released as a GG Lib but until then here is the function you will want:
[lua]function scaleToFit( image, width, height )
local baseSize = { width = width or display.contentWidth * display.contentScaleX, height = height or display.contentHeight * display.contentScaleY }
image.xScale = baseSize.width / image.contentWidth
image.yScale = baseSize.height / image.contentHeight
image.x = display.contentCenterX
image.y = display.contentCenterY
end[/lua]
You will probably need to adjust things depending on your use case but the actual core part of the function will work for you.
You can then do things like this to create a small thubmnail:
[lua]scaleToFit( largeImage, 50, 30 )[/lua]
Or full screen:
[lua]scaleToFit( largeImage )[/lua]
Or largeish:
[lua]scaleToFit( largeImage, 250, 200 )[/lua] [import]uid: 119420 topic_id: 33390 reply_id: 132615[/import]
I take a little bit different (but yet the same) approach.
Images usually have an aspect ratio that you have to maintain if you intend for the scaled version to look like the large version and particularly for photos, they can be all over the place in shape and size.
myImage = display.newImage("someimage.png")
local w = myImage.width
local h = myImage.height
local s = 128 / h
myImage:scale(s,s) Since I want to fit this image into a 128px high box (of unknown width) this will compute the scale factor “s” and then use that to scale the image. Note I’m not using display.newImageRect() since you have to provide it the width and height and for photos and such you may not know that information before you load the image.
If you wanted to scale it to fit within a certain width regardless of the height, just do 128 / w.
[import]uid: 199310 topic_id: 33390 reply_id: 132672[/import]
Nice method! I will modify my function so that when it is released as a GG lib it can do aspect-ratio aware scaling, thanks! [import]uid: 119420 topic_id: 33390 reply_id: 132680[/import]
Glad to help. [import]uid: 199310 topic_id: 33390 reply_id: 132693[/import]
Also forgot to say, congrats on the Staff badge, much deserved 
[import]uid: 119420 topic_id: 33390 reply_id: 132694[/import]
I appreciate it. Thank you! [import]uid: 199310 topic_id: 33390 reply_id: 132698[/import]
You would want to display the image as normal and then set the objects .xScale and .yScale property to a smaller number such as 0.3 for instance. We do something similar for the photo album in our Forever Lost game. [import]uid: 119420 topic_id: 33390 reply_id: 132611[/import]
Thanks, I didn’t know about that property. One question though is if I wanted to have the image just fit within the screen is there a way to know what to set the scaling to? Because depending on the camera setting the image saved from it can be a different size per device. I want to show the image to a certain size on the screen such as width of 250.
[import]uid: 184193 topic_id: 33390 reply_id: 132614[/import]
You’re in luck as we needed to do exactly that for Forever Lost and Forever Lost Camera. The lib we created for that is soon going to be released as a GG Lib but until then here is the function you will want:
[lua]function scaleToFit( image, width, height )
local baseSize = { width = width or display.contentWidth * display.contentScaleX, height = height or display.contentHeight * display.contentScaleY }
image.xScale = baseSize.width / image.contentWidth
image.yScale = baseSize.height / image.contentHeight
image.x = display.contentCenterX
image.y = display.contentCenterY
end[/lua]
You will probably need to adjust things depending on your use case but the actual core part of the function will work for you.
You can then do things like this to create a small thubmnail:
[lua]scaleToFit( largeImage, 50, 30 )[/lua]
Or full screen:
[lua]scaleToFit( largeImage )[/lua]
Or largeish:
[lua]scaleToFit( largeImage, 250, 200 )[/lua] [import]uid: 119420 topic_id: 33390 reply_id: 132615[/import]
I take a little bit different (but yet the same) approach.
Images usually have an aspect ratio that you have to maintain if you intend for the scaled version to look like the large version and particularly for photos, they can be all over the place in shape and size.
myImage = display.newImage("someimage.png")
local w = myImage.width
local h = myImage.height
local s = 128 / h
myImage:scale(s,s) Since I want to fit this image into a 128px high box (of unknown width) this will compute the scale factor “s” and then use that to scale the image. Note I’m not using display.newImageRect() since you have to provide it the width and height and for photos and such you may not know that information before you load the image.
If you wanted to scale it to fit within a certain width regardless of the height, just do 128 / w.
[import]uid: 199310 topic_id: 33390 reply_id: 132672[/import]
Nice method! I will modify my function so that when it is released as a GG lib it can do aspect-ratio aware scaling, thanks! [import]uid: 119420 topic_id: 33390 reply_id: 132680[/import]
Glad to help. [import]uid: 199310 topic_id: 33390 reply_id: 132693[/import]
Also forgot to say, congrats on the Staff badge, much deserved [import]uid: 119420 topic_id: 33390 reply_id: 132694[/import]
I appreciate it. Thank you! [import]uid: 199310 topic_id: 33390 reply_id: 132698[/import]