Missing Image with resourceID

[zHaytam]

Environment
Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project):

• tns info: Component nativescript has 5.0.1 version.

Describe the bug
Images added in the folder App_Resources/Android/* and accessed by e.g. <Image src="res://Cards"></Image> give me the warning LOG from device X: Missing Image with resourceID: res://Cards.
I used the Nativescript Image Builder to generate the android images and put them in their respectful folders.

Expected behavior
I expect the images to show on my device.

Additional context
I am using Nativescript Playground with my android device as I can't seem to set a local emulator.
I am testing the app using tns run android --bundle.

[zHaytam]

Additional tests
I tried changing the image's source to one of the default images (icon, logo, background) and to my surprise in my device i get images different than what's in the folder App_Resources/Android.

[sis0k0]

Hi @zHaytam, could you answer the following questions to help me understand better your workflow?

• Do you download the application from the NativeScript Playground and then run it?
• Is it a code-sharing app (web+nativescript)?
• Do you use a physical device to run it? What is the OS version?

[NickIliev]

@zHaytam you are not allowed to use capital letters in any of the Android resources including the drawables names (see this blog post for details on the naming conventions). Change all drawable resources names to lowercase and make clean build.

[zHaytam]

• I scan the QR code in the playground app and it runs.
• Yes
• Android 7

I did try to name my resources without capitals but it still didn't work.

[kzimny]

I have exactly the same issue. I have the angular web (non code-shared) project installed on my local machine. The image is added as follow <Image src="res://logoxyz" stretch="none" horizontalAlignment="center"></Image>. Then compile with tns preview, scan the QR code and run the app. The message is exactly the same: Missing Image with resourceID: res://logoxyz. Please help!

[rahadur]

I have the same problem Missing Image with resourceID: res://close

<Image src="res://close" stretch="none" ></Image>

[kzimny]

Seems to not work with tns preview...

[rahadur]

Yes @kzimny you are right tns preview command not work for App_Resources we have to use tns run command to fixed this issue.

[iMarwan-k]

is it allowed to use subfolders something like res://logos/{imageName} for android, for iOS this is working but for android getting same error "Missing Image with resourceID: res://logos/{imageName}"

[quixote15]

I was getting the same error.

According to the oficial docs about Image Resources "Once the NativeScript project is prepared (tns prepare ios) all the images will be copied to the platforms\ios<project-name>\Resources".

It appears that webpack was running with an old version of my project that did not have my new images.

So What I did was stop all running instances on terminal (Android/IOS) and then running:

tns prepare android
tns prepare ios

After that, tns run android --bundle works perfectly.