1. Add QR Renderer Element (Required for web)

• Go to the UI Design module.
• Add the QR Renderer element to the form screen.
• Enter the data to be displayed in the QR code in the Value field in the Properties panel on the right side. For example: ‘https://www.kuika.com’

2. Define Generate QR Code Action

• Click on the + ADD ACTION menu in the right panel.
• From the + ADD ACTION menu, add the Export > Generate QR Code action according to the trigger event you want (Initial Actions, OnClick, OnBlur, etc.).

• Configure the Value field:

• Enter the data to be included in the QR code in this field.
• It is usually defined using data sources such as Action Result, Current, Form Component, Screen Input or Fixed, and can be linked via the Symbol Picker.

3. Saving Settings

• After entering the necessary parameters, click the SAVE button.
• The action will successfully match the QR Renderer and start generating the QR code visually.

A user filling out an event registration form is to be shown a QR code containing their registration information.

Application Flow

• Element: The Label section of the Button element should contain ‘Generate QR code’.
• Trigger: OnClick
• Action: Export → Generate QR Code

Parameter Assignments

• Value: The link representing the user's personal registration page

When the user clicks the button, the QR code for their registration link is automatically displayed via the QR Renderer element.

• Dynamic Data Creation: The data to be used in the QR code can be created with an ID, UUID or URL from an SQL action.
• Mobile-Friendly Sharing: Users who scan the QR code can be redirected to screens specific to their devices.
• Chain Actions: After the QR code is generated, a Send Email action can be added to send this information to the user's email address at the same time.
• Hidden Encoding: The data in the QR code can be transmitted with a token or encrypted text.

Technical Risks and Controls

• Data Format Error: If the Value parameter is empty or invalid, the QR code cannot be generated.
• Element Link Error (Web): If the QR Renderer element is not defined, the QR code may not appear.
• Mobile Compatibility Check: Some Android/iOS versions may experience screen size issues when displaying QR codes.

The Generate QR Code action is an effective tool that facilitates data sharing with users in your application. Users can access the specified information with a single scan, and this interaction occurs seamlessly in both mobile and web environments. It can be used effectively in many scenarios, such as event management, access link sharing, payment or registration processes.