Instructions
📚 Como usar o Gerador Pix Simples
Configurar o Pix no seu aplicativo nunca foi tão fácil. Siga os 3 passos abaixo para gerar seus QR Codes instantaneamente.
1️⃣ Adicione o Elemento
No editor do Bubble, procure pelo elemento visual "Gerador Pix" (ou o nome que você deu) e arraste-o para a sua página ou Popup.
Dica: Você pode deixar o elemento visível ou oculto (tamanho 1x1), ele funcionará da mesma forma.
2️⃣ Preencha os Dados (Properties)
Nas propriedades do elemento, preencha os campos obrigatórios com dados dinâmicos ou estáticos:
Chave Pix: Insira o CPF, E-mail, CNPJ ou Telefone.
⚠️ Importante: Para telefones, use o formato internacional com +55 (Ex: +5511999999999). O plugin tenta corrigir automaticamente, mas o padrão correto garante o funcionamento.
Nome: Nome do beneficiário (quem vai receber).
Cidade: Cidade do beneficiário.
Valor (Opcional): Use ponto para decimais (Ex: 10.50). Se deixar vazio, o cliente poderá digitar o valor na hora de pagar.
TxID (Opcional): Um código para você identificar o pagamento no seu banco (Ex: PEDIDO123).
Nota: O plugin remove automaticamente espaços e caracteres especiais deste campo para evitar erros bancários.
3️⃣ Exiba o Resultado (Exposed States)
O plugin gera os dados em tempo real e os salva nos Estados (States) do próprio elemento.
🅰️ Para mostrar o QR Code:
Coloque um elemento de Image na tela.
No campo Dynamic Image, selecione: Gerador Pix A's qrcode_base64.
🅱️ Para o código "Copia e Cola":
Coloque um Input ou Text na tela.
No conteúdo, selecione: Gerador Pix A's copia_e_cola.
(Opcional) Crie um botão "Copiar" e use um workflow para copiar esse texto para a área de transferência.
🛠️ Solução de Problemas
O QR Code não aparece? Verifique se os campos Chave, Nome e Cidade estão preenchidos. Eles são obrigatórios.
Erro ao ler no banco? Se estiver usando chave de celular, certifique-se de que o código do país (+55) foi inserido.
Estados de Erro: O elemento possui o estado erro_msg. Você pode usá-lo em um Text (vermelho) para avisar o usuário caso algo esteja errado com a chave inserida.
💡 Exemplo de Workflow (Otimizado)
Você não precisa de workflow para "Gerar". Basta mudar os Inputs que o QR Code atualiza sozinho (automagicamente).
Use workflows apenas para:
Salvar o pedido no banco de dados quando o usuário clicar em "Finalizar".
Copiar o código Pix para o clipboard.