Como Gerar QR Code e Código de Barras no Power Apps Fácil

Compartilhe nas Redes Sociais:

Você já se perguntou como gerar QR Code ou código de barras dentro do Power Apps Canvas sem depender de soluções complicadas, códigos secretos ou planos Premium? Neste artigo, baseado no vídeo acima do canal Power, vou te mostrar como fazer isso de forma simples, rápida e até meio divertida. E aviso logo: se você seguir até o final, tem uma palavra especial para comentar e mostrar que você realmente aprendeu algo novo hoje.

Por que criar códigos no power apps?

Muitos projetos, especialmente quando trabalhamos com Microsoft 365 e Power Platform, acabam exigindo códigos de barras ou QR Codes para controlar estoques, autenticar documentos, identificar pessoas em eventos e por aí vai. Só que, geralmente, esbarramos em limitações: alguns conectores exigem plano Premium, outros dependem de integrações externas complicadas. Mas, e se eu te disser que dá para resolver somente mudando uma URL?

Como funciona a api open source para geração de código

O segredo por trás dessa solução é uma API gratuita e open source, chamada de bwip-js – lá no projeto Power a gente usa bastante essa abordagem em nossos treinamentos e consultoria. Essa API permite gerar tanto códigos de barras como QR Codes, só alterando alguns parâmetros na URL.

Use uma simples URL para criar seu QR Code ou código de barras!

Estrutura básica da url

O endereço da API é assim:

https://bwipjs-api.metafloor.com/?bcid=TIPO_DO_CODIGO&text=SEU_TEXTO

  • bcid: define o tipo do código (por exemplo, code128 para código de barras, qrcode para QR Code)
  • text: aqui vai o número ou texto que você quer codificar

Exemplos práticos:

  • Código de barras (Code 128): https://bwipjs-api.metafloor.com/?bcid=code128&text=1234567890
  • QR Code: https://bwipjs-api.metafloor.com/?bcid=qrcode&text=PowerPlatform

Personalize do seu jeito

Dá para ajustar o tamanho, cor e outros detalhes, só adicionando parâmetros na URL, caso queira. Mas, sinceramente? O padrão já resolve 99% dos casos simples no Power Apps Canvas.

Construindo o app: passo a passo

Mãos à obra! Que tal você experimentar criando um app no Power Apps Canvas, com um campo de texto, um seletor de tipo de código e, claro, a imagem gerada automaticamente?

1. crie os componentes básicos

  • TextInput: para usuário digitar o valor do código
  • Dropdown: escolha do tipo de código (code128 ou qrcode)
  • Image: onde vai aparecer o código gerado

App no Power Apps Canvas mostrando campos de seleção e código gerado na tela

2. configurando o dropdown

No componente Dropdown, coloque as opções:

  • Code128
  • Qrcode

Você pode adicionar rótulos amigáveis usando esta fórmula em Items:

[  {Value:”Cód. de Barras”, Code:”code128″},  {Value:”QR Code”, Code:”qrcode”}]

Assim, o usuário vê rótulos em português e internamente você usa os códigos corretos para a URL.

3. campo de texto para números ou textos

Basta adicionar um TextInput para o usuário digitar o número (ou texto, no caso do QR Code).

4. gerando automaticamente a imagem do código

Agora vem a mágica. No Image, coloque a seguinte fórmula no campo Image:

“https://bwipjs-api.metafloor.com/?bcid=” & Dropdown1.Selected.Code & “&text=” & TextInput1.Text

Cada vez que o usuário troca o valor do seletor ou muda o texto, o código é gerado na hora – fácil de visualizar, copiar, imprimir ou usar como quiser.

Não precisa plano premium!

Tudo isso funciona em apps Power Apps Canvas padrão, sem integrações caras.

Essencialmente, você só está mostrando uma imagem da URL. O Power Apps apenas lê a imagem diretamente da internet. Isso te livra de custos extras e permite usar em diferentes telas e dispositivos sem restrição.

Testando e vendo exemplos práticos

Imagina um cadastro de visitantes: você pode gerar um QR Code único para cada visitante, deixar visível ou até imprimir. Ou pensa em um app de estoque, atribuindo um código de barras para cada item. Troque o valor e veja a mágica acontecer.

  • Exemplo QR Code: https://bwipjs-api.metafloor.com/?bcid=qrcode&text=Visitante123
  • Exemplo Code128: https://bwipjs-api.metafloor.com/?bcid=code128&text=789456123

Dois códigos na tela, QR Code e Code 128, lado a lado

Vantagens, limitações e alternativas

Esse serviço open source é gratuito e muito flexível. Mas, como ele é hospedado por terceiros, existe um risco: se o servidor estiver fora do ar, nenhum código será carregado no seu app Power Apps. Isso pode atrapalhar operações críticas.

Para quem precisa de estabilidade, existe a opção de baixar o bwip-js (código livre no GitHub) e rodar em um servidor próprio. Assim, você controla a disponibilidade e pode até ajustar parâmetros avançados, caso necessário. Aliás, o time do projeto Power pode te ajudar a configurar tudo isso em um ambiente seguro, se precisar de apoio – basta chamar.

Conclusão: transforme seus apps e compartilhe suas dúvidas

Criar códigos nunca foi tão fácil.

Pense em quantas possibilidades sua aplicação vai ganhar: rastreamento, automação, personalização… tudo isso sem custos extra e com o poder das soluções Microsoft. Como já mostramos no canal Power e também nos nossos projetos, é incrível perceber quanta coisa pode ser feita apenas usando criatividade e as ferramentas abertas — às vezes um simples endereço na web faz toda a diferença.

Se ficou com alguma dúvida, sugestão ou quer ver outras dicas práticas como essa, interaja com a gente no Instagram @canalpowerbr. Tire dúvidas, conheça novas funções e fique sabendo das novidades. Valorize sua experiência, e lembre-se de seguir acompanhando os conteúdos do projeto Power.

Ah, só para saber se você chegou até aqui: comente a palavra maçã no final da página! Assim, vou saber que você realmente acompanhou todo o tutorial e se interessa por aprimorar ainda mais seus conhecimentos em Power Apps e Power Platform.

Aproveite, compartilhe com colegas e conheça nossos treinamentos e consultorias em Power Apps, Power Automate, Power BI e toda a Microsoft 365: é o começo para transformar seu trabalho digital!

Compartilhe nas Redes Sociais:

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *