-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hi All
I would like to display image following by QR code Image base 64 as per :
src="data:image/jpeg;base64,[xyz.......]"
How to display Base64 images in ZUL?
Please advice me.
Best regards.
You can just display the image as a background of a div. It depends if you are using MVC or MVVM.
MVVM
In the ViewModel:
getQrImageBackgroundImage(){
return "background-image: url('" + qrBase64 + "');";
}
ZUL Page:
<div id="qrImage" style="@load(vm.qrImageBackgroundImage"/>
MVC
In the controller
@Wire
Div qrImage;
afterCompose{
divImage.setStyle("background-image: url('" + qrBase64 + "');");
}
ZUL Page:
<div id="qrImage" style="@load(vm.qrImageBackgroundImage"/>
You will also need some CSS to style the drImage div to the size you want.
I just tested it and in ZK the most obvious is just what you said...
<image src="data:image/gif;base64,..."/>
Was there a problem when you tried to set the src attribute?
Here a runnable example, also showing both zul and a java way:
http://zkfiddle.org/sample/3pm0ecg/1-base64-image-url
Robert
Asked: 2017-05-05 05:00:38 +0800
Seen: 62 times
Last updated: May 22 '17
zkspringmvc jar licence is GPL ?
Build web application without any zul files
Custom component that extends Textbox does not fire onChange event
java.lang.NullPointerException to update to zk 8.0.1
"Spring Session" + ZK + "Spring core" @Listen method refresh the screen
zk8 client side binding to a viewmodel command seems not to work
upload event dialog do not open in browser
Notification is not shown inside sticky block
Where can I find documentation (like ZK Developer's Reference) for ZK 8.0.2.2 ?