Hoy te voy a enseñar a agregar un salto de línea a un texto para evitar cortar las palabras en caso de que dicho texto supere determinada longitud de columna.
Dicho con otras palabras veremos cómo hacer que un texto salte a la siguiente línea automáticamente si es demasiado largo, sin que se corten las palabras.
Por ejemplo, supongamos que puedes imprimir 10 letras por línea como máximo. Un texto se vería así, cortando las palabras y dejándolas incompletas:
Hola mundo
soy un te
xto desde
parzibyte.me
Con la función que te mostraré hoy vamos a hacer que la palabra se corte en el espacio en blanco y queden solo palabras completas tomando en cuenta una máxima longitud para la línea. Por ejemplo:
Hola mundo
soy un
texto
desde
parzibyte.me
Te recuerdo que vamos a bajar las palabras a la siguiente línea usando JavaScript trabajando con cadenas (string). Sería el equivalente a overflow-wrap: break-word;
y word-break: normal;
de CSS.
Sin más que decir, veamos la función que recibe la cadena que va a dividir en varias líneas sin superar la máxima longitud.
Obviamente en el caso de que una palabra individual sea más larga que la máxima longitud, la misma será colocada completamente y no será dividida, ya que las divisiones se hacen cuando se encuentra un espacio.
const agregarSaltoDeLineaSiSuperaLongitud = (cadena, maximaLongitud) => {
if (cadena.length <= maximaLongitud) {
return cadena;
}
const palabras = cadena.split(" ");
let linea = "";
let resultado = "";
for (const palabra of palabras) {
if (linea.length + palabra.length > maximaLongitud) {
resultado += linea.trim() + "\n";
linea = palabra + " ";
} else {
linea += palabra + " ";
}
}
if (linea.trim().length > 0) {
resultado += linea.trim();
}
return resultado;
};
Un ejemplo de ejecución es el siguiente:
const maximaLongitudDeLinea = 20;
const cadena = "Hola mundo soy un texto desde parzibyte.me. Dividir las palabras en varias líneas es útil en las impresoras térmicas, así el texto no se ve cortado";
const dividida = agregarSaltoDeLineaSiSuperaLongitud(cadena, maximaLongitudDeLinea);
console.log("En varias líneas es:\n%s", dividida)
/*
Salida:
En varias líneas es:
Hola mundo soy un
texto desde
parzibyte.me.
Dividir las palabras
en varias líneas es
útil en las
impresoras térmicas,
así el texto no se
ve cortado
*/
Fíjate en que todas las líneas son menores a cierta longitud, y que si son muy largas se dividen en una nueva línea.
Hice este ejercicio debido a que un cliente me preguntaba cómo hacer esto para evitar cortar las líneas cuando se imprime en una impresora térmica.
En este post te enseñaré a imprimir la letra ñ en una impresora térmica. Voy…
En este post te quiero compartir mi experiencia tramitando un acta de nacimiento de México…
Hoy te voy a presentar un creador de credenciales que acabo de programar y que…
Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al…
En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly…
En un artículo anterior te enseñé a crear un PWA. Al final, cualquier aplicación que…
Esta web usa cookies.
Ver comentarios
tengo el plugin corriendo en el puerto 8000 y el sublime pos en el 2106 y en el playground me aparece la impresora y puedo mandara imprimir cosas , pero en sublime pos 3 en impresoras no me aparece ninguna impresora, estoy en Raspberry
Tal vez no ha descargado la versión compatible para Sublime POS. Me parece que para Sublime POS 3 se usa la versión 3.2.1 pero en el playground se usa la 3.5.1. De cualquier manera, que usted pueda imprimir desde el playground es una buena señal, pues ya solo sería cuestión de ajustar Sublime POS 3.