How to use a fucntion to resize an image (found in a tutorial) for display.loadRemoteImage?

GO4IT · May 9, 2019, 1:54pm

Hello, I have a question for resizing an image.The tutorial to fit images to a size is great to work on display.newImage(), but I cannot manage to do it for display.loadRemoteImage(). I think it because display.loadRemoteImage() does not return DisplayObject which is required for this resize function.

How can I resize a remote image like below?

In my case, I am using an image URL which is a result of API call (network.request). I store it as “image.png”. So far, I can display loadedimage, but I would like to resize it with the parameters I see in the tutorial (ie icon.x = 50 icon.y = 300, fitImage( icon, 200, 200, true)) Thank you very much for your help in advance!

&nbsp;&nbsp;&nbsp; local json = require( "json" ) &nbsp;&nbsp; &nbsp;local function networkListener( event ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local res = json.prettify( event.response ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local decoded = json.decode( res ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; if ( event.isError ) then &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print( "--Network error-- ", ( res ) ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; else &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;print( "Results: " .. ( res ) ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; --Here a JSON value (URL) is fetched from an API call and use it as a remote image &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local edmPreview = decoded.items[lot20].edmPreview[1] &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;-- Display image from web &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local function networkListener1image( event ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; if ( event.isError ) then &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print ( "Network error - download failed" ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; else &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; event.target.alpha = 0 &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; transition.to( event.target, { alpha = 1.0 } ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; print ( "event.response.fullPath: ", event.response.fullPath ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; print ( "event.response.filename: ", event.response.filename ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; print ( "event.response.baseDirectory: ", event.response.baseDirectory ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local loadedimage = display.loadRemoteImage(edmPreview, "GET", networkListener1image, "image1.png", system.TemporaryDirectory, 200, display.contentCenterY ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;network.request("https://www.europeana.eu/api/v2/search.json?wskey="..apikey.europeana.."&query=art&qf=when:1900&start="..lotmax.."&reusability=open&media=true", "GET", networkListener, params)

GrahamRanson1 · May 9, 2019, 3:28pm

Inside the networkListener function there is a table passed in called “event”, on this table is a variable called “target” - this is your display object.

GO4IT · May 10, 2019, 8:29am

Thank you so much @GrahamRanson! It is quite straightforward to find a solution. I did not know Lua enough.

So, the solution was:

&nbsp;&nbsp;&nbsp; --including a module local resize = require( "module\_imageresize" ) local json = require( "json" ) &nbsp;&nbsp; &nbsp;local function networkListener( event ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local res = json.prettify( event.response ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local decoded = json.decode( res ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; if ( event.isError ) then &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print( "--Network error-- ", ( res ) ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; else &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;print( "Results: " .. ( res ) ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; --Here a JSON value (URL) is fetched from an API call and use it as a remote image &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local edmPreview = decoded.items[lot20].edmPreview[1] &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;-- Display image from web &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local function networkListener1image( event ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; if ( event.isError ) then &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print ( "Network error - download failed" ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; else &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; event.target.alpha = 0 &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; transition.to( event.target, { alpha = 1.0 } ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; print ( "event.response.fullPath: ", event.response.fullPath ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; print ( "event.response.filename: ", event.response.filename ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; print ( "event.response.baseDirectory: ", event.response.baseDirectory ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; myImage = event.target &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;resize.fitImage(myImage, 200, 200, true ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;local loadedimage = display.loadRemoteImage(edmPreview, "GET", networkListener1image, "image1.png", system.TemporaryDirectory, 200, display.contentCenterY ) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;network.request("https://www.europeana.eu/api/v2/search.json?wskey="..apikey.europeana.."&query=art&qf=when:1900&start="..lotmax.."&reusability=open&media=true", "GET", networkListener, params)

I am calling a Module (module_imageresize.lua) which is basically the function explained in the tutorial.

local M = {} M.fitImage = function( displayObject, fitWidth, fitHeight, enlarge ) &nbsp;&nbsp; &nbsp;-- first determine which edge is out of bounds &nbsp;&nbsp; &nbsp;local scaleFactor = fitHeight / displayObject.height &nbsp;&nbsp; &nbsp;local newWidth = displayObject.width \* scaleFactor &nbsp;&nbsp; &nbsp;if newWidth \> fitWidth then &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;scaleFactor = fitWidth / displayObject.width &nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;if not enlarge and scaleFactor \> 1 then &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;return &nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;displayObject:scale( scaleFactor, scaleFactor ) end return M

GrahamRanson1 · May 10, 2019, 11:20am

Glad I could help!

GrahamRanson1 · May 9, 2019, 3:28pm