Mostrar código QR en la pantalla OLED con Esptop 10 usando Arduino IDE
Esta lección incluye los siguientes temas:
- 1: Introducción a la pantalla OLED
- 2: Módulo de pantalla OLED de cableado a ESP32
- 3: Instalación de bibliotecas requeridas
- 4: Verifique la dirección de la pantalla OLED I2C
- 5: Muestre el código QR en la pantalla OLED con ESP32 usando Arduino IDE
- 5.1: Crear un código QR
- 5.2: convertir el código QR en código hexadecimal
- 5.3: código
- 5.4: Muestra de código Arduino para la pantalla de imagen del código QR
- 5.5: salida
- 5.6: Escanear el código QR de la pantalla OLED
1: Introducción a la pantalla OLED
Antes de avanzar primero debemos saber qué es una pantalla OLED. Oleado (Diodo emisor de luz orgánico) Las pantallas se utilizan como alternativa a las LCD. Los LED OLED se utilizan para producir pantallas de luz en pantallas OLED. La pantalla LCD utiliza la luz de fondo para iluminar sus píxeles, mientras que las pantallas OLED tienen sus propios LED emisivos. Hay cientos de LED a sí mismos. Para mostrar imágenes y el brillo del texto de estos LED se puede controlar Pixel por Pixel.
Ahora, como conocemos algunos conceptos básicos relacionados con la pantalla OLED. El siguiente paso es cablear ESP32 con un módulo de pantalla OLED.
2: Módulo de pantalla OLED de cableado a ESP32
La pantalla OLED viene principalmente con dos protocolos de comunicación diferentes. Los dos protocolos son I2C y SPI. La interfaz periférica en serie (SPI) es generalmente más rápida que I2C, pero preferimos I2C sobre el protocolo SPI, ya que requirió menos número de alfileres.
La siguiente imagen ilustra el diagrama de conexión ESP32 con 128 × 64 píxeles (0.96 ") Pantalla OLED.
A continuación se muestra la tabla de conexión:
Una vez que ESP32 está interactuado con una pantalla OLED, el siguiente paso en la lista es instalar todas las bibliotecas requeridas para la programación ESP32 utilizando Arduino IDE.
3: Instalación de bibliotecas requeridas
Múltiples bibliotecas están disponibles en Arduino IDE para programar ESP32 con una pantalla OLED. Aquí usaremos dos bibliotecas de AdaFruit: SSD1306 y GFX Library.
Ahora en el Arduino IDE Open Library Manager y busque la Biblioteca OLED SSD1306. Instale la biblioteca SSD1306 por Adafruit desde la barra de búsqueda.
Alternativamente, uno también puede ir a: Sketch> incluir biblioteca> Administrar bibliotecas
La próxima biblioteca que necesitamos instalar es el Biblioteca GFX por Adafruit.
Después de que ambas bibliotecas se instalen correctamente, el siguiente paso es verificar la dirección I2C donde está conectado ESP32.
4: Verifique la dirección de la pantalla OLED I2C
I2C significa Comunicación de circuitos interintegrados. Usando i2c podemos interactuar múltiples dispositivos en 2 cables. Sin embargo, al conectarlos, cada dispositivo I2C debe usar una dirección I2C separada. Esta dirección varía de 0 a 127. Por ejemplo, si tenemos dos dispositivos I2C diferentes que usan la misma dirección I2C, no se pueden conectar en la misma línea I2C.
Es importante verificar primero la dirección I2C. Para verificar la dirección I2C de la pantalla OLED conectada conectada ESP32 con PC, cargue el código dado en el artículo Verifique la dirección I2C usando Arduino IDE.
Después de cargar el código, aparecerá la siguiente salida. Aquí en nuestro caso, la pantalla OLED está conectada a la dirección I2C (0x3c).
Usaremos la dirección I2C mencionada para la pantalla OLED en el código Arduino.
5: Muestre el código QR en la pantalla OLED con ESP32 usando Arduino IDE
El primer paso que se necesita para mostrar cualquier código QR en una pantalla OLED es convertir la imagen del código QR en un código hexagonal. Usando cualquier imagen en línea para convertidor hexagonal podemos obtener el código hexadecimal contra una imagen.
Pero antes de eso primero tenemos que crear una muestra de código QR.
1: Crear un código QR
Para crear el código QR múltiples herramientas gratuitas en línea disponibles. Aquí hay un texto gratuito para el generador de código QR.
Usando esta herramienta, cualquier texto o enlace se puede convertir en código QR. Aquí creamos un código QR para la dirección del sitio web de Linuxhint.
2: convertir el código QR en código hexadecimal
Para convertir cualquier código QR en código hex. Ahora siga los pasos para obtener el código hexadecimal para su imagen de código QR.
Paso 1: Haga clic aquí para visitar el convertidor gratuito Image2Cpp.
Paso 2: Seleccione la imagen del código QR que queremos mostrar en OLED.
Paso 3: Después de seleccionar la imagen del código QR, haga clic en Abrir.
Etapa 4: En la configuración de la imagen establece las dimensiones en 128 x 64. El brillo se puede establecer de acuerdo con el número de imagen recomendado en algún lugar alrededor de 150.
Escala la imagen del código QR según el tamaño y la referencia, consulte la vista previa de salida.
Paso 5: Ahora establezca el formato de salida del código en el código Arduino y prefijo como mapa de bits. Después de eso, haga clic en Generar código. El código hexadecimal de salida se puede copiar desde la ventana de salida.
Reemplace el código hexadecimal copiado en el código de muestra Arduino IDE que se proporciona a continuación.
3: código
Ahora abra el IDE Arduino y pegue el siguiente código. Recuerde reemplazar el código hexadecimal con el de la imagen del código QR que debe mostrar en una pantalla OLED.
/****** Linuxhint.Com ********/
#incluir
#incluir
#incluir
#define screen_width 128
#define screen_height 64
AdaFruit_SSD1306 Display (Screen_Width, Screen_height, & Wire, -1);
estatic const uint8_t image_hex_array [1024] =
0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x7f, 0x00, 0x60, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x7f, 0x00, 0x60, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x7f, 0x00, 0x60, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x60, 0x0c, 0x61, 0xff, 0xf1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x60, 0x0c, 0x61, 0xff, 0xf1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x00, 0x61, 0x80, 0x71, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x7f, 0x00, 0x61, 0x80, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x7f, 0x00, 0x61, 0x80, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x7c, 0x61, 0x80, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x7c, 0x61, 0x80, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x7c, 0x61, 0x80, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x7c, 0x7c, 0x61, 0x80, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x7c, 0x7c, 0x61, 0x80, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x7c, 0x7c, 0x61, 0x80, 0x71, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x63, 0xe3, 0xe1, 0xff, 0xf1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x63, 0xe3, 0xe1, 0xff, 0xf1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x63, 0x80, 0x60, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x63, 0x0c, 0x60, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x63, 0x0c, 0x60, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xfc, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xfc, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xfc, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x1c, 0x03, 0xe3, 0x8c, 0x71, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x1c, 0x03, 0xe3, 0x8c, 0x71, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x18, 0x03, 0xe1, 0x0c, 0x71, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x1f, 0x03, 0x1c, 0x00, 0x0c, 0x70, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x1f, 0x03, 0x1c, 0x00, 0x0c, 0x70, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x1f, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0x1c, 0x7f, 0x0c, 0x60, 0x0c, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0x1c, 0x7f, 0x0c, 0x60, 0x0c, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x1f, 0x03, 0xff, 0x00, 0x60, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x1f, 0x03, 0xff, 0x00, 0x60, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x1f, 0x03, 0xff, 0x00, 0x60, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0xe0, 0x1f, 0xfc, 0x0f, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0xe0, 0x1f, 0xfc, 0x0f, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0xe0, 0x1f, 0xfc, 0x0f, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xe3, 0x0c, 0x0c, 0x70, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xe3, 0x0c, 0x0c, 0x70, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0xe3, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x63, 0x03, 0xe0, 0x0f, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x63, 0x03, 0xe0, 0x0f, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x7c, 0x7f, 0x81, 0x8f, 0xf1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x7c, 0x7f, 0x81, 0x8f, 0xf1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x7c, 0x7f, 0x81, 0x8f, 0xf1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x03, 0xe1, 0xf0, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x03, 0xe1, 0xf0, 0x31, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x00, 0x03, 0xf0, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x63, 0xfc, 0x0f, 0xf0, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x63, 0xfc, 0x0f, 0xf0, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x7c, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x7c, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xe0, 0x1c, 0x60, 0x7c, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x63, 0x0c, 0x0f, 0x81, 0x81, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xfc, 0x63, 0x0c, 0x0f, 0x81, 0x81, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0xff, 0xf8, 0x63, 0x1c, 0x0f, 0x81, 0x81, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x60, 0x7c, 0x7f, 0xff, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0x60, 0x7c, 0x7f, 0xff, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xf8, 0x00, 0x00, 0xe0, 0xfc, 0x7f, 0xff, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff
;
setup () void
De serie.comenzar (115200); // tasa de baudios para la comunicación en serie
si(!mostrar.begin (SSD1306_SWITCHCAPVCC, 0x3c))
De serie.println (f ("fallado de asignación SSD1306"));
para(;;);
retraso (2000); // retraso 2 segundos
mostrar.ClearDisplay (); // borrar el búfer de visualización
mostrar.drawBitMap (0, 0, image_hex_array, 128, 64, 1);
mostrar.mostrar();
bucle void ()
Código iniciado por la importación de las bibliotecas necesarias que instalamos anteriormente. Dos bibliotecas incluyen el cable y la biblioteca de Adafruit. Las bibliotecas de cable nos permiten usar I2C, mientras que AdaFruit ayuda a mostrar el texto escrito en la pantalla.
El siguiente comando siguiente está escrito:
AdaFruit_SSD1306 Display (Screen_Width, Screen_height, & Wire, -1);
Contiene el Screen_width y Screen_height variables. Usando estas variables, definimos el tamaño de la pantalla OLED. Aquí estamos usando una pantalla OLED de 128 × 64. Después &Cable El objeto se define para la visualización.
El último parámetro contiene (-1), Esta pantalla que la pantalla OLED que estamos utilizando no tiene un botón de reinicio externo. En caso de que tengamos un botón de reinicio en la pantalla OLED. Pasaremos este parámetro a un pin GPIO. Después de presionar el botón de reinicio, la pantalla OLED mostrará el texto.
En el medio del código, incluimos el código hexadecimal para la imagen del código QR y después de eso inicializamos la comunicación I2C en la dirección I2C (0x3c) se define que hemos encontrado anteriormente usando el código de escaneo I2C.
En las últimas líneas de código, la matriz hexadecimal se imprime en OLED usando la función de mapa de bits.
4: Muestra de código Arduino para la pantalla de imagen del código QR
Aquí hay un código dado para la interfaz OLED con ESP32. Debe reemplazar el código hexadecimal de la imagen del código QR que desea mostrar en la pantalla.
/****** Linuxhint.Com ********/
#incluir
#incluir
#incluir
#define screen_width 128
#define screen_height 64
AdaFruit_SSD1306 Display (Screen_Width, Screen_height, & Wire, -1);
estatic const uint8_t image_hex_array [1024] =
/*******
*******
*******
[Peque el código hexadecimal para la imagen aquí]
*******
*******
*******/
;
setup () void
De serie.comenzar (115200); // tasa de baudios para la comunicación en serie
si(!mostrar.begin (SSD1306_SWITCHCAPVCC, 0x3c))
De serie.println (f ("fallado de asignación SSD1306"));
para(;;);
retraso (2000); // retraso 2 segundos
mostrar.ClearDisplay (); // borrar el búfer de visualización
mostrar.drawBitMap (0, 0, image_hex_array, 128, 64, 1);
mostrar.mostrar();
bucle void ()
5: salida
Aquí en la salida, podemos ver el código QR que se muestra en la pantalla OLED. Este es el mismo código QR que convirtimos en código hexadecimal antes.
Hemos mostrado con éxito una imagen de código QR en una pantalla OLED I2C. Usando los mismos pasos, cualquier código QR con proporción correcta se puede mostrar en una pantalla OLED.
6: Escanear el código QR de la pantalla OLED
Una vez que se muestra el código QR, el último paso es verificar si está funcionando o no para que ese teléfono inteligente se use. La mayoría de los teléfonos inteligentes vienen con un escáner de código QR preinstalado si no está disponible, se puede descargar fácilmente desde la App Store.
Ahora coloque la cámara en el código QR.
Si se escanea con éxito, aparecerá el siguiente texto. Este es exactamente el mismo texto que guardamos al crear el código QR.
Conclusión
Una pantalla OLED es una excelente manera de mostrar salidas sin necesidad de un monitor o PC en serie. Las pantallas OLED vienen con dos protocolos diferentes I2C y SPI. Se prefieren las pantallas OLED I2C debido a un menor número de cables. La pantalla OLED se puede utilizar para mostrar información en la pantalla como el código QR o el código de barras utilizando. Esta lección proporciona todos los pasos requeridos para mostrar una imagen de código QR en una pantalla OLED I2C con ESP32 usando el Arduino IDE.