--- tags: - UI Page widgets alias: user-guide-uipage-widgets-barcode-actions-widget widgetname: Barcode Actions description: "This documentation details a widget for scanning barcodes and associating them with system objects" --- # Barcode Actions :core-static-barcodeidentification-lg:{style="font-size: 100px"} ## Overview The Barcode Actions widget provides a simple way for you to scan barcodes (line or QR codes) that match specific objects within the system. The available objects that can be matched are: * Material * Resource * Container ![Screenshot showing a barcode widget.](images/barcode_widget.png) For more information on how the system uses barcodes, see [[barcode-identification-index]]. ## General {% include-markdown 'includes/pages/ui_widgets_general_steps.md' %} ![Screenshot showing barcode settings.](images/barcode_settings.png) ## Style {% include-markdown 'includes/pages/ui_widgets_style.md' %} ## Entities In the **Entities** tab, provide the Entity Type and the property that should be matched when the barcode is read. ![Screenshot showing a configuration screen for the Barcode Actions widget with fields labeled "Entities" and "Actions".](images/barcode_entities.png) ## Actions In the **Actions** tab, you can add as many properties as desired by selecting the :material-plus: button. Properties can be removed by pressing the :material-trash-can: button. For each property, you need to specify the following: * **System Action Button** - Select the action that the button will perform. * **System Action** - Automatically determined based on the chosen system action button. * **Reset Entities on Success** - Indicate whether to reset the entities upon successful completion. * **Text** - The text to display on the action button. * **Icon** - The icon to use for the action button. * **Security Feature** - A security feature that restricts access to users without the specified feature. This is a free text entry but must exist in the system. For more information, see [[user-guide-security-features]]. ![Screenshot showing configuration options for the Barcode Actions widget, including entities and actions.](images/barcode_actions.png) ## Links Optionally, define the **Links** between this widget and other elements of the UI Page. ![Screenshot showing settings for linking widget to other elements on the UI page.](images/barcode_links.png) Select **Save and Close** to complete the widget configuration. ## Real Use Case To help you take full advantage of the Barcode Actions widget, the following scenario demonstrates how to connect a Barcode Actions widget and a [[user-guide-uipage-widgets-form]] widget with a [[user-guide-system-tasks-data-sources#barcode|Barcode]] task. 1. Configure the Barcode Actions widget, namely defining the Entities and the Actions to be performed, as shown below. === "Entities" ![Screenshot showing a configuration screen for the Barcode Actions widget with fields labeled "Entities" and "Actions".](images/barcode_entities.png) === "Actions" ![Screenshot showing configuration options for the Barcode Actions widget, including entities and actions.](images/barcode_actions.png) 2. Next, configure the Barcode task. For more information, see [[user-guide-system-tasks-data-sources#barcode]]. ![Data Source Barcode Settings](../../system-tasks/images/data_source_barcode_settings.png) 3. Configure the Form widget by adjusting the General Settings and defining the Fields as displayed below. For more information on this widget, see [[user-guide-uipage-widgets-form]]. === "General" ![formGeneral](images/form_general.png) === "Fields" ![formFields](images/form_fields.png) 4. Connect the widgets and tasks using the Links diagram as shown below. For more information on using the Links diagram, see [[user-guide-uipages-design]]. ![formFields](images/use_case_barcode_widget_links.png) 5. The final result should look like this. ![formFields](images/use_case_barcode_widget.png)