¡Este Instructivo le muestra cómo agregar una pantalla táctil de alta resolución a su Arduino y hacer un sintetizador que controle LED de colores! ¡Las técnicas que aprendas aquí pueden servir de base para otros proyectos de pantalla táctil!

En este Instructable, aprenderás:

• Dónde obtener una pantalla táctil de alta resolución de 800x480.
• Cómo soldar unos encabezados en la pantalla táctil.
• Cómo imprimir en 3D y montar un soporte LCD (paso opcional).
• Cómo conectar la pantalla táctil a color al Arduino Uno.
• Cómo construir un conector de salida de línea a la pantalla táctil utilizando componentes pasivos.
• Cómo conectar una matriz de LED a tu Arduino.

Para este Instructable, necesitarás:

• Una pantalla táctil de alta resolución basada en un chip FT810 (consulte el siguiente paso para mi recomendación)
• Cabezales masculinos de 2x5 y 1x4 (puede comprarlos y cortarlos a medida)
• Un soldador
• Cinta eléctrica
• Cables de puente hembra a macho
• Cables de puente macho a macho.
• Un Arduino Uno
• Un tablero
• Un conjunto de LED WS2812 (obtuve un módulo 4x4 por aproximadamente $ 5 de eBay)
• Una resistencia de 220 ohmios y una resistencia de 100 ohmios, un condensador cerámico de 100 nF y un condensador de película delgada de 1 uF y un conector de audio de 3.5 mm.
• Un tablero
• Un Arduino Uno
• Un conjunto de altavoces amplificados para computadora o auriculares.

Créditos / Descargo de responsabilidad: Este proyecto hace uso del código de biblioteca con licencia GPL de libre acceso que trabajé mientras trabajaba en AlephObjects, fabricante de las impresoras 3D de código abierto LulzBot. Este proyecto y los videos asociados se realizaron en mi propio tiempo en casa, utilizando mi propio equipo.

Suministros:

Paso 1: La pantalla táctil utilizada en este Instructable

Para este Instructable, usaré pantallas táctiles de Haoyu Electronics. Utilicé lo siguiente:

• Pantalla táctil LCD gráfica de 5 ", 800x480, SPI, FT810

Esta pantalla cuesta alrededor de $ 36 con el envío. Esto es más que otras pantallas de Arduino, pero obtienes mucho por tu dinero:

• Un panel táctil nítido de alta resolución con una resolución de 800x480.
• Un coprocesador de gráficos integrado y una RAM permiten el control sin atascar el Arduino.
• Construido en sintetizador de audio con muestras de sonido de calidad y varios instrumentos para elegir.
• Soporte para paisaje y retrato (en el FT810 o superior).
• Soporte multitáctil.
• JPEG incorporado, decodificador de audio y video wave, para proyectos avanzados.

Paso 2: Preparando la pantalla

Una vez que obtenga su pantalla, necesitará soldar encabezados en ella. Las pantallas Haoyu son geniales porque vienen con orificios pasantes fáciles de soldar y usted tiene la opción de soldar el cabezal directamente en la parte posterior de la pantalla o en el extremo de un pequeño cable de cinta que se adhiere a una tabla extraíble desmontable.

Para completar el trabajo de soldadura, deseará desconectar temporalmente el cable de cinta y quitar la placa PCB de la parte posterior del panel. Use su uña para levantar suavemente el clip de retención en el conector LCD y liberar el cable de cinta. Luego, retire los cuatro tornillos que sostienen la tabla en su lugar.

Ahora suelde un encabezado 5x2 (o dos encabezados 5x1) donde le gustaría. Cubra la espalda con cinta aislante para evitar cortocircuitos. Luego, vuelva a atornillar la PCB y vuelva a conectar el cable de cinta.

Paso 3: Opcional: Imprima el soporte LCD y agregue inserciones de latón

Elegí imprimir en 3D un soporte para sostener mi panel LCD 1

El panel viene con cuatro inserciones de latón; Estos están destinados a ser prensados ​​en plástico con calor.A medida que se enfrían, los pequeños dientes en ellos muerden el plástico y evitan que se caigan. Estas inserciones son una forma común de agregar hilos duraderos a las piezas impresas en 3D.

