CodenameOne Cannot Add Image to Button Using GUI Builder

Question

I am using the CodenameOne GUI builder to add an image to a button. I added the image to the res file and then clicked [Pick Image] in the Property Inspector (see my screenshots). The button image (a plus sign) appears in the GUI. I hit 'save' in the GUI Builder and then close it, then go back to NetBeans and run a debug simulation, and the icon appears, so far so good. .

But now I run the debug simulation again and the button image is gone: I open the GUI Builder and it's gone there as well, the button has reverted to [Pick Image] and, when I click [Pick Image]. my image is missing from the res file.

What is going on here? I repeated this three times with the same result- I literally ran the Debug sim twice without doing anything in between and the icon disappears, and there is no indication in the Output messages to indicate that there is a problem.

The Form1.gui file shows a reference to the icon image so maybe the resource file is being cleared in between makes?

<component type="Button" icon="resFile:plus.png" name="Up" actionEvent="true">
</component>

[EDIT] I found that if I add the images using the CNO Designer on the theme.res file, the images 'stick' and I can get a good build. HOWEVER, when I make code changes and then open the GUI Builder again the images are removed from the res file.

Answer 1

can you add a code snippet of how you add the image...

According to the error message, you may have chosen the incorrect path, or maybe you have added the path incorrectly in the code.

Answer 2

Unfortunately, the old CN1 Designer is not compatible with the CSS compiler. If your project uses CSS, you should add images to the resource file directly in CSS (eg by adding it as a background-image on some element), or import it via the GUI builder, as, adding it that way will also add a reference to the image inside the.css file.

This stems from the CSS compiler pruning "unused" images in the resource file. If the image isn't referenced in the CSS file anywhere, it will be removed from the output.res file.