QR code type
  • 28 Nov 2022
  • 1 Minute to read
  • Contributors
  • Dark
    Light

QR code type

  • Dark
    Light

Article summary

The QRCode type provides functions for generating QR codes.

Usage

To use any of the functions described on this page, you must prefix them with the QRCode type name:

QRCode.generate("some text")

And if you already named something else "QRCode", you need an additional prefix:

HiveTypes.QRCode.generate("some text")

Generate function

Generates the QR code of the given text and returns the SVG representation of it.
Syntax: generate(text, darkColor, lightColor, errorCorrectionLevel)

  • The first parameter is required and is the text of which the QR code gets generated (type: text, max length: 500 characters)
  • The second parameter is optional and defines the main color of the QR code (type: color, default value: #000)
  • The third parameter is optional and defines the background color of the QR code (type: color, default value: #FFF)
  • The fourth parameter is optional and defines the error correction level of the QR code (type: number, default value: 0). Possible values:
    • <=1 - Level L (Low) - 7% of codewords can be restored
    • 2 - Level M (Medium) - 15% of codewords can be restored
    • 3 - Level Q (Quartile) - 25% of codewords can be restored
    • >=4 - Level H (High) - 30% of codewords can be restored
QRCode.generate("some text a")
QRCode.generate("some text b", "#F00".toColor())
QRCode.generate("some text c", "#012".toColor(), "#ABC".toColor())
QRCode.generate("some text d", "#00D".toColor(), "#F0F".toColor(), 3)

The SVG QR code scales to any width/height needed. If you put the SVG into a visual in a graphic component and set the height/width, it will scale to this size accordingly.

Tips for improving the readability of the QR code:

  • Always leave a space between your QR code and the content or design around it. The QR code should always stand alone in the background and the foreground should not touch other elements.
  • Make sure there is enough contrast when using other colors than black and white.
  • Don’t put too much content into a QR code. Use a low error correction level for smaller QR codes.

Was this article helpful?

What's Next