Implementando una Pantalla OLED 128x64 con SPI usando las librerías Adafruit_SSD1306 y Adafruit_GFX

Introducción

En este blog, emprenderemos un viaje a través del uso innovador de la popular pantalla OLED de 128x64 píxeles, incorporada con la comunicación SPI, para tu próximo proyecto de Arduino. Abordaremos cómo se pueden exhibir textos y cómo se pueden crear formas como rectángulos, líneas y círculos. Además, discutiremos el procedimiento para desplazar estos elementos gráficos y la forma de visualizar imágenes en la pantalla. Este amplio espectro de funcionalidades abre un sinfín de posibilidades para tus proyectos de Arduino.

Gracias a las librerías Adafruit_SSD1306 y Adafruit_GFX, el manejo de estas pantallas se vuelve increíblemente sencillo.

¿Por qué una Pantalla OLED?

Las pantallas OLED son visibles bajo casi todas las condiciones de iluminación y tienen un ángulo de visión extremadamente amplio. También son muy eficientes energéticamente, lo que las hace ideales para proyectos que funcionan con baterías.

Materiales Necesarios

  1. Arduino UNO
  2. Módulo de Pantalla OLED de 128x64 SSD1306
  3. Cables para conexiones 

Configuración del Hardware

Aquí te detallo cómo conectar estos pines a tu placa Arduino (en este ejemplo considero un Arduino UNO):

  1. Conecta el pin GND de la pantalla OLED al pin GND de la placa Arduino.
  2. Conecta el pin VCC de la pantalla OLED al pin 3.3V de tu placa Arduino
  3. Conecta el pin D0 de la pantalla OLED al pin 10 de Arduino.
  4. Conecta el pin D1 de la pantalla OLED al pin 9 en el Arduino.
  5. Conecta el pin RES de la pantalla OLED al pin 13 en el Arduino.
  6. Conecta el pin DC de la pantalla OLED al pin 11 en el Arduino.
  7. Conecta el pin CS de la pantalla OLED al pin 12 en el Arduino.

Configuración del Software

Instalación de las líbrerias 

La forma más sencilla de instalar las librerías es a través del administrador de librerías incorporado en el IDE de Arduino.

  • Abre el IDE de Arduino.
  • Haz clic en Sketch -> Include Library -> Manage Libraries....
  • En la ventana que se abre, escribe "Adafruit SSD1306" en la barra de búsqueda.
  • Localiza la entrada "Adafruit SSD1306" en los resultados y haz clic en "Install".
  • Repite el proceso para "Adafruit GFX Library".

Métodos más utilizados

La biblioteca Adafruit_SSD1306 tiene muchos métodos que puedes usar para dibujar en la pantalla. Estos son algunos de los más utilizados:

  1. clearDisplay(): Borra el contenido del búfer de la pantalla.
  2. drawPixel(x, y, color): Dibuja un píxel en la posición (x, y) con el color especificado.
  3. drawLine(x0, y0, x1, y1, color): Dibuja una línea desde (x0, y0) hasta (x1, y1) con el color especificado.
  4. drawRect(x, y, w, h, color): Dibuja un rectángulo con la esquina superior izquierda en (x, y), y con el ancho y alto especificado.
  5. fillRect(x, y, w, h, color): Dibuja un rectángulo lleno con la esquina superior izquierda en (x, y), y con el ancho y alto especificado.
  6. drawCircle(x, y, r, color): Dibuja un círculo con el centro en (x, y) y el radio r.
  7. drawBitmap(x, y, bitmap, w, h, color): Dibuja un bitmap en la ubicación (x, y) con el ancho y alto especificado.
  8. setCursor(x, y): Mueve el cursor a la posición (x, y).
  9. setTextSize(size): Establece el tamaño del texto.
  10. setTextColor(color): Establece el color del texto.
  11. println(text): Escribe el texto en la posición del cursor y luego mueve el cursor a la próxima línea.

Para más información, siempre puedes consultar la documentación oficial de Adafruit_SSD1306.

Creación de Bitmap

Image2cpp es una herramienta que facilita la integración de imágenes en tus proyectos de Arduino o Raspberry Pi, especialmente cuando se trabajan con pantallas monocromáticas como las OLED.

Cuando trabajas con este tipo de pantallas, las imágenes deben estar en un formato específico para poder ser mostradas correctamente. Este formato es usualmente una matriz de bytes, en la que cada byte representa un conjunto de píxeles en la pantalla.

Lo que hace image2cpp es tomar una imagen (en formato .bmp, .jpg, .png, etc.) y convertirla en una matriz de bytes que tu Arduino o Raspberry Pi pueden utilizar para mostrar la imagen en la pantalla. Lo que obtienes es un conjunto de datos que puedes copiar en tu código.

Para usar la herramienta image2cpp, sigue los siguientes pasos:

  1. Visita la herramienta Image2cpp: Puedes encontrar la herramienta en la siguiente dirección web: http://javl.github.io/image2cpp/

  2. Carga tu imagen: Haz clic en el botón "Load image" para seleccionar y subir la imagen que deseas convertir a una matriz de bytes. Asegúrate de que la imagen no es muy grande en términos de resolución para asegurar que cabe en la memoria de tu Arduino.

  3. Ajustar la configuración: En los ajustes, puedes cambiar el tamaño de tu imagen, cambiar el color del fondo y escalarla.

  4. Generar matriz de bytes: Luego, haz clic en "Generate code". Esto convertirá la imagen en una matriz de bytes que se puede usar en la placa Arduino o Raspberry Pi.

  5. Usar la matriz de bytes en tu código: Copia la matriz de bytes y pégala en tu código de Arduino o Raspberry Pi. La biblioteca Adafruit GFX o la biblioteca Adafruit SSD1306 pueden utilizar estas matrices de bytes para mostrar las imágenes en las pantallas OLED.

 

Código de Muestra

El código proporcionado a continuación demuestra varias funciones clave de las bibliotecas Adafruit_SSD1306 y Adafruit_GFX, incluyendo la visualización de texto, la creación de rectángulos, líneas, círculos, desplazamiento y visualización de imágenes en la pantalla.

Vamos a revisar cada sección de este código:

Primero, se incluyen las bibliotecas necesarias para manejar la pantalla:

 Luego, se definen las dimensiones de la pantalla y los pines en los que está conectada:

 A continuación, se crea una instancia de Adafruit_SSD1306 llamada display. Esta instancia se utilizará para manejar la pantalla: 

Luego, se define un bitmap para mostrar en la pantalla. En este caso, el bitmap es simplemente un array de bytes. Nota: este es un ejemplo, deberías reemplazar los valores para que representen la imagen que deseas mostrar.

En la función setup(), se inicializa la pantalla con display.begin(), y luego se llama a display.display() para mostrar la pantalla inicial de Adafruit. Después, se espera dos segundos con delay(2000).

En la función loop(), que se ejecuta en un bucle infinito, primero se borra el contenido de la pantalla con display.clearDisplay(). Luego se dibuja un rectángulo, un círculo y una línea, se configura el tamaño y el color del texto y se muestra un texto en la pantalla. Después de dibujar todo, los cambios se envían a la pantalla con display.display(), y se espera dos segundos con delay(2000).

A continuación, se inicia un desplazamiento hacia la izquierda de la imagen en la pantalla con display.startscrollleft(), se espera 4.5 segundos, y se detiene el desplazamiento con display.stopscroll(). Después, se borra la pantalla de nuevo, se dibuja el bitmap definido anteriormente, se actualiza la pantalla y se espera otros 4.5 segundos.

 

Selecciona tu placa y puerto en el IDE de Arduino y sube el código. En la pantalla OLED verás un rectángulo, un círculo, una línea y el texto "Tecneu". Después de 2 segundos, la pantalla se desplazará hacia la izquierda durante 4.5 segundos, se borrará y mostrará un bitmap definido en "TecneuLogo". Este ciclo se repetirá indefinidamente.

 

Expandiendo las Posibilidades

Tomando de base lo aprendido puedes hacer tus propios proyectos, aquí tienes algunas ideas:

  1. Monitor de clima: Usa sensores y conexión a internet para mostrar datos de clima en tiempo real.
  2. Juego de arcade: Programa juegos sencillos como Pong, Snake o Tetris.
  3. Reloj de Tiempo Real (RTC): Muestra el tiempo y la fecha usando un módulo RTC.
  4. Analizador de espectro: Muestra las frecuencias de los sonidos captados por un micrófono.

Conclusión

 

Te invitamos a que experimentes con las pantallas OLED y las librerías Adafruit_SSD1306 y Adafruit_GFX. Juega con las diferentes funciones, prueba diferentes configuraciones, y no dudes en dejar volar tu creatividad. ¡Estamos ansiosos por ver lo que puedes crear con estas herramientas! No olvides compartir tus experiencias y proyectos con nosotros. ¡Feliz programación!

 

Productos Relacionados

Ver artículo

Ver artículo

Display

Deja un comentario