Vaadin 8网格：如何将图像显示为网格单元格中的工具提示？

我有一个网格单元格的图像，我想显示放大的图像作为工具提示。它应该可以用“setDescriptionGenerator”。我试过以下内容：Vaadin 8网格：如何将图像显示为网格单元格中的工具提示？

grid.addComponentColumn(probe -> { 
      Image image = new Image("", new ThemeResource("img/" + probe.getImage())); 
      image.setWidth(35, Unit.PERCENTAGE); 
      image.setHeight(35, Unit.PERCENTAGE); 

      return image; 
     }).setCaption("Structure").setDescriptionGenerator(probe -> { 
      Image image = new Image("", new ThemeResource("img/" + probe.getImage())); 

      return image; 
     });

但我得到错误，我无法返回图像。看来用“setDescriptionGenerator”我只能设置一个字符串。是否可以编写自定义描述生成器？请给我一个例子。

谢谢你的帮助！

来源

2017-10-18 Natalie

只要你可以在这里只返回字符串类型，我会为您提供以下解决方法：

grid.addComponentColumn(probe -> { 
     Image image = new Image("", new ThemeResource("img/" + probe.getImage())); 
     image.setWidth(35, Unit.PERCENTAGE); 
     image.setHeight(35, Unit.PERCENTAGE); 

     return image; 
    }).setCaption("Structure").setDescriptionGenerator(probe -> { 
      String imgSource = "img/" + probe.getImage(); 
      String html = "<img src=\" " + imgSource + "\" width=\"100\" height=\"100\">"; 
      return html; 
     });

来源

2017-10-18 14:30:55 avix

谢谢！这是一个非常好的主意。你知道我必须把图像放在哪里吗？对于ThemeResource，我将图像放在src \ main \ webapp \ VAADIN \ themes \ mytheme \ img中。但是使用html，图像在那里找不到。我还尝试了使用src \ main \ webapp \ WEB-INF \ images中的图像的Vaadin basepath。这仍然不起作用。 – Natalie

请尝试'../ VAADIN/themes/mytheme/img'或者没有那些'..'。此外，请确保您的图片名称包含扩展名 – avix

我尝试了很多路径（即使是绝对的文件：//），但我始终将html显示为文本。 html似乎不能在网格描述中识别。我发现这个链接：https：//github.com/vaadin/framework/issues/8853你有没有在你的Vaadin 8网格中工作？ – Natalie

Vaadin 8网格：如何将图像显示为网格单元格中的工具提示？

回答

相关问题