Plataformas
En Lopaka, una plataforma es la biblioteca de dibujo o el entorno de ejecución de destino que recibe el código generado. Elegir una plataforma tiene tres efectos:
- Limita el editor al modelo de color y a las fuentes que entiende la biblioteca de destino.
- Define cómo trabaja el generador de código: cada plataforma produce su propia sintaxis y sus propias declaraciones.
- Determina qué ajustes de código están disponibles (función contenedora, declaraciones de variables, formato de exportación de imágenes, etc.).
La plataforma se elige al crear un proyecto y no se puede cambiar después: Ajustes del proyecto la muestra como solo lectura. Para trabajar con otra biblioteca, crea un proyecto nuevo con esa plataforma.
Elegir una plataforma
- OLED / LCD monocromática (SSD1306, SH1106, SSD1309): U8g2 o AdafruitGFX Mono
- TFT a color (ILI9341, ST7789, GC9A01): TFT_eSPI, ArduinoGFX o AdafruitGFX Color
- Interfaz táctil avanzada en ESP32/STM32: LVGL
- Flipper Zero / One: plataforma Flipper
- Dispositivo de hogar inteligente con ESPHome: ESPHome
- Pantalla e-paper: GxEPD2
- RP2040 / ESP32 con MicroPython: MicroPython
- Placa con CircuitPython: CircuitPython
- Solo maqueta o exportación de imagen: Free Drawing
Comparación de plataformas
| Plataforma | Salida | Modelo de color | Fuentes | Imágenes |
|---|---|---|---|---|
| U8g2 | C / C++ | Monocromo (1 bit) | BDF (amplia colección) | XBMP |
| TFT_eSPI / M5 / Lovyan | C++ | RGB565 | GFX | XBMP, RGB565 |
| AdafruitGFX Color | C++ | RGB565 | GFX | XBMP, RGB565 |
| AdafruitGFX Mono | C++ | Monocromo (1 bit) | GFX | XBMP |
| ArduinoGFX | C++ | RGB565 | GFX | XBMP, RGB565 |
| LVGL | C | RGB + alfa | Montserrat (TTF) | RGB565 |
| Flipper Zero / One | C | Monocromo (1 bit) | 4 fuentes fijas | XBMP |
| ESPHome | YAML + lambda de C++ | RGB | Google Fonts (TTF) | XBMP |
| MicroPython | Python | Monocromo (1 bit) | Fija (Petme 8×8) | Búfer sin procesar |
| CircuitPython | Python | RGB | Terminus (BDF) | Búfer sin procesar |
| GxEPD2 | C++ | Paleta indexada | GFX | XBMP |
| Free Drawing | — | RGB | Todas las fuentes | — |
Herramientas de dibujo
Las herramientas que aparecen en la barra de herramientas dependen de la plataforma activa. LVGL tiene un conjunto basado en widgets; las demás plataformas comparten un conjunto de primitivas de dibujo con pequeñas variaciones.
| Herramienta | U8g2 | TFT_eSPI | AdaGFX | AdaMono | ArduGFX | LVGL | Flipper | ESPHome | µPy | CPy | GxEPD2 |
|---|---|---|---|---|---|---|---|---|---|---|---|
| Línea | ✅ | ✅ | ✅ | ✅ | ✅ | — | ✅ | ✅ | ✅ | ✅ | ✅ |
| Rectángulo | ✅ | ✅ | ✅ | ✅ | ✅ | — | ✅ | ✅ | ✅ | ✅ | ✅ |
| Círculo | — | — | ✅ | ✅ | — | — | ✅ | ✅ | — | ✅ | ✅ |
| Elipse | ✅ | ✅ | — | — | ✅ | — | — | — | ✅ | — | — |
| Triángulo | ✅ | ✅ | ✅ | ✅ | ✅ | — | — | ✅ | ✅ | ✅ | ✅ |
| Polígono | ✅ | ✅ | ✅ | ✅ | ✅ | — | ✅ | ✅ | ✅ | ✅ | — |
| Arco | — | ✅ | — | — | — | — | — | — | — | — | — |
| Arco LVGL | — | — | — | — | — | ✅ | — | — | — | — | — |
| Texto | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
| Pintar | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
| Panel | — | — | — | — | — | ✅ | — | — | — | — | — |
| Botón | — | — | — | — | — | ✅ | — | — | — | — | — |
| Control deslizante | — | — | — | — | — | ✅ | — | — | — | — | — |
| Interruptor | — | — | — | — | — | ✅ | — | — | — | — | — |
| Casilla de verificación | — | — | — | — | — | ✅ | — | — | — | — | — |
| Área de texto | — | — | — | — | — | ✅ | — | — | — | — | — |
Giro de texto
U8g2, Flipper Zero / One, CircuitPython y LVGL admiten el giro nativo de texto en 0°, 90°, 180° o 270°. Selecciona una capa de texto y usa los botones de giro del inspector.
Plataformas
U8g2
Genera código para la biblioteca de pantallas monocromáticas U8g2. Produce código C++ (Arduino) o C (ESP-IDF).
Para ver la configuración y la integración completas, consulta la guía de U8g2.
Color: binario, blanco (1) o negro (0). Hay un modo de color invertido.
Fuentes: incluye una gran biblioteca de fuentes BDF. Los nombres de las fuentes se compilan como u8g2_font_<name>_tr.
Imágenes: mapas de bits XBMP declarados como arreglos image_<Name>_bits (U8X8_PROGMEM en Arduino), o extraídos a un archivo de recurso .h descargable.
Animaciones: se admiten las animaciones monocromáticas integradas.
Plantillas: Arduino (C++) y ESP-IDF (C), cada una con una opción progmem.
Inspector: el selector de color está oculto, porque el color siempre es binario (lo definen el relleno y la inversión, no un campo de color). Las capas de triángulo siguen la primitiva de U8g2 y siempre están rellenas, así que no muestran la opción de relleno.
Limitaciones: sin RGB. Sin tamaños de fuente personalizados: el tamaño de la fuente lo determina el archivo BDF.
TFT_eSPI / M5 / Lovyan
Cubre TFT_eSPI, M5Stack GFX y LovyanGFX, que comparten la misma API.
Para ver la configuración y la integración completas, consulta la guía de TFT_eSPI.
Color: RGB completo, empaquetado como RGB565 (0xRRGG).
Fuentes: las fuentes integradas de Adafruit más las fuentes GFX. Puedes subir fuentes TrueType (.ttf, .otf, .woff) y BDF propias, que se convierten al formato GFX al importarlas.
Imágenes: arreglos de píxeles XBMP (1 bit) o RGB565 (image_<Name>_bits / image_<Name>_pixels), incrustados o como archivos de recurso .h descargables. Los píxeles transparentes se rellenan con el fondo de la pantalla, salvo que la opción Transparencia de la imagen esté activada; en ese caso, una máscara de un bit los mantiene transparentes (tft.pushMaskedImage).
Arcos: la herramienta Arco genera arcos al estilo de TFT_eSPI con colores de primer plano y de fondo, ángulos y ancho configurables y bordes suavizados opcionales.
Plantillas: Arduino (C++) o ESP-IDF (C++). La plantilla de ESP-IDF prescinde de PROGMEM, millis() y setup() / loop(), y temporiza las animaciones con esp_timer_get_time().
Limitaciones: solo RGB565, sin alfa parcial: un píxel transparente es totalmente transparente (con Transparencia activada) o se rellena. La posición vertical de las fuentes GFX se ajusta automáticamente; comprueba la alineación si usas varias fuentes.
AdafruitGFX Color
Genera código para la Adafruit GFX Library en pantallas a color.
Color: RGB565.
Fuentes: las fuentes integradas de Adafruit más las fuentes GFX. Puedes subir fuentes TrueType (.ttf, .otf, .woff) y BDF propias, que se convierten al formato GFX al importarlas.
Imágenes: arreglos de píxeles XBMP o RGB565 (image_<Name>_bits / image_<Name>_pixels), incrustados o como archivos de recurso .h descargables. Los píxeles transparentes se rellenan con el fondo de la pantalla, salvo que la opción Transparencia de la imagen esté activada; en ese caso, una máscara de un bit los mantiene transparentes (drawRGBBitmap con máscara).
Animaciones: se admiten las animaciones monocromáticas integradas.
Plantillas: Arduino (C++) o ESP-IDF (C++). La plantilla de ESP-IDF prescinde de PROGMEM, millis() y setup() / loop(), y temporiza las animaciones con esp_timer_get_time().
Limitaciones: las declaraciones de fuentes duplicadas no se eliminan; revisa la salida si usas la misma fuente en muchas capas.
AdafruitGFX Mono
Igual que AdafruitGFX Color, pero para pantallas OLED/LCD monocromáticas (SSD1306, SH1106, etc.).
Color: binario, 1 (blanco) o 0 (negro). La paleta está fijada en #000000 / #ffffff.
Fuentes: la misma biblioteca de fuentes GFX que AdafruitGFX Color.
Borrado de pantalla: llama a clearDisplay() en lugar de fillScreen().
Animaciones: se admiten las animaciones monocromáticas integradas.
Plantillas: Arduino (C++) o ESP-IDF (C++). La plantilla de ESP-IDF prescinde de PROGMEM, millis() y setup() / loop(), y temporiza las animaciones con esp_timer_get_time().
Limitaciones: sin RGB. Sin escala de grises.
ArduinoGFX
Genera código para Arduino_GFX.
Color: RGB565, con el byte alto primero (a diferencia del orden de byte bajo primero de Adafruit).
Fuentes: las fuentes integradas de Adafruit más las fuentes GFX, con factor de escala personalizado. Puedes subir fuentes TrueType (.ttf, .otf, .woff) y BDF propias, que se convierten al formato GFX al importarlas.
Imágenes: arreglos de píxeles XBMP o RGB565 (image_<Name>_bits / image_<Name>_pixels), incrustados o como archivos de recurso .h descargables. Los píxeles transparentes se rellenan con el fondo de la pantalla, salvo que la opción Transparencia de la imagen esté activada; en ese caso, una máscara de un bit los mantiene transparentes (draw16bitRGBBitmapWithMask).
Plantillas: Arduino (C++) o ESP-IDF (C++). La plantilla de ESP-IDF prescinde de PROGMEM, millis() y setup() / loop(), y temporiza las animaciones con esp_timer_get_time().
Limitaciones: las mismas restricciones de RGB565 que TFT_eSPI. Por la diferencia en el orden de bytes con Adafruit, los colores salen mal si copias mapas de bits entre ambas plataformas.
LVGL
Genera código para LVGL, una biblioteca de GUI embebida con muchas funciones.
Color: RGB completo. Las imágenes RGB conservan sus píxeles transparentes mediante un plano alfa (RGB565A8) cuando la opción Transparencia de la imagen está activada. Los colores se codifican como lv_color_hex(0xRRGGBB).
Fuentes: Montserrat TTF en cualquier tamaño.
Widgets: además de las formas primitivas, admite paneles, botones, controles deslizantes, interruptores, casillas de verificación, áreas de texto y widgets de Arco LVGL. Los valores predeterminados de los widgets (radio, borde, color de fondo) coinciden con los de LVGL v9.
Renderizado: el editor usa un renderizado suavizado (antialiasing) del lienzo para aproximarse al resultado de LVGL.
Imágenes: descriptores de imagen RGB565 (lv_image_dsc_t) compatibles con v9, descargables como archivo de recurso <Name>.c.
Limitaciones:
- En el selector de fuentes solo está disponible Montserrat
- No se admiten widgets personalizados: cada capa corresponde a una sola llamada a
lv_obj_create - El código generado usa la API de C de LVGL (v9)
Flipper Zero / One
Genera código para la API de lienzo de la GUI de Flipper Zero y Flipper One (canvas_draw_*).
Color: monocromo. En el editor, el color de dibujo predeterminado es negro sobre fondo naranja.
Fuentes: solo cuatro fuentes fijas: FontPrimary (Helvetica 8 bold), FontSecondary (Haxrcorp 4089), FontKeyboard (ProFont 11) y FontBigNumbers (ProFont 22). Sin tamaños de fuente personalizados.
Pantallas predefinidas: Zero Horizontal (128×64), Zero Vertical (64×128), One Horizontal (256×144), One Vertical (144×256).
Imágenes: mapas de bits XBMP (image_<Name>_bits), incrustados o como archivo de recurso .h independiente y descargable con arreglos uint8_t.
Animaciones: se admiten las animaciones monocromáticas integradas e importadas. La salida generada incluye funciones auxiliares de reproducción y encabezados C descargables con los fotogramas XBM.
Limitaciones:
- Monocromo
- Sin fuentes personalizadas
ESPHome
Genera la lambda del componente display de ESPHome.
Para ver el recorrido completo desde el diseño hasta la grabación en el dispositivo, consulta la guía de ESPHome.
Salida: YAML con lambdas de C++ incrustadas. El editor Ace usa resaltado de sintaxis YAML.
Color: RGB completo, codificado como Color(R, G, B).
Fuentes: Google Fonts mediante gfonts:// y otras fuentes TTF. Las declaraciones de fuentes van en la clave YAML de nivel superior font:.
Imágenes: recursos PNG descargables (<Name>.png) a los que el YAML hace referencia como images/<Name>.png y que se declaran como imágenes BINARY. Coloca los archivos PNG en una carpeta images/ junto al YAML.
Sin esquinas redondeadas: la API de pantallas de ESPHome no tiene una primitiva de rectángulo redondeado.
Limitaciones: solo XBMP, sin exportación de mapas de bits RGB. Los bloques font: e image: deben estar en la raíz del YAML, no dentro de la cadena lambda:.
MicroPython
Genera código para el módulo framebuf de MicroPython en RP2040, ESP32 y placas similares.
Driver: el código generado espera el driver PerfecXX MicroPython-SSD1306, cuyo objeto display expone su framebuffer como display.framebuf y agrega display.polygon. Las elipses se dibujan con display.framebuf.ellipse(...), así que la vista previa del editor coincide píxel a píxel con el dispositivo. El ssd1306.py estándar de micropython-lib no tiene display.framebuf y falla con elipses, triángulos y polígonos.
Salida: Python. El editor Ace usa resaltado de sintaxis Python.
Color: monocromo, 1 (blanco) o 0 (negro). La paleta está fijada en blanco y negro.
Fuentes: una sola fuente integrada (Petme 8×8). El selector de fuentes no está disponible.
Imágenes: búferes bytearray sin procesar (1 bit empaquetado, por filas) o un recurso .pbm descargable (image_<Name>_bits.pbm) que Incluir archivos de imagen carga al iniciar.
Limitaciones:
- Monocromo
- Solo está disponible la fuente integrada Petme 8×8
- No se admiten esquinas redondeadas
- Menos primitivas de dibujo que en otras plataformas
- Los triángulos solo se dibujan con contorno
CircuitPython
Genera código para el conjunto displayio y vectorio de CircuitPython.
Salida: Python. El editor Ace usa resaltado de sintaxis Python.
Color: RGB, codificado como hexadecimal de 24 bits (0xRRGGBB).
Fuentes: incluye la fuente BDF Terminus. El selector de fuentes no aparece en la interfaz: la fuente es fija.
Imágenes: recursos displayio.OnDiskBitmap (image_<Name>_bits.bmp) que se cargan desde el sistema de archivos del dispositivo.
Limitaciones:
- La fuente está fijada en Terminus BDF
- Los píxeles de las imágenes están en los archivos
.bmpdescargados: cópialos junto a tu código
GxEPD2
Genera código para la biblioteca de pantallas e-paper GxEPD2. Extiende AdafruitGFX.
Color: paleta indexada de 9 constantes con nombre: GxEPD_BLACK, GxEPD_WHITE, GxEPD_DARKGREY, GxEPD_LIGHTGREY, GxEPD_RED, GxEPD_YELLOW, GxEPD_BLUE, GxEPD_GREEN, GxEPD_ORANGE. Los colores fuera de esta paleta se convierten en GxEPD_BLACK.
Fuentes: las fuentes integradas de Adafruit más las fuentes GFX (heredadas de la plataforma Adafruit). Puedes subir fuentes TrueType (.ttf, .otf, .woff) y BDF propias, que se convierten al formato GFX al importarlas.
Imágenes: solo XBMP, descargable como archivo de recurso .h.
Fondo: fondo gris claro (#f8f8f8) en el editor para aproximarse al blanco del e-paper.
Limitaciones: la paleta es fija, sin colores hexadecimales arbitrarios. El editor no simula la actualización parcial ni los modos de actualización.
Free Drawing
Un modo solo de diseño, sin exportación de código. Es útil para maquetas y para compartir diseños sin apuntar a una biblioteca concreta.
Color: RGB completo.
Fuentes: están disponibles todas las fuentes TTF, BDF y GFX.
Código: sin salida. El panel de código está vacío.
Limitaciones: no se puede usar para generar código. No admite importación.