Search code examples
vaadinvaadin7

Vaadin: Images in Grid with IndexedContainer


So I'm trying to add Images to my Grid using an IndexedContainer with the following code:

    //picture
    String imgURL = (String)ds.child(PHOTO).getValue();//gets the image URL from the DB
    System.out.println(imgURL);
    ExternalResource picture = new ExternalResource(imgURL);
    System.out.println(picture.getURL());
    Image image = new Image(PICTURE, picture);
    image.setHeight("5px");
    item.getItemProperty(PICTURE).setValue(image);

Instead of getting the picture, I'm getting the toString() of the Image object. Both println print the correct URL. Also note that this works with Table but not with Grid. Any idea why?


Solution

  • If you want to display an image in a Vaadin Grid column, you need to set the ImageRenderer, see here paragraph ImageRenderer.

    Example: Define your column like

    grid.addColumn("picture", Resource.class).setRenderer(new ImageRenderer());
    

    then add a resource as column value

    grid.addRow(new ThemeResource("img/copernicus-128px.jpg"), "Nicolaus Copernicus", 1543);
    

    In your case it is the ExternalResource. No need for the Image component.