Diseño de formatos de etiquetas y tickets para la impresión de archivos CSV y TXT con ESC POS

Esta guía está diseñada específicamente para impresoras compatibles con el estándar ESC/POS, que son comúnmente utilizadas para imprimir tickets utilizando rollos térmicos. Estas impresoras son básicas y presentan ciertas limitaciones que pueden afectar la apariencia final de los diseños impresos. Entre las restricciones más comunes se encuentran el tamaño de la impresión, el tipo de letra y la codificación de caracteres, lo que puede influir en cómo se visualizan elementos como los acentos. Es importante tener en cuenta estas limitaciones al diseñar y configurar sus etiquetas para asegurar la mejor calidad posible dentro de las capacidades técnicas de estas impresoras.

---

Diseño de etiquetas o tickets mediante comandos ESC/POS

A continuación se proporcionarán las instrucciones para crear un diseño de etiqueta o ticket utilizando ESC/POS.

El siguiente código proporciona un ejemplo general de los comandos de impresión que puedes utilizar con Text2 Barcode para diseñar tus formatos. A continuación, se explicará detalladamente el uso de cada una de las funciones disponibles.

<EscPos>
  <Init/>
  <QrCode>QR Test Text</QrCode>
  <Feed lines="1"/>

  <BarCode>1234567890</BarCode>
  <Feed lines="1"/>

  <PDF417>PDF417</PDF417>
  <Feed lines="1"/>

  <Text fontWidth="3" fontHeight="3">Large Text</Text>
  <Text fontWidth="2" fontHeight="2">Medium Text</Text>
  <Text fontWidth="1" fontHeight="1">Small Text</Text>
  <Feed lines="1"/>

  <Text justification="left">Left</Text>
  <Text justification="center">Center</Text>
  <Text justification="right">Right</Text>
  <Feed lines="1"/>

  <Text underline="one-dot-thick">Underline</Text>
  <Text bold="true">Bold</Text>
  <Text inverse="true">Investe</Text>
  <Feed lines="1"/>

  <Text fontWidth="2" fontHeight="2" justification="left" bold="true" underline="one-dot-thick">
    Large Text/Bold/Underline
  </Text>
  <Feed lines="3" />
  
  <Cut mode="full" />
</EscPos>

Ejemplo de impresión del código previamente mostrado.

---

Inicializar Impresora

Descripción: Inicializa la impresora. Este comando limpia los datos en el búfer de impresión y restablece la impresora a su configuración por defecto.

<Init/>

Parámetro	Valor	Descripción
width	number	Ancho del Ticket en milímetros
marginLeft	number	Margen izquierdo en milímetros
dpi	"203", "300", "600"	DPI para calcular el ancho y margen del ticket

Ejemplo para inicializar la impresora:

<EscPos>
  <Init/>
</EscPos>

Opcional: Ejemplo para configurar un ticket con un ancho de 51 mm:

<EscPos>
  <Init width="51" dpi="203"/>
</EscPos>

Opcional: Ejemplo para configurar un ticket con un margen izquierdo de 5 mm y un ancho de 60 mm.

<EscPos>
  <Init marginLeft="5" width="60" dpi="203"/>
</EscPos>

---

Imprimir Texto

Este comando se utiliza para imprimir texto.

<Text>

Ejemplo: <Text>Contenido</Text>

Parámetro	Valor	Descripción
font	"A", "B", "C"	Nombre de la fuente
fontWidth	[1-8]	Ancho del carácter
fontHeight	[1-8]	Altura del carácter
justification	"left", "center", "right"	Ajuste horizontal de la justificación
underline	"one-dot-thick", "two-dot-thick", "none"	Subrayado
lineSpacing	[0-255]	Espaciado entre líneas
doubleStrike	true or false	Doble tachado
bold	true or false	Negrita
inverse	true or false	Texto inverso
fotmat	string "%s"	Atributo para agregar texto o formatear
prefix	string	Texto que se coloca al inicio del contenido
suffix	string	Texto que se coloca al final del contenido
lf	true or false	Activa o desactiva el salto de línea al final del texto

Ejemplo:

<EscPos>
    <Text
        font="A"
        fontWidth="1" 
        fontHeight="1" 
        justification="left"
        underline="none"
        lineSpacing="0"
        doubleStrike="true" 
        bold="true" 
        inverse="true"
        format="texto: %s"
        prefix="Antes "
        suffix=" Final"
        lf="true"
    >
        Hola Mundo
    </Text>
</EscPos

---

Imprimir Código QR

Descripción: Este comando se utiliza para imprimir un código QR.

