Image in combobox from ClassResource, not showing

Hi, I have following issue:

I’m using a maven project. In a Layout I have a ComboBox and an Image

protected ComboBox<Fund> fund; protected Image fundImage; Where the entity Fund has a field “image” and this property contain the path to an image in the /resources/images/funds/.
So for example I can have:
fund1.setImage(“/resources/images/funds/image1.jpg”);
fund2.setImage(“/resources/images/funds/image2.jpg”);

in the init method i have:

fund = new ComboBox<>("Fund"); fundImage = new Image(); fund.setItemCaptionGenerator(fund -> fund.getCode()); fund.setItemIconGenerator(fund -> new ClassResource(fund.getImage())); fund.addValueChangeListener(event -> fundImage.setSource(new ClassResource(event.getValue().getImage()))); When the view is initialized, I get following WARNING in the logs (i paste only few, but i have many of these)

c.v.server.ConnectorResourceHandler : ComboBox (20) did not handle connector request for null/image1.png c.v.server.ConnectorResourceHandler : ComboBox (20) did not handle connector request for null/image2.png c.v.server.ConnectorResourceHandler : ComboBox (20) did not handle connector request for null/image3.png c.v.server.ConnectorResourceHandler : ComboBox (20) did not handle connector request for null/image4.png But the when i select an item in the comboBox, the fundImage component shows the image as expected, while the comboBox not.
So why the ComboBox component cannot show the image, while the Image component can, using the same path to resource?

Hi,
it is a known bug; see here for more details
https://github.com/vaadin/framework/issues/9041

ThemeResource and ExternalResource should work.

As a workaround you can register resources to another component and use them to generate a url for a ExternalResource

class MyUI extends UI {

   void init(VaadinRequest request) {
      ...
      comboBox.setItemIconGenerator( fund ->
            adaptConnectorResourceForCombobox(new ClassResource(fund.getImage()), fund.getCode())
       );
      ...
   }

    private Resource adaptConnectorResourceForCombobox(Resource resource, String key) {
        if (resource instanceof ConnectorResource) {
            setResource(key, resource);
            return new ExternalResource(ResourceReference.create(resource, this, key).getURL());
        }
        return resource;
    }

}

HTH
Marco

Hi, thank you!
The workaround is working. But the images are a little exceeding the size of the combobox. Is there a way to reduce the size of the image icons to fit the space assigned into the combox? Since they are Resource I don’t see any way to shrink them, if not manually editing the file with some image-editing software

Have you tried with a css rule?

.v-filterselect-suggestmenu .v-icon { width: ...; heihgt: ...; } HTH
Marco

Thanks!
No, i didn’t try. I have a maven project and I still didn’t try or know how to add a custom css. i will be out for some days, and i then I will say if i was able to fix with it.
Thanks again

the getURL() note nullpoint, how to do?