BarcodeComponent

Represents the Kendo UI Barcode component for Angular.

Use this component to display a barcode in your Angular application.

typescript

import { Component } from '@angular/core';

@Component({
   selector: 'my-app',
   template: `
       <kendo-barcode type="EAN8" value="1234567">
       </kendo-barcode>
   `
})
export class AppComponent {
}

Selector

kendo-barcode

Export Name

Accessible in templates as #kendoBarcodeInstance="kendoBarcode"

Inputs

Name	Type	Default	Description
background?	string	"white"	Sets the background color of the Barcode. Accepts any valid CSS color string, such as hex or rgb.
border?	Border		Configures the border of the Barcode.
checksum?	boolean	false	Shows the checksum digit next to the value in the text area when set to true.
color?	string	"black"	Sets the color of the Barcode. Accepts any valid CSS color string, such as hex or rgb.
height?	number		Sets the height of the Barcode in pixels. You can also set the Barcode dimensions using CSS.
padding?	number | Padding	0	Sets the padding of the Barcode. Use a number to set all paddings, or a Padding object for the individual sides.
renderAs?	RenderMode	"svg"	Sets the rendering mode of the Barcode. Use "canvas" to render as a Canvas element or "svg" to render as an inline SVG.
resizeRateLimit	number	10	Limits how often the Barcode resizes automatically. Sets the maximum number of redraws per second when the container size changes. Set to 0 to disable automatic resizing.
text?	BarcodeText		Configures the Barcode text label.
type	BarcodeType	"Code39"	Sets the symbology (encoding) for the Barcode.
value	string | number		Sets the value of the Barcode.
width?	number		Sets the width of the Barcode in pixels. You can also set the Barcode dimensions using CSS.

Methods

exportImage
Exports the component as an image. The export operation is asynchronous and returns a promise.
Parameters options ImageExportOptions The parameters for the exported image.
Returns Promise<string> A promise that will be resolved with a PNG image encoded as a Data URI.

exportSVG
Exports the component as an SVG document. The export operation is asynchronous and returns a promise.
Parameters options SVGExportOptions The parameters for the exported file.
Returns Promise<string> A promise that will be resolved with an SVG document that is encoded as a Data URI.

exportVisual
Exports the component as a Drawing Group.
Returns Group The exported Group.

resize
Detects the size of the container and redraws the component. Resizing is automatic unless you set the resizeRateLimit option to 0.