Загрузите файл изображения PNG для отображения на макете Vaadin Flow в качестве объекта изображения

Question

Vaadin Flow предлагает класс Image, представляющий тег HTML img.

Если у меня есть файл с именем logo.png, хранящийся в папке resources моего приложения Vaadin 12, как мне загрузить этот файл для отображения в виде Image в макете?

Пример для Image в Vaadin 8 Sampler показывает код, который больше не актуален, так как я не могу найти класс ClassResource в Flow.

Answer 1

Если ваш ресурс не находится внутри корневого каталога для веб-ресурсов, https://vaadin.com/docs/v13/flow/advanced/tutorial-dynamic-content.html дает подсказку об использовании com.vaadin.flow.server.StreamResource для предоставления данных с помощью java.io.InputStream:

StreamResource res = new StreamResource("logo-image.png", () -> {
    // eg. load image data from classpath (src/main/resources/images/image.png)
    MainView.class.getClassLoader().getResourceAsStream("images/image.png")
});
Image imageFromStream = new Image( res,"Alternativ text description for logo image");
add(imageFromStream);

Answer 2

Вы можете поместить этот логотип под тем, что ваш инструмент сборки / настройки считает корневым для веб-ресурсов в каталоге frontend/..., а затем ссылаться на этот ресурс следующим образом:

new Image("frontend/images/logo.png", "Acme Inc. Logo")