How do I load images dynamically?

Get help using Construct 2

Post » Thu Aug 14, 2014 9:04 pm

How do I add an image to my app after it has already been exported as a Node-Webkit? I cannot add these images as Project Files but I still need to load and show them.

I need to deliver an app to my client and they want to be able to add more images to the app in the future.

This leaves me stuck, forced to update their app for them anytime they want to add more pictures unless I can figure out a way to do this.

I have a CSV with all the image names and I can manage the data with an array. After that I need to be able to call the images from the stored names in the array.

I have no idea how many pictures will be added or what they will be called.

Where should l look to try and build a solution for this?


Below is my original post
****************************
I can load an image from a URL/URI but how do I display it?

I have followed this tutorial: https://www.scirra.com/tutorials/541/ho ... from-files

And made this tiny app:
https://drive.google.com/file/d/0B1xzGDQ6NDI-TElEcTZWRHVmMlk/edit?usp=sharing

But I can't figure out how to show the image after its been loaded.

The Manual says that:
Load an image from a given URL. The current animation frame will be replaced with the image. It is not shown until the image has finished downloading, and On image URL loaded triggers.

and:
On image URL loaded
Triggered when Load image from URL finishes downloading the image and is ready to display it.

My Sprite has only 1 animation frame... so when its complete and ready to display how do I tell the Sprite to show the image? Or what do I tell to show the image?

Does anything change then using Node-Webkit?
Last edited by goblynn93 on Fri Aug 15, 2014 5:34 am, edited 3 times in total.
B
10
S
4
G
2
Posts: 133
Reputation: 2,667

Post » Thu Aug 14, 2014 10:51 pm

Did you import the Test.png file into your project. Try hitting F12 to see the debug console.
ImageImageImage
B
71
S
21
G
221
Posts: 3,649
Reputation: 124,227

Post » Fri Aug 15, 2014 12:25 am

I am confused... I have to import the Test.png file into the project? At that point I'm not calling a URL I'm calling a Project File...

I can't call images from the web and display them without knowing exactly what they are ahead of time (all cross-domain issues being considered...) ?

URL images have to be pre-loaded into the Project File?

I guess don't understand the purpose of "load image from URL" then...

Or I am missing some concept...

I placed the Test.png in the root folder of my project Win32 export folder...

F12 does not get me a debug because I am using Node-Webkit export. Again I may be missing something but I can't seem to get F12 to do anything...
B
10
S
4
G
2
Posts: 133
Reputation: 2,667

Post » Fri Aug 15, 2014 1:28 am

You didn't provide a fully qualified URL though. The default is to go to the 'Files' location. This example works for me, via NodeWebkit.
You do not have the required permissions to view the files attached to this post.
ImageImageImage
B
71
S
21
G
221
Posts: 3,649
Reputation: 124,227

Post » Fri Aug 15, 2014 3:56 am

Ok this works for me as well...

But there are some major differences in the way the app works as well. Using the full link in my app doesn't work.

Do the images have to be loaded On Start Of Load Up? I may possibly have 1000s of images... trying to load that many images is insane. I need to call images as-needed on the fly...

Does this work with local images as well? I am not sure where the default 'Files' location is... there is no 'Files' folder in my Node-Webkit export folder, nor am I aware of any 'Files' folder in the C2 installation.

Thanks for the help so far!
B
10
S
4
G
2
Posts: 133
Reputation: 2,667

Post » Mon May 25, 2015 11:57 am

@goblynn93 I don't know if you ever found an solution or not but I just faced the same problems. For the next one who is searching for it... here is how I did it.
http://i.imgur.com/VzBowpY.png

You can get the folder path with the NW.js plugin expressions "NWjs.AppFolder", this will return the path to the install folder of the .exe once exported.
For test purposes you can set the "pathToApp" variable manually to your project folder.

After you exportet your project you have to manually create the folder "yourFolderName" in the win32 and win64 folder (the same folder where the exported .exe files are located) and put the images in it. I dont know if this works with osx and linux, because I have no way to test this (if some one does let me know if it works ). But osx has a "Resources" folder and i guess you can put the files in there no problem.
B
68
S
28
G
7
Posts: 85
Reputation: 7,496


Return to How do I....?

Who is online

Users browsing this forum: 99Instances2Go, Casimir, marcoscodas, pwrtoppl, sublimate and 8 guests