Barcode
Barcode
Employment/Purpose
An barcode component is used to generate a barcode at the browser, and decode the barcode on the server side. There are many properties to dealing with the barcode component. First, you could use the type property to specify the type of barcode, for example: qrcode, code128, code 128A...., after choose the type you want, you could generate the barcode of the code. And every barcode image could response to a certain value, the property value is for barcode image which wants to stand for.
Example
<barcode type="qr" value="https://www.zkoss.org/" height="100px"/>
<barcode type="code128" value="https://www.zkoss.org/" height="100px"/>
The barcaode supports controls property since 8.5.2
type
The barcode component support a 1D and 2D format. After choosing the type of barcode, and you can render the barcode as the type you choose.
Note: the type that barcode component supported can reference Supported Barcode Type (Default).
<barcode type="qr"/>
value
value is a string attribute that barcode component want to render.
Note: Some of the type only support a specific format of value.
<barcode type="qr" value="https://www.zkoss.org"/>
height
height is a string attribute to define the height of barcode component.
Note: (1) height is a string as a format of "number+px" (2) In type of qr, the width is as same as the height.
<barcode type="qr" value="https://www.zkoss.org" height="100px"/>
displayValue
The displayValue is the boolean attribute to decide whether the show the value under the barcode or not.
Note: This displayValue attribute is only implement for 1D format.
<barcode type="code128" displayValue="true"/>
fontSize
The fontSize is a integer attribute that deciding the font size of the displaying value.
Note: This attribute is only implement for 1D format with displayValue="true".
<barcode type="code128" displayValue="true" fonSize="20"/>
registerLibrary
registerLibrary(function () {}, library_name, [array of types] ) is a method to register a custom library into barcode widget. The way to use the methed is zkmax.barcode.Barcode.registerLibrary(...). You can register the library as the <zscript> below.
Note: the library is the client-side property.
<?script src="mybarcodeLibrary.js"?>
<zscript>
zk.afterLoad('zkmax.barcode', function () {
zkmax.barcode.Barcode.registerLibrary(function mybarcode(wgt) {
...
};
}, 'mybarcodeLibrary', ['type1', 'type2']);
});
</zscript>
Supported Barcode Type (Default)
| 1D |
CODE39, CODE128, CODE128A, CODE128B, CODE128C, EAN13, EAN8, EAN5, EAN2, UPC, ITF14,ITF, MSI, MSI10, MSI11, MSI1010, MSI1110, PHARMACODE, CODABAR |
| 2D |
QR |
Supported Barcode Type (Default)
| 1D |
CODE39, Code 93, CODE128, EAN8, EAN13, UPC-A, UPC-E, CODABAR, ITF, RSS-14, RSS-Expanded |
| 2D |
QR Code ,Data Matrix, MaxiCode |
Supported Children
*NONE
Use Cases
| Version | Description | Example Location |
|---|---|---|
Version History
| Version | Date | Content |
|---|---|---|
| 8.5.2 | Apirl, 2018 | Barcode |