Phonegap Images

I am currently creating an Android application with Phonegap and I am unable to insert images to my project. I have saved my .png file in different directories and still only a que

Solution 1:

To use a local image try the following.

Put your image in the /assets/www folder of the project

Then set the image tag as follows:

<imgsrc="../www/myimage.png">

Yes, I realize this should be the identical to setting the src to "myimage.png". I cannot say the reason why this might work, but I had the exact same problem with local images on Phonegap and this fixed the issue for me. If you have them in a subdirectory, you can try adding this on to the path:

<imgsrc="../www/mydir/myimage.png">

I also found the following syntax worked, maybe a little less clumsy looking:

<imgsrc="./myimage.png">

Or

<imgsrc="./mydir/myimage.png">

This was all on Android 4.0 unfortunately, I do not know for earlier versions of the OS

Solution 2:

For me i got the solution by adding dot before the "images" folder like this

<imgsrc="./images/bg4.jpg" />

Solution 3:

There's a mistake I've done quite a lot. If you add .js files to your index.html and use images in them, you need to calculate your images path from the index.html page and not from the .js file because the .js file will be interpreted in index.htm

For example, put all your images in a img/ folder next to index.html and then when you're using one of these images just do

<imgsrc="img/YOU_IMG.png" />

Solution 4:

There's nothing special about images in PhoneGap applications - they're web applications. If you point a desktop browser to your project folder and open the index.html, what happens with your images? If they don't show up there, they're not going to show up in the PhoneGap application.