Cómo generar archivos de título de fuente e imagen

Mostrar fuentes o imágenes personalizadas en una pantalla LCD con un microcontrolador generalmente requiere mucho trabajo. Hemos utilizado algunas herramientas disponibles para facilitar esto en su próximo proyecto. Nuestro script de Python convertirá archivos BMP en un archivo de encabezado listo para usar con microcontroladores AVR. Lo guiaremos después del descanso.

Para este tutorial usaremos el Programa de manipulación de imágenes GNU junto con Python. Estamos trabajando en un sistema Ubuntu 9.04, pero como se trata de herramientas multiplataforma, debería poder hacerlo en cualquier sistema operativo.

Qué hace el guión:

La secuencia de comandos de Python toma una o más imágenes BMP indexadas con paleta de colores de 1 bit, corta el título y cualquier dato de columna no utilizado y genera un archivo de título con la información almacenada en una matriz unidimensional en PROGMEM. Luego, estos datos se pueden leer de la tabla y se manipulan en el código AVR para usarlos en cualquier formato que necesite para su pantalla. Esto se puede utilizar para generar fuentes o convertir imágenes más grandes.

Genere los archivos BMP:

Abra el GIMP y cree un nuevo archivo con las dimensiones que necesita. La altura depende de usted, pero el ancho debe estar en múltiplos de 8 para corresponder al ancho de almacenamiento de 8 bits. En este caso, nos interesa generar un conjunto de fuentes que se mostrarán en un área de 24 × 30 píxeles.

Usando la herramienta de fuente, seleccione la fuente deseada y agregue su carácter. Ajuste el tamaño y la ubicación hasta que el lienzo esté lleno. Debe asegurarse de que la casilla de verificación Antialiasing de la herramienta de fuentes no esté seleccionada.

Los archivos BMP se guardan de abajo hacia arriba, Necesitamos invertir la imagen para nuestros propósitos.. Haga esto haciendo clic en el menú Imagen, vaya a Transformación y seleccione "Invertir verticalmente". También necesitamos hacer de esta una imagen indexada. Para hacer esto, haga clic en el menú Imagen de arriba, vaya a Modo y seleccione "Indexado ...". En este menú, seleccione "Usar paleta en blanco y negro (1 bit)". Ahora guarde el archivo como una imagen BMP. En nuestro caso, lo mantuvimos como 4.bmp. Repita esto para cada carácter que desee incluir en su nuevo archivo de encabezado de fuente.

Usa el guión:

Descarga nuestro archivo bmp2header.py.

$ python bmp2header.py *.bmp

Please enter how many bytes (8-bits) wide
the image data needs to be:

3

Generating header file with a byte width of: 3 bytes
Successfully generated: my_header.h

Ejecute el archivo, con sus imágenes BMP como argumentos de la línea de comandos. Se le pedirá que ingrese el ancho de columna deseado para las imágenes. Nuestra imagen de ejemplo tiene 24 píxeles de ancho, por lo que queremos que los datos del encabezado tengan 3 bytes de ancho (24 píxeles / 8 bits = 3 bytes). Puede ver en el resultado que my_header.h se creó correctamente utilizando el script.

Aquí está el contenido de este archivo (en este caso datos para el carácter '4'):

#include <avr/pgmspace.h>

static const char PROGMEM my_header[]={

//4
0x1f, 0x00, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x80, 0x00,
0x3f, 0x81, 0xfc,
0x3f, 0x81, 0xfc,
0x3f, 0x81, 0xfc,
0x3f, 0xff, 0xfc,
0x3f, 0xff, 0xfc,
0x3f, 0xff, 0xfc,
0x3f, 0xff, 0xfc,
0x00, 0x01, 0xfc,
0x00, 0x01, 0xfc,
0x00, 0x01, 0xfc,
0x00, 0x01, 0xfc,
0x00, 0x01, 0xfc,
0x00, 0x01, 0xfc

};

En el archivo de encabezado, cada BMP procesado por el script tendrá su nombre de archivo agregado como comentario antes de la salida HEX. Nuestros datos para 4.bmp aparecen en 3 columnas de bytes con 30 filas. Esto coincide con el aspecto de 24 × 30 que estábamos buscando. Si tiene una salida mucho mayor que esta, o no usó una imagen indexada de 1 bit, o algo estaba mal cuando el script le pidió que ingresara el ancho de su columna.

Accediendo a los datos del archivo de encabezado:

Tratar de cómo usar los datos de este título va más allá de este tutorial. A continuación se muestra el código que usamos para escribir en la pantalla en la imagen que se encuentra en la parte superior de este artículo. Nuestra pantalla se escribe declarando el área en la que queremos escribir y luego enviando un flujo de datos de bits para esa área. Proporcionamos esto solo con fines de referencia:

#include my_header.h

void Other_Num(unsigned char num, unsigned char x, unsigned char y)
{
 //Setup screen area for writing:
 LCD_Out(0x2A, 1);
 LCD_Out(x, 0);
 LCD_Out(x+23, 0);
 LCD_Out(0x2B, 1);
 LCD_Out(y, 0);
 LCD_Out(y+29, 0);
 LCD_Out(0x2C, 1);

 unsigned char temp;
 for (unsigned char i=0; i<90; i++)                //Read one column of char at a time
 {
 temp = pgm_read_byte((char *)((int)my_header + (i + (90*num))));    //Get column from progmem

 for (unsigned char k=0; k<8; k++)
 {
 if (temp & 1<<(7-k)) LCD_Out(blue, 0);
 else LCD_Out(white, 0);
 }
 }
}

Conclusión

