Files

T

2026-05-06 13:35:47 -03:00

4.4 KiB

Raw Blame History

title, source, path

title	source	path
Android - Como utilizar os componentes Leitura de código de barras e QR Code?	https://tdn.totvs.com/pages/viewpage.action?pageId=559498199	\Plataforma Documentação técnica\Configuração\Mobile\Android\Android - Como utilizar os componentes Leitura de código de barras e QR Code.md

Índice

1 Objetivo
- 1.1 Criando um formulário
- 1.2 Funcionamento do componente
- 1.3 Confira na prática
  - 1.3.1 Exemplo de uso

Objetivo

O objetivo deste guia é orientar o usuário a como utilizar 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, 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.

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](../../../Instalação e Atualização/Guia de instalação Fluig Studio.md) e [Desenvolvimento de formulários](../../../Recurso de Documentos (ECM)/Desenvolvimento de Formulários.md).

Pode ser interessante fazer a leitura das documentações [Configuração para uso inicial](../../../Desenvolvimento sobre a plataforma/Fluig Studio/Configuração para uso inicial do Fluig Studio.md)

[do Fluig Studio](../../../Desenvolvimento sobre a plataforma/Fluig Studio/Configuração para uso inicial do Fluig Studio.md) e [Guia de atualização Fluig Studio](../../../Instalação e Atualização/Guia de atualização Fluig Studio.md) para garantir seu correto funcionamento e garantir uma boa experiência.

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

Os componentes de leitura do código de barras e leitura de QR Code se 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.

Método 1

function showBarcodeReader() {
	JSInterface.showBarcodeReader();
}

Esta função é chamada pelo aplicativo para devolver para o formulário o valor lido pela câmera.

Método 2

function barCodeCallback(code) {
	// Lógica para utilização do código recebido
}

Confira na prática

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.

[ Your browser does not support the HTML5 video element ](/download/attachments/559498199/WhatsApp Video 2024-04-17 at 11.34.39.mp4)

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.

[ Your browser does not support the HTML5 video element ](/download/attachments/559498199/Leitor de QRCode 1 FUNDO BRANCO.mp4)

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.

<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>

4.4 KiB Raw Blame History