js-barcode
Reactive icon

JS Barcode

Stable version 1.0.0 (Compatible with OutSystems 11)
Uploaded
 on 2 Jul (yesterday)
 by 
0.0
 (0 ratings)
js-barcode

JS Barcode

Documentation
1.0.0

How to Use

  1. Drag the BarcodeSVG block onto your screen or another block.
  2. Set the Value input with the data you want to encode (e.g. a product code, container number, or any supported string).
  3. Set the OutputTypeId input using the Barcode_OutputType Static Entity. SVG is recommended for print and scalability.
  4. Optionally populate the BarcodeOptions structure to customize format, dimensions, colors, and typography. All fields are optional and fall back to JsBarcode defaults when left empty.
  5. The barcode renders automatically when parameters are set or change.

Configuration

Use the provided Static Entities for type-safe configuration:

  • Barcode_Format — Select the barcode encoding type. Leave empty for auto-detection (defaults to CODE128).
  • Barcode_OutputType — Select SVG, IMG, or Canvas rendering.
  • Barcode_TextAlign — Align the text below or above the barcode.
  • Barcode_TextPosition — Position the text above or below the bars.
  • Barcode_FontOptions — Apply bold, italic, or bold italic styling to the text.

All other options (Width, Height, FontSize, Colors, Margins) are numeric or text inputs on the BarcodeOptions structure. Refer to the Demo screen for a live interactive example of all available options.

For full JsBarcode option reference, see the official documentation at https://lindell.me/JsBarcode/


Browser support:

  • Chrome 9+
  • Firefox 12+
  • Safari 5+

Note: SVG output is recommended for broadest compatibility. Canvas and IMG output may behave differently on older browser versions.

References