<QrCode>

Ejemplo: <QrCode>Content</QrCode>

Parámetro	Valor	Descripción
model	"1" o "2"	Modelo de código QR
errorCorrectionLevel	"L", "Q", "H" o "M"	Nivel de corrección de errores del QR
size	[1-16]	Establece el tamaño del módulo en puntos
justification	"left", "center", "right"	Ajuste horizontal de la justificación

Ejemplo:

<EscPos>
    <QrCode 
        model="1" 
        errorCorrectionLevel="M" 
        size="3" 
        justification="left"
    >
        1234567890
    </QrCode>
</EscPos>

Resultado

---

Imprimir Código de Barras

Descripción: Este comando se utiliza para imprimir un código de barras.

<BarCode>

Ejemplo: <BarCode>Content</BarCode>

Parámetro	Valor	Descripción
type	'upca' | 'upca_b' | 'upce_a' | 'upce_b' | 'jan13_a' | 'jan13_b' | 'jan8_a' | 'jan8_b' | 'code39_a' | 'code39_b' | 'itf_a' | 'itf_b' | 'codabar_a' | 'codabar_b' | 'code93_default' | 'code128'	Sistema de código de barras
width	[2-6]	Ancho del código de barras
height	[1-255]	Altura del código de barras
hriPosition	"above-bar-code", "below-bar-code", "above-and-below-bar-code", "not-printed"	Posición de la interpretación legible por humanos (HRI)
hriFont	"A", "B", "C"	Fuente para la interpretación legible por humanos (HRI)
justification	"left", "center", "right"	Ajuste horizontal de la justificación

Ejemplo:

<EscPos>
    <BarCode 
        type="code128" 
        width="2" 
        height="40" 
        hriPosition="below-bar-code" 
        hriFont="A" 
        justification="left"
    >
        1234567890
    </BarCode>
</EscPos>

Resultado

---

Imprimir Código PDF417

Descripción: Este comando se utiliza para imprimir un código PDF417, un tipo de código de barras bidimensional.

<PDF417>

Ejemplo: <PDF417>Contenido</PDF417>

Parámetro	Valor	Descripción
option	"truncated", "standard"	Opción de PDF417: truncado o estándar
errorCorrectionLevel	[0-8]	Nivel de corrección de errores del PDF417
width	[3-5]	Ancho del código
height	[2-8]	Altura del código
numberOfColumns	número	Establece el número de columnas en la región de datos
numberOfRows	número	Establece el número de filas
justification	"left", "center", "right"	Ajuste horizontal de la justificación

Ejemplo:

<EscPos>
  <PDF417
      option="standard"
      errorCorrectionLevel="1" 
      width="3"
      height="4"
      numberOfColumns="0"
      numberOfRows="0"
      justification="left"
  >
      1234567890
  </PDF417>
</EscPos>

Resultado

---

Imprimir Imagen

Descripción: Este comando se utiliza para imprimir una imagen, incluyendo la posibilidad de imprimir códigos QR.


<Image/>

Atributo	Valor	Descripción
uri	"http", "https", "file"	Identificador Uniforme de Recursos, ubicación de la imagen
base64	"string"	Contenido de la imagen en formato base64
width	número	Ancho de la imagen
height	número	Altura de la imagen
justification	"left", "center" or "right"	Establecer justificación horizontal
filter	"dither" or "monochrome" default:"dither"	Filtro para la imagen
threshold	[0-255] default:127	Umbral para la escala de grises

Ejemplo:

<EscPos>
    <Image 
        uri="https://labeldictate.com/text2barcode/img/logo.png" 
        width="500" 
    />
</EscPos>

Resultado

---

Feed

Descripción: Este comando imprime los datos en el búfer de impresión y avanza «n» líneas. Es útil para crear espacios entre secciones de texto o imágenes en una impresión.

<Feed/>

Parámetro	Valor	Descripción
lines	número	Número de líneas a avanzar

Ejemplo:

<EscPos>
  <Feed lines="1" />
</EscPos>

---

Cut – Cortar Papel

Descripción: Este comando se utiliza para activar la función de corte de papel en la impresora, permitiendo seleccionar entre un corte total o parcial.

<Cut/>

Parámetro	Valor	Descripción
mode	"part", "full"	Tipo de corte de papel: parcial o completo

Ejemplo:

<EscPos>
  <Cut mode="full" />
</EscPos>

---

Bytes

Descripción: Este comando se utiliza para enviar bytes directamente a la impresora. La cadena debe estar formateada con pares hexadecimales separados por espacios.

<Bytes>Cadena con pares hexadecimales</Bytes>

Este método proporciona un control detallado sobre la impresora al permitir la entrada manual de códigos de control específicos, como los necesarios para funciones de corte de papel y otros comandos específicos del dispositivo.

Ejemplo:

<EscPos>
    <!-- Initialize printer - ESC @ -->
    <Bytes>1B 40</Bytes> <!-- Hex -->

    <!-- Print "Hello World" - Text data -->
    <Bytes>48 65 6C 6C 6F 20 57 6F 72 6C 64</Bytes> <!-- Hex for "Hello World" -->

    <!-- Two Line Feeds - LF -->
    <Bytes>0A 0A</Bytes> <!-- Hex for two line feeds -->

    <!-- Cut Paper - GS V 49 -->
    <Bytes>1D 56 31</Bytes> <!-- Hex -->
</EscPos>

Tabla de comandos nativos ESC/POS

En el siguiente enlace para acceder a la tabla de comandos compatibles con ESC/POS, donde encontrarás una lista detallada de instrucciones para manejar tu impresora de manera efectiva.

---

Declaración de Variables y Asignación de Columnas para Archivos

Para asegurar una correcta integración con Text2 Barcode y Web2 Barcode, es crucial declarar adecuadamente las variables utilizadas en las etiquetas. Estas variables deben corresponder a las columnas específicas de los archivos CSV y TXT que se utilicen.

Para declarar una variable, utilice el símbolo de porcentaje (%) antes y después del nombre de la variable, sin dejar espacios. Por ejemplo, si desea referenciar el precio de un producto en su etiqueta, debe escribir

%PRECIO%.

Esta forma de notación es esencial para que el sistema reconozca de manera efectiva la variable y extraiga el valor correspondiente del archivo de datos. Asegúrese de seguir este formato para evitar errores en la impresión de sus etiquetas y optimizar el flujo de trabajo con nuestras aplicaciones.

---

Ejemplos de diseño

A continuación, se presentan ejemplos de diseños compatibles con Text2 Barcode y Web2 Barcode. Para utilizar estos diseños de manera efectiva, será necesario realizar las configuraciones necesarias en cada aplicación correspondiente. Esto asegura que los diseños se adapten y funcionen correctamente dentro del entorno de cada software.

Código

<EscPos>
    <Init/>
    <Text justification="left" lf="true">
        %DESCRIPCION%
    </Text>

    <Feed lines="1" />

    <Text font="A" fontWidth="2" fontHeight="2" justification="center" bold="true" lf="false">
        $
    </Text>

    <Text font="A" fontWidth="4" fontHeight="3" justification="center" bold="true" lf="false">
       %PRECIO%
    </Text>

<Feed lines="1" />

    <BarCode codeType="code128" width="2" height="50" hriPosition="below-bar-code" justification="right">
       %CODIGO%
    </BarCode>

    <Feed lines="3" />

   <Cut mode="full" />

</EscPos>

Nota: Los diseños mostrados son ilustrativos y podrían variar al momento de la impresión. Estas diferencias pueden deberse al firmware específico de cada fabricante de impresora, los tipos de letra compatibles y el ancho de impresión que maneja la impresora.

Código

<EscPos>

 <Init/>

    <Text fontWidth="2" fontHeight="2" justification="center" bold="true" doubleStrike="true" inverse="true" lf="true">
     OFERTA
    </Text>

    <Feed lines="1" />

    <Text justification="left" lf="true">
        %DESCRIPCION% 
    </Text>

<Feed lines="1" />

    <Text fontWidth="2" fontHeight="2" justification="center" bold="true" lf="false">
     %OFERTA%
    </Text>

    <Text fontWidth="0" fontHeight="0" justification="center" bold="true" underline="one-dot-thick" format="  Antes: $%s" lf="true">
%PRECIO%
   </Text>

<Feed lines="1" />

    <BarCode codeType="code128" width="2" height="50" hriPosition="below-bar-code" justification="right">
         %CODIGO%
    </BarCode>
   
    <Feed lines="4" />

   <Cut mode="full" />

</EscPos>

Nota: Los diseños mostrados son ilustrativos y podrían variar al momento de la impresión. Estas diferencias pueden deberse al firmware específico de cada fabricante de impresora, los tipos de letra compatibles y el ancho de impresión que maneja la impresora.

---

Enlaces relacionados.

Impresión de etiquetas con archivo CSV y TXT

Diseño de formatos de etiquetas para la impresión de archivos CSV con ZPL

Tutorial para crear etiquetas y formatos en Web2 Barcode