如何在 Vaadin 中将图像添加到布局 (Spring)

Question

我想将图像添加到我的网络应用程序，但我遇到了一些问题。

private void newImage(){
    Image image = new Image("src/main/resources/images/sponsor.png");
    absoluteLayout.addComponent(image);
}

我做了类似的事情，但没有用。我搜索了一些关于 FileResource 的内容，但我仍然不知道该怎么做。

我的图片文件放在目录src/main/resources/images:

我也阅读了文档站点，但它仍然无法正常工作：https://vaadin.com/components/vaadin-image。

Answer 1

绝对布局组件和 Image class 的构造函数仅采用一个参数的存在意味着您使用的是 Vaadin 8（或更早版本），而您链接到的文档是适用于 Vaadin 10 及更新版本。

从屏幕截图中可以看出，您将图像路径传递到的构造函数参数名为 caption。因此，这是显示在图像旁边的文本，而不是对图像数据本身的引用。

您还需要为图像分配一个 Resource，作为第二个构造函数参数或使用单独的 setSource 方法。对于 src/main/resources 中的文件，最简单的方法是使用 ClassResource 从 class 路径加载数据。

综合起来，一个工作示例将是这样的：

Image image = new Image();
image.setSource(new ClassResource("/images/sponsor.png"));

How to add a image to a Layout in Vaadin (Spring)