Una vez que el soporte se terminó de imprimir, desenrosqué las cuatro inserciones de latón del panel.

Calenté mi plancha y la sostuve con la punta inclinada hacia arriba, balanceando suavemente un inserto en la punta. Luego puse la parte de plástico sobre ella y empujé lentamente los insertos en los orificios preformados hasta que quedaron al ras con la superficie.

Este paso funciona mejor si tiene un soldador con una punta cónica estrecha. Si nunca has hecho esto antes, es posible que desees practicar mientras la plancha está fría. ¡Solo tienes una oportunidad de hacerlo correctamente cuando la plancha está caliente!

Tenga cuidado con este paso ya que las inserciones de bronce se calientan mucho y no quiere que se caigan en su regazo. Trabaja en una superficie resistente al calor y si se caen de la punta de la plancha, resiste la tentación de alcanzarlos de inmediato.

1 Fuentes: LCD Stand STL y archivos CAD

Paso 4: Retire la película y monte la pantalla

Ahora, dé la vuelta a la pantalla y retire el marco de acrílico frontal, luego retire la película protectora del panel LCD (esto mejorará la claridad de la pantalla). Utilice los tornillos para montar la pantalla en el soporte impreso en 3D.

Paso 5: Soldar los encabezados al módulo LED

Use cortadores laterales para separar una longitud de cuatro pines de cabezales y soldarlos al módulo LED, como se muestra en la foto. También puede cortar la longitud de los cables de puente a la mitad y soldarlos directamente, si lo prefiere.

Paso 6: Conecta el circuito

Ejecute tres cables de puente del Arduino al módulo LED, de la siguiente manera:

• 5V a riel rojo en tablero de pruebas
• GND a riel negro en tablero de pruebas
• IN para pin ~ 5 en Arduino

Para la pantalla LCD, conecte:

• 5V a riel rojo en tablero de pruebas
• GND a riel negro en tablero de pruebas
• SCK para pin ~ 13 en Arduino
• MISO para pin ~ 12 en Arduino
• MOSI para pin ~ 11 en Arduino
• CS para pin ~ 10 en Arduino
• PD a pin ~ 9 en Arduino
• El AUDIO va al circuito de audio como se muestra en el tablero y el esquema
• GND va a la barandilla negra en el tablero.

Desde el Arduino:

• Pase un cable de puente desde el pin de 5V hasta el riel rojo en la placa de pruebas
• Pase un cable de puente desde el pin de GND hasta el riel negro en la placa de pruebas

Con el circuito de salida de audio completo, ahora puede conectar auriculares de auriculares o un conjunto de altavoces amplificados para computadora al conector de audio.

Diseño de la salida de audio:

La salida de AUDIO del panel de visualización es una señal digital que no está destinada a conducir un altavoz directamente. Intentar hacerlo podría dañar el panel o el altavoz. Para proporcionar una salida de audio adecuada, deberá construir un circuito de acondicionamiento que realice las siguientes tareas:

• Convierta la señal digital PWM (modulada en ancho de pulso) en una tensión analógica.
• Limita la corriente de salida y los voltajes a niveles seguros.

La tarea se puede realizar con dos resistencias y dos condensadores.

Revisé la hoja de datos del chip FTDI FT810 y encontré que el pin de AUDIO puede manejar hasta 16 mA a 3.3V. Esto significa que la carga debe tener una resistencia de no menos de 206 ohmios. Para proteger el pin contra un cortocircuito, comencé colocando una resistencia de 220 ohmios en serie con el pin AUDIO. Luego agregué otra resistencia de 100 ohmios a tierra para formar un divisor de voltaje. Cuando no hay nada conectado a la toma, esto reduce los 3.3V a un nivel de aproximadamente 1V, lo que es seguro para el audio de nivel de línea. La 100nF forma un filtro de paso bajo que suaviza el ruido PWM de alta frecuencia, mientras pasa las frecuencias de audio. El condensador 1uF restante se llama condensador de acoplamiento de CA. Bloquea la corriente de CC para que no fluya por el conector de audio, mientras deja pasar la señal de audio, que es CA, a través de.

Paso 7: Instalar la biblioteca FastLED y ejecutar el código

