MAD Lab
/
Tutor > Feedback e display > QR code e código de barras

QR code e código de barras

Feedback e display

mad-qrcode mad-barcode
QR code

mad-qrcode com tamanho e nível de correção de erro (ec-level).

QR
size=140, ec-level=M (padrão)
QR
ec-level=H — mais tolerante a dano
resources/views/tutor/examples/feedback-codigos/qrcode.blade.php
<div style="display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;">
    <div style="text-align:center;">
        <mad-qrcode data="https://mad-framework.test/tutor" :size="140" />
        <div style="margin-top:6px;font-size:.8rem;color:#6b7280;">size=140, ec-level=M (padrão)</div>
    </div>
    <div style="text-align:center;">
        <mad-qrcode data="https://mad-framework.test/tutor" :size="140" ec-level="H" />
        <div style="margin-top:6px;font-size:.8rem;color:#6b7280;">ec-level=H — mais tolerante a dano</div>
    </div>
</div>
Código de barras (C128)

mad-barcode formato Code 128, com o texto abaixo (show-text).

Barcode
PED-2026-0042
resources/views/tutor/examples/feedback-codigos/barcode-code128.blade.php
<mad-barcode data="PED-2026-0042" format="C128" :width="260" :height="70" show-text />
Código de barras (EAN-13)

mad-barcode formato EAN-13, com e sem o texto abaixo.

Barcode
7891234567895
Barcode
resources/views/tutor/examples/feedback-codigos/barcode-ean13.blade.php
<div style="display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;">
    <mad-barcode data="7891234567895" format="EAN13" align="left" />
    <mad-barcode data="7891234567895" format="EAN13" :show-text="false" align="center" />
</div>
Composição: ficha de acesso

mad-card + mad-qrcode combinados.

Ficha de acesso — Pedido #4821
QR

Cliente: Ana Souza

Retirada: Loja Centro

resources/views/tutor/examples/feedback-codigos/composicao.blade.php
<mad-card header="Ficha de acesso — Pedido #4821">
    <div style="display:flex;gap:16px;align-items:center;">
        <mad-qrcode data="PEDIDO:4821" :size="110" />
        <div>
            <p style="margin:0 0 4px;"><strong>Cliente:</strong> Ana Souza</p>
            <p style="margin:0;"><strong>Retirada:</strong> Loja Centro</p>
        </div>
    </div>
</mad-card>
Código-fonte completo da página
app/control/Tutor/TutorFeedbackCodigos.php
<?php

namespace App\Control\Tutor;

use App\Support\Tutor\TutorPage;

class TutorFeedbackCodigos extends TutorPage
{
    protected string $catalogKey = 'feedback_codigos';
}
resources/views/tutor/feedback/codigos.blade.php
<x-tutor-page page="feedback_codigos">
    <x-tutor-demo demo="tutor.examples.feedback-codigos.qrcode"
        title="QR code" desc="mad-qrcode com tamanho e nível de correção de erro (ec-level)." />

    <x-tutor-demo demo="tutor.examples.feedback-codigos.barcode-code128"
        title="Código de barras (C128)" desc="mad-barcode formato Code 128, com o texto abaixo (show-text)." />

    <x-tutor-demo demo="tutor.examples.feedback-codigos.barcode-ean13"
        title="Código de barras (EAN-13)" desc="mad-barcode formato EAN-13, com e sem o texto abaixo." />

    <x-tutor-demo demo="tutor.examples.feedback-codigos.composicao"
        title="Composição: ficha de acesso" desc="mad-card + mad-qrcode combinados." />
</x-tutor-page>