Usando este método para facilitar la generación de fuentes. Pudimos generar cinco conjuntos de números diferentes (0-9) en aproximadamente 45 monedas. Esperamos que esto le ayude con su próximo proyecto. No olvide incluir imágenes de sus nuevas fuentes en los comentarios.

  • Jon dice:

    Solo por curiosidad, ¿alguien usa la opción GIMP para exportar código / encabezados C? Si es así, ¿qué piensa sobre estos dos métodos?

  • svofski dice:

    Jon, uso la opción GIMP para exportar código / encabezados C. Es más útil que cualquier otra cosa, porque a diferencia de todo, un compilador GIMP y C siempre están a mano. El paquete de píxeles que se necesitaba, pero escribir código que reorganiza algunos bits, es más rápido que encontrar la herramienta adecuada que lo hace listo para usar.

  • svofski dice:

    Incorrecto ... quise decir "... el paquete de píxeles no siempre es el que se requiere ..."

  • robmora dice:

    Nunca miré realmente cómo están estructurados todos los formatos de archivo estándar, por lo que nunca presté atención a cuál es la convención, pero pensé que era extraño que los datos estuvieran empaquetados en una fila de 8 columnas. Cuando hice mis propias cosas así, las estructuré con columnas empaquetadas para que terminasen con alturas que fueran múltiplos de 8. Supuse que esto era más intuitivo, especialmente considerando que la mayoría de los controladores de LCD están configurados, pero seguro que puedo vea algunos beneficios para ambos.

  • Roma D dice:

    Utilicé el “LCD Font Maker” pero todavía tiene algunos problemas que me incitaron. Sin embargo, fue una herramienta útil cuando tuve que cambiar la pantalla LCD pero quería usar las fuentes antiguas, el controlador de la nueva pantalla LCD también tomó datos en formato original. Las coordenadas se ordenan por la parte inferior izquierda derecha superior y ordenan el desplazamiento de algunos píxeles, por lo que debajo de 0.0 era en realidad 4.2. Al final, todavía terminé tocando las fuentes editando manualmente las dieciséis tablas. Especialmente cuando haces escala de grises. Es simplemente imposible representar realmente cómo se verá en el monitor CRT de visualización LCD o incluso en otro monitor LCD. Puede verse bien en la pantalla y luego verse como @ $$ en la pantalla LCD.

  • nes dice:

    Esto es bueno, pero creo que ImageMagick o GraphicsMagick pueden hacer eso y ambos manejarán casi cualquier formato de imagen. Y con estos, puede rastrear cualquier fuente instalada en su sistema. Es posible que aún necesite algún script para formatearlo prolijamente como una matriz de encabezado / .asm y empaquetar los colores de su paleta, pero no estará limitado a solo bmps.

  • Pedro dice:

    Para Windows, un programa llamado The Dot Factory hace algo muy similar a esto.

  • AVR Freak dice:

    ¡Gracias por este tutorial detallado!

  • Quejándose dice:

    Microchip proporciona una buena herramienta en su biblioteca de gráficos que convierte fuentes TTF normales en tablas C o incluso en un compilador.

    Solo tienes que decidir la altura y luego copiar y pegar.

  • Sr. X dice:

    @Jon
    @svofski

    De echo. GIMP funciona perfectamente para mí.

  • M4CGYV3R dice:

    No sé si lo que está programando tiene capacidades de objeto, pero las matrices de variables estáticas son el diablo.

  • sneakypoo dice:

    Ingresaré esto tan pronto como pueda hacer que mi LCD muestre los colores apropiados 🙁

  • xchip dice:

    este complemento es mucho mejor 🙂

    http://codinglab.blogspot.com/2009/03/gimp-plugin-to-export-bitmaps-for.html

  • robmora dice:

    Dado que las publicaciones solicitan fotos, asumí que publicaría algunas de mis muestras (aunque a través de un proceso diferente).
    http://rob.mora-tek.com/img/fontsample.gif
    Esto explota a un tamaño doble, un total de 4 fuentes (las dos últimas son de diferentes tamaños de la misma fuente).

  • Harvie dice:

    ¿Alguna vez has oído hablar de XPM? Puede incluirlo en el código C.
    http://eo.wikipedia.org/wiki/X_PixMap

    gimp lo admite, simplemente haga clic en "guardar como" y escriba image.xpm para generar un formulario de nombre de archivo ...

  • Alberto de Nutchip Labs dice:

    Para aquellos con una caja de Windows, FontMaker es una descarga gratuita. Hace un buen trabajo al convertir fuentes TrueType y / o mapas de bits (incluidas las cuadrículas de caracteres) en títulos AVR-GCC C:

    http://www.eurekelettronica.it/prodotti/touch8/download/download.htm

  • ben nguyen dice:

    ¿Alguien sabe si hay una utilidad que pueda generar un archivo hexadecimal rgb de 16 bits (formato 5-6-5) a partir de una imagen bmp?

    Las únicas utilidades que he podido encontrar son la salida de un título de acción (no un archivo hexadecimal binario adecuado para arrancar), ¡o no son compatibles con 5-6-5 rgb!

  • Kiril Zyapkov dice:

    Procedimiento de exportación para Nokia 3310 LCD:

    http://1024.cjb.net/2009/11/graphics-nokia-3310-lcd-avr/

  • Kevin dice:

    Esta es una respuesta muy tardía a este hilo, pero podría ayudar a alguien ... echa un vistazo a este complemento de Python para el gimp:

    http://e2e.ti.com/support/microcontrollers/stellaris_arm_cortex-m3_microcontroller/f/473/t/67340.aspx

    Crea un título en C para una imagen de gimp y es bastante fácil de modificar para producir cualquier formato que desee.

Joel Carrasco
Joel Carrasco

Deja una respuesta

Tu dirección de correo electrónico no será publicada.