Search code examples
javaimagezk

ZK Replace Image Content

I have an image on a zul page, that I need to replace using the controller.

I've tried using Image.setContent(bufferedImage) as well as Image.setSrc(base64EncodedString) neither of these update the displayed image.

I've also attempted calling Image.invalidate() after setting the source and content, this does not update the image either.

My image tag on the .zul looks like this

<image id="imgStreaming" width="200" height="200" style="display:inline-block; border:1px solid #b9b9b9; border-radius:0px; color:#ccc; min-width:200px; min-height:200px;" />

The code in the controller looks like this

JsonArray ja = json.getAsJsonObject().get("A").getAsJsonArray();                    
BufferedImage bufferImg = decodeToImage(ja.get(0).toString());                    
imgStreaming.setContent(bufferImg);
imgStreamingFingerprint.invalidate();

the decodeToImage method simply takes the base64 string and converts it back to a BufferedImage

Solution

  • ZK image content contains AImage object. So you need to create this object before you can change content of your image element. See example below 

    <image content="@bind(vm.currentImage)"/>

URL url = new URL(IMAGE_URL);
currentImage = new AImage(url);