Índice
| Índice |
|---|
| outline | true |
|---|
| exclude | Índice |
|---|
| style | none |
|---|
|
Objetivo
O objetivo deste guia é orientar o usuário a como utilizar o componente os componentes Leitura de código de barras e o componente de leitura de QR Code em um formulário de workflow no My Fluig mobile, bem como suas configurações e uso.
O componente de leitura de código de barras possui suporte as codificações 128C / GS1-128 / UCC/EAN-128 e EAN-13. E pode ser implementado ao formulário através do Fluig Studio.
| Dica |
|---|
Os passos e métodos abaixo podem ser usados tanto na implementação do componente de leitura de código de barras quanto para o componente de leitura de QR Code. |
Criando um formulário
...
01. O primeiro passo será criar um formulário via fluig Studio, para isso basta seguir atentamente os passos das documentações Fluig Studio e Desenvolvimento de formulários.
...
02. Implementar o componente Leitura de código de barras ou o componente de leitura de QR Code no desenvolvimento do formulário.
Funcionamento do componente
...
O componente Os componentes de leitura do código de barras e leitura de QR Code se baseia baseiam em 2 métodos que devem ser incluídos dentro de uma tag <script> no formulário a ser usado.
- Esta função é interceptada nativamente pelo aplicativo e inicia a captura do código de barras ou QR Code via câmera.
| Bloco de código |
|---|
|
function showBarcodeReader() {
JSInterface.showBarcodeReader();
} |
- Esta função é chamada pelo aplicativo para devolver para o formulário o valor lido pela câmera.
| Bloco de código |
|---|
|
function barCodeCallback(code) {
// Lógica para utilização do código recebido
} |
Confira na prática
...
| Deck of Cards |
|---|
|
| Card |
|---|
| id | 1 |
|---|
| label | Recurso em uso - Leitor de código de barras |
|---|
| - Assim que a câmera lê o código de barras o valor correspondente ao código é enviado ao input do campo do formulário em questão.
| Multimedia |
|---|
| name | WhatsApp Video 2024-04-17 at 11.34.39.mp4 |
|---|
|
|
|
| Deck of Cards |
|---|
|
| Card |
|---|
| id | 1 |
|---|
| label | Recurso em uso - Leitor de QRCode |
|---|
| - Assim que a câmera lê o código de barras o valor correspondente ao código é enviado ao input do campo do formulário em questão.
| Multimedia |
|---|
| name | Leitor de QRCode 1 FUNDO BRANCO.mp4 |
|---|
| width | 300 |
|---|
|
|
|
Exemplo de uso
...
O exemplo abaixo pode ser utilizado para a implementação do componente de código de barras, quanto o componente de leitura de QR Code.
| Bloco de código |
|---|
<div class="form-input">
<div class="form-group">
<label>Produto</label>
<input type="text" class="form-control" name="textbox1" value="" placeholder="Toque aqui para ler o código de barra" data-size="big" onclick="readProduct(this)">
</div>
</div>
<script type="text/javascript">
var campo = "";
function readProduct(mobj) {
campo = mobj;
showBarcodeReader();
}
function showBarcodeReader() {
JSInterface.showBarcodeReader();
}
function barCodeCallback(code) {
// Lógica para utilização do código recebido
campo.value = code;
}
</script> |