Descargue el archivo.zip que contiene el boceto de Arduino desde mi repositorio github.

Abra el IDE de Arduino y vaya a "Sketch" -> "Incluir biblioteca" -> "Administrar bibliotecas …". Instala la librería "FastLED" de Daniel Garcia. Luego, abra el archivo "RainbowPiano.ino" y cárguelo en su Arduino Uno.

Paso 8: Una descripción del código

El código hace uso de un marco de IU que desarrollé en C ++. Este marco le permite construir una interfaz a partir de una o más pantallas de la interfaz de usuario. La aplicación para piano solo tiene una pantalla, que se define mediante el siguiente código:

clase PianoScreen: public InterfaceScreen {… public: static void onEntry (); static void onRedraw (draw_mode_t what); static void onTouchStart (etiqueta uint8_t); vacío estático onIdle (); }; // Enumere todas las pantallas de su aplicación en la siguiente tabla SCREEN_TABLE {DECL_SCREEN (PianoScreen)}; SCREEN_TABLE_POST void PianoScreen:: onEntry () {// Código que se ejecuta cuando se muestra una pantalla} void PianoScreen:: onRedraw (draw_mode_t what) {// Código que se ejecuta para dibujar una pantalla} void PianoScreen:: onTouchStart (uint8_t tag) { // Código que se ejecuta cuando el usuario toca la pantalla} void PianoScreen:: onIdle () {// Código para las tareas que se ejecutan mientras la pantalla está activa}

De estos, el método más importante es onRedraw (). Pinta la interfaz de usuario llamando a los métodos en el Procesador de comandos Objeto, que envía comandos de dibujo al panel de visualización. El primer conjunto de comandos borra la pantalla con negro (0x000000):

CommandProcessor cmd; cmd.cmd (CLEAR_COLOR_RGB (0x000000)).cmd (CLEAR (true, true, true));

Luego, el código dibuja los botones de selección de instrumentos en la parte superior de la pantalla:

#define GRID_ROWS 8 #define GRID_COLS 6 cmd.font (font_small).fgcolor (negro).tag (241).button (BTN_POS (1,1), BTN_SIZE (1,1), F ("Piano"))

Hay un par de cosas a tener en cuenta aquí. Primero, la biblioteca de IU le permite diseñar la interfaz en una cuadrícula. En este caso, coloco mi interfaz en una cuadrícula de 6x8. A continuación, establezco la fuente y el color, seguido de una etiqueta.

Cada botón de interfaz está asociado con una etiqueta. Cuando un usuario hace clic en un botón, el onTouchStart () Se llama al método con esa etiqueta para que pueda realizar una acción apropiada para ese botón. La etiqueta precede al comando de botón, que envía las instrucciones para colocar el botón con la etiqueta "Piano" en la posición (1,1), mientras ocupa un espacio de 1x1 en la cuadrícula. El código para establecer las teclas del piano es similar, pero ocurre en un bucle.

Más adelante en el código, encontrará la función que responde al botón con la etiqueta 241 presionada:

void PianoScreen:: onTouchStart (tag uint8_t) {switch (tag) {caso 241: highlight_instrument = tag; instrumento = PIANO; descanso; …} onRefresh (); }

Cuando el usuario presiona un botón, el código modifica algunas variables para configurar el instrumento a PIANO y luego llamadas onRefresh () para actualizar la pantalla con el nuevo botón resaltado. El resaltado es realizado por el highlightCallback () función, que durante onRefresh () se llama a cada botón para permitirle cambiar los colores de los botones según sus etiquetas y el estado de resalte.

El código para reproducir sonidos es un poco diferente:

void PianoScreen:: onTouchStart (tag uint8_t) {switch (tag) {… predeterminado: // Código para configurar los colores de los LED … if (instrument == HIHAT) {// Estuche especial para notas de batería} else { // Sonido fuera de la nota sound.play (instrumento, NOTE_C3 + tag - 1); } highlight_note = etiqueta; } onRefresh (); }

Eso es todo para este rápido recorrido. ¡Espero que esta introducción sea suficiente para comenzar a diseñar sus propias interfaces gráficas para sus proyectos de Arduino!