Good morning,
I am trying to make a greater usage of the HTML5 Canvas component (Pekka Maanpää’s version), but I seem to misunderstand the Drawimage part. The ‘standard’ way of using the wrapper function seem to be aimed at an URL source (i.e. https://dummyimage.com/600x400/000/f00 for exemple). I want to use internal images (i.e. in the resource folder or, ideally a BLOB entry into a database, or direct ByteArray data)
I have a test case where I upload a image, extrats its byte, use that to create the Vaadin Image with a ByteArrayInputStream. When this image is loaded I would like to render it into the Canvas Rendering Context (rdr). However I can’t seem to understand what to pass in the “source” parameter
private void createUpload(String ID, String label, String labelDrop) {
Div output = new Div();
MemoryBuffer buffer = new MemoryBuffer();
Upload upload = new Upload(buffer);
upload.addSucceededListener(event -> {
try {
buffer.getInputStream().read(image2Bytes);
} catch (IOException e) {
e.printStackTrace();
}
image5 = new Image(new StreamResource("img.png", new InputStreamFactory() {
@Override
public InputStream createInputStream() {
ByteArrayInputStream bais = new ByteArrayInputStream(image2Bytes);
imageLoaded = true;
rdr.DrawImage("img.png", 50, 50, 100, 100);
return bais;
}
}), "alt text");
add(image5);
});
upload.setMaxFileSize(10 * 1024 * 1024);
upload.setId(ID + "-upload");
output.setId(ID + "-output");
upload.setDropLabel(new Label(labelDrop));
addCard(label, upload, output);
}
Debugging the application in the browser … I see Vaadin generates those ‘dynamic resources’ into
http://localhost:8080/VAADIN/dynamic/resource/0/8d3a7f52-563b-41b7-8fd8-e5498b19d6fe/img.png
How can I get that ^^^ string to pass to the CanvasRenderingContext to (technically speaking) pass the image data from Java to Canvas??
Edit :
Well, it seem that
rdr.DrawImage(image5.getSrc(), 50, 50, 100, 100);
get’s the work done, but there seem to be a timing issue on my side (i suppose). The image is only getting drawn the 2nd time I upload it.
Should it trigger some sort of timer ?