http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 1 1.3. DISPLAYS • 30 Display de 7 segmentos. • 31 Display de 7 segmentos y 4 dígitos. • 32 Display con interface. • 33 Displays LCD. • 34 El bus I2C y los displays LCD. • 35 Las barras de LEDs LCD • 36 Operaciones con bits. • 37 Matriz LED de 8×8. • 38 El bus SPI • 39 Matriz LED 8×8 con MAX7219 y SPI • 39B Scrolling mensajes con grupos de MAx7219 • Grupo de 4 matrices LED 8×8 con SPI • 40 Display TFT SPI de 1.8″. • 41 Display Nokia 3310. • 42 Display OLED de 0.96″. • 43 Gráficos y OLED 0.96” 128×64. • 44 Usando un display TFT de 320×240. • 45 TFT de 3.2″ con panel tactil. • 46 Display Nokia 5110. • Shield TFT LCD 3.5″ táctil para Arduino Mega https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 2 30-DISPLAY DE 7 SEGMENTOS Mostrando informacion numérica Home Display De 7 Segmentos OBJETIVOS • o Nuestro primer display numérico de 1 digito. o Mas sobre los arrays. MATERIAL REQUERIDO. Arduino Uno o similar. Esta sesión acepta cualquier otro modelo de Arduino. Una Protoboard. Cables de protoboard Una resistencia. Un display de 1 dígito. https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 3 LOS DISPLAYS LED En cuanto empecéis a plantearos hacer un circuito que realice alguna función práctica, hay un 50% de probabilidades de que acabéis necesitando enviar información al mundo exterior (y claro no vais a dejar vuestro portátil pegado al invento). Así que es el momento de ver que nos ofrece el mercado para mostrar información y para empezar, nada mejor que un sencillo display LED de 1 digito. Los diodos LED ya no guardan secretos para los que nos siguen, pero esto de un display parece otra cosa. Pues no. Es lo mismo pero en lugar de ser un punto luminoso como los familiares LED, tiene forma de barra: 7 barras más 1 punto. Estos displays nos son bastante familiares en despertadores y similares, están formados por 7 líneas, que a dependiendo de qué segmentos se iluminan, muestran los dígitos del 0 al 9. A cada uno de los 7 segmentos se les adjudica una letra para representarlos y suele ser a, b, c, e, f, g y aparte un punto (o dos, o dos puntos según el fabricante) y es un buen momento para echar un vistazo a las especificaciones de cada fabricante para estar seguros de que pin es cual. Todos los circuitos, los displays incluidos, llevan un código de fabricante rotulado. Es buena política buscar en internet la hoja de especificaciones(o data sheet) y echarle un ojo. Si no entendéis nada, es lo normal de momento, pero desde luego habrá un dibujo diciéndoos que es cada pin. Yo he buscado el modelo que tengo delante, (un Kingbright SC08-11HWA ), pero no os fieis, el vuestro puede ser distinto. https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 4 • Desde que existe Internet, localizar una hoja de características es algo trivial (No como antes, que para conseguirlas había que pedir favores y mostrar las debidas muestras de respeto y sumisión a quien disponía de catálogos de componentes). • Probad a buscar en Google algo así como XXXXX data sheet, donde XXXXX son los códigos que habéis encontrado rotulado en el display o componente que sea. Lo importante es que sepáis que es cada pin, y que veáis que segmento es cual. En realidad es bastante más fácil de lo que parece, localizad primero un GND. En el de arriba son el 3, 5, 11 y 16. Poned una resistencia (de 330Ω como siempre) de la salida del display a GND. Este es un display de cátodo común, o sea que todos los LEDS comparten la masa, pero necesitamos poner una resistencia de limitación o fundiréis el display, y este vale ya lo suficiente, como para que os cueste verle la gracia al tema. Una vez que hayáis conectado la masa común con una resistencia, empezad cableando solo un LED, el a por ejemplo y conectadlo al pin 2 de Arduino. Escribid un programa en Arduino para iluminar el LED en el pin 2 y veréis como se enciende el segmento a. Podéis ir conectando y probando el resto de los pines poco a poco, asegurando las conexiones. Es muy fácil equivocarse si no andáis con tiento. https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos El pin numero 1 es en la parte inferior el primero por la izquierda.http://www. y luego ir contando en el sentido contrario a las agujas del reloj.youtube. https://www.net Para los que uséis el nuevo kit de inicio de Prometec. poner el display de modo que viendo los numeros el punto decimal quede abajo a vuestra derecha.prometec.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 5 Kit de Inicio Prometec.net/curso-kit-inicio/ http://www. el display que viene es un 5161AS que tiene un patillaje y cuyo diagrama es este: Para saber cual es el pin 1.prometec. OUTPUT). http://www.net/indice-tutoriales 6 ESQUEMA ELÉCTRICO DEL CIRCUITO El circuito no puede ser más sencillo. porque es difícil dejarlo más claro PROGRAMA DE CONTROL Tenemos que comprobar que las conexiones son correctas lo primero. • Es importante que sigáis el esquema de aquí encima para que luego el programa coincida con vuestras conexiones. i++) pinMode(i.net/curso-kit-inicio/ http://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . • Por eso no es importante que pin de vuestro display es el segmento C (Que dependerá del fabricante y modelo). https://www. pero si que es importante que el segmento C vaya al pin digital 4 de Arduino y lo mismo para los demás.prometec.prometec. son como cuando hicimos un circuito con 8 diodos. Probad esto: void setup() { for (int i = 2. i<11. No vamos a incluir el diagrama de protoboard. solo que esta vez los 8 diodos están en una cajita y con forma para dibujar números.youtube. lo más rápido es hacerte una tabla para ver que segmentos tienes que iluminar para cada digito decimal.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . inicializamos los 8 pines de salida con for (recordar que somos vagos) y en el loop usamos una primera iteración que va iluminando los 8 segmentos con un delay. } for ( int j= 2. j<11 .http://www.prometec.net/curso-kit-inicio/ http://www. HIGH). DIGITO A B C D E F 0 1 1 1 1 1 1 1 0 1 1 0 0 0 2 1 1 0 1 1 0 3 1 1 1 1 0 0 https://www.Vereis algo así: Lo siguiente es mostrar los dígitos del 0 al 9. delay(400) . LOW).youtube.prometec.net/indice-tutoriales 7 } void loop() { for ( int j= 2. j++) // Va encendiendo los segmentos { digitalWrite(j. j<11 . Para ello. y vas apuntando cuales son 1 (encendido) o 0 (apagado). y en la segunda los borra y vuelta a empezar. La idea es comprobar que las conexiones son correctas. } En el setup. j++) //Apaga todos los segmentos digitalWrite(j. delay(400) . para aseguraros de que entendéis la idea Ahora solo queda escribir el programa que dibuja los números en el display. digitalWrite(5. } Es decir.1). https://www.1).0). haced la prueba con alguno de los dígitos.net/indice-tutoriales 8 DIGITO A B C D E F 4 0 1 1 0 0 1 5 1 0 1 1 0 1 6 1 0 1 1 1 1 7 1 1 1 0 0 0 8 1 1 1 1 1 1 9 1 1 1 0 0 1 • Aunque os damos los deberes hechos. // Si.prometec. Por ejemplo podríamos hacer: void Display7() { digitalWrite(2.. …………. podemos decir 1 y 0 en lugar de HIGH y LOW digitalWrite(3. así que vamos a ello.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . simplemente. http://www.prometec. digitalWrite(4. PROGRAMA QUE DIBUJA LOS DÍGITOS La primera idea que se nos ocurre a todos es hacer una función por cada digito que queramos representar.net/curso-kit-inicio/ http://www. 1) . encendemos los pines correspondientes a cada segmento a imagen de la tabla previa. 0 }. Así que vamos a buscar otra solución más elegante.1.1.prometec. Vamos a empezar definiendo el array de dos dimensiones (porque es una tabla. nos gustan las soluciones elegantes (y porque.0.1.1.0.1. // 0 { 0.1. no tenemos comisiones por vender los arrays) y veréis que el programa se simplifica mucho. // 1 { 1. con los segmentos que hay que iluminar. hayáis pensado que se parece sospechosamente a un array de 10 x 8 podéis anotaros un punto por listos.0.1.1. pero en un array de 10 elementos.net/indice-tutoriales 9 El problema de este enfoque es que hay que hacer 10 funciones como esta y luego escribir en el programa principal algo que llame a la función correspondiente según el número que queramos mostrar.0.1.1. de nuevo.1. cada uno de los cuales es un array de 8(segmentos). Si os fijáis. además.0. La sintaxis es más o menos complicada.1.0 } // 9 }. como con todo en la vida.0. otra cosa son el número de elementos por dimensión): byte Digit[10][8] = // Arduino UNO va muy justo de memoria.0 }.1.0 }.1. // 3 { 0. // 2 { 1.0.1.youtube.1.1.1.0.1.0 }.net/curso-kit-inicio/ http://www.0.1. aquí no permitimos esas cosas.0 }. Por eso lo { // definimos como byte y no como int { 1.1.1.0. pero no hay más y esto ya lo habíamos hecho antes.0. https://www. // 7 { 1.1.1.0. para ser alguien en la comunidad freaky.0 }.0 }.0.0. si queréis ser programadores es muy importante que empecéis a adoptar las poses del gremio.prometec.0.0.0. Porque por supuesto vamos a crear una array con todo eso (No.1.1. http://www. la solución de fuerza bruta y no. somos muy vagos y nos cansamos solo de pensar en hacerlo así).1. • Por cierto.1.1.0.1.1.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .1.1. he copiado directamente la tabla de mostrar los dígitos. es mucho más fácil de lo que parece.1. hay que hablar de la elegancia de tu código siempre que surja la ocasión. // 5 { 1.1. // 6 { 1.1. Esta es. todos los que al ver la última tabla.0. De nuevo. // 4 { 1.0.0 }. Para empezar. // 8 { 1.1.1.1.0 }.1. elija la fila del array en función de ese mismo número y busque el array interno correspondiente. } void loop() { for ( int k=0 . OUTPUT). } } https://www. } } Buscamos valor en la tabla cuyo índice principal N apunta al array interno correspondiente. k<10 . i++) pinMode(i. los digitos { Display(k). k++) // Llama a Display para k de 0 a 9.prometec. i<8 . delay(1000). valor) .http://www. i<11. que lo calculamos como i +2. digitalWrite(pin . (Porque usamos los pines 2 al 10 para conectar los segmentos del display y así unos valores de 1 de 0 a 8 se convierten en pines de 2 al 10). i++) { int valor = Digit[N][i] .prometec. int pin = i+2.net/indice-tutoriales 10 Podemos ahora crear una función. va leyendo los 8 elementos del array para escribirlos en el pin correspondiente de salida.youtube.net/curso-kit-inicio/ http://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . que pasándole un número de 0 a 9. void Display(int N) { for (int i= 0 . El for i. void setup() { for (int i= 2. com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . int pin = i+2. i<8 . se transforma en una nimiedad recorriendo la tabla. • Como esta sesión ya es suficientemente densa. // digitalWrite(i+2 . era muy pesado. colgamos el ejemplo en la página web.net/curso-kit-inicio/ http://www. o complejo. digitalWrite(pin . i<8 . La cosa ha ido bastante bien con un digito. Un problema que a priori.youtube. pero… ¿Y si queremos mostrar 4 dígitos? ¿Vamos a multiplicar 8 cables x 4 dígitos más tensión y GND = 34 pines? En la próxima sesión veremos cómo manejar un display de 4 dígitos. He visto varios ejemplos por internet de este programa y la mayor parte de ellos me ha dado dolor de cabeza (Con algunas muy honrosas excepciones). } He aprovechado este ejemplo para insistir con los arrays. no incluiré el ejemplo de conectar un único digito a un shift register para gobernarlo. i++) { int valor = Digit[N][i] . Digit[N][i] ) . http://www. porque para eso los venden hechos. y si es preciso. } } Fijaros que podíamos haber escrito así (El código compacto también puntúa con los colegas): void Display(int N) { for (int i= 0 . i++) digitalWrite(i+2 . Digit[N][i] ) . pero os recomiendo que lo hagáis como práctica. RESUMEN DE LA SESIÓN https://www. porque son muy útiles para resolver problemas que de otro modo se pueden complicar bastante. valor) .net/indice-tutoriales 11 void Display(int N) { for (int i= 0 .prometec. y no es necesario volvernos locos enchufando no sé cuántos cables para hacer un reloj.prometec. o Son LEDs completamente normales.net/indice-tutoriales 12 • o Hemos presentado los displays LED de 7 segmentos y un dígito.youtube. solo que en forma de líneas y no de puntos.prometec.prometec.net/curso-kit-inicio/ http://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . o Algunas de las funciones que hemos definido nos seran útiles en los siguientes capítulos para gobernar mas display https://www. http://www. Arduino Uno o similar.prometec.prometec.youtube. Esta sesión acepta cualquier otro mod Una Protoboard .net/curso-kit-inicio/ http://www.net/indice-tutoriales 13 31-DISPLAY DE 7 SEGMENTOS Y 4 DÍGITOS Displays numéricos de 7 segmentos Home Display De 7 Segmentos Y 4 Dígitos OBJETIVOS • o Nuestro primer display numérico de 4 digitos.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Cables de protoboard https://www. o Aprendiendo a programar: Dividiendo el problema en funciones. o Multiplxando los digitos. o Vuelta a las operaciones con enteros MATERIAL REQUERIDO. http://www. ni se enteran. c. Conectad GND al cátodo del primer digito con una resistencia y comprobad las conexiones. entonces si vosotros fabricarais estos displays ¿Cómo evitaríais usar 34 pines? Pensadlo. mucha elegancia). más barato aun. g. queremos poder usar 4 dígitos para. pero recordad. Y un ingeniero creativo dijo: pues si hacemos que esos 4 pines para indicar la posición vayan a tierra pasando por un transistor cada uno podemos hacer que se ilumine solo uno cada vez.youtube. f.prometec. Y haciendo un ciclo rápido. e. d. en total 34 pines? Para empezar. pasando de uno a otro. 4 x Transistor 2N2222 LOS DISPLAYS LED DE 4 DÍGITOS En la sesión anterior.prometec. https://www. Y si queremos mostrar 4 dígitos… ¿Vamos a multiplicar 8 cables x 4 dígitos más tensión y GND. Ni que decir tiene que el ingeniero creativo pasó a jefe de proyectos. Un display de 7 segmentos y 4 dígitos. Y si hacemos el ciclo lo bastante rápido. no.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . digamos dar la hora. para probarlos. elegancia.net/curso-kit-inicio/ http://www. Arduino UNO no tiene tantos pines (Si. Así que lo primero que vamos a hacer es conectar los 8 segmentos del display a los pines del 2 al 10 de nuestro Arduino. la cosa ha ido bastante bien con un dígito. y poner otros 4 pines para indicar a cuál de los dígitos corresponde la información que ponéis en a.http://www. Simplemente seguimos utilizando 8 pines para iluminar los segmentos. iluminamos uno cada vez rápidamente y pasamos al siguiente y luego al siguiente y problema resuelto.net/indice-tutoriales 14 4 x resistencias de 330Ω. b. el Mega sí que los tiene. La cosa va por ahí. pero solo hay uno activo en un momento concreto. pero para eso habría que poner unas memorias y latch como en el shift register y alguien dijo: No. h. ¿Qué solución daríais vosotros al problema? Pues una fácil ( y barata que es lo que les gusta a los que fabrican) es la de mantener 8 pines para iluminar los 7 segmentos más el punto. pero ahora que le hemos cogido el puntillo. Y eso es todo. j++) https://www. j<10 .com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Leedla. i++) pinMode( i. Mirad el código de vuestro display y bajaros la data sheet de Internet. } void loop() { for (int j=2.http://www. tengo que insistiros en que leáis la hoja de características de vuestro display y no os fieis del diagrama de abajo. para probar el primer digito y ya me preocupare del resto luego. Podeís correr un programa simple como este.net/indice-tutoriales 15 CONEXIONES INICIALES De nuevo.net/curso-kit-inicio/ http://www. Lo que yo he hecho (porque mi display solo tiene 12 pines). que los va encendiendo y apagando en secuencia: Prog_31_1 void setup() { for ( int i=2 . i<10 . es conectar los 8 segmentos y enviar el cátodo a masa mediante una resistencia. Este diagrama es para el display que tengo entre manos (5461AS) y el vuestro no tiene por qué usar los mismos pines ( Aunque la probabilidad de que sea así es alta. Es imperativo que os aseguréis de conectar correctamente los segmentos antes que nada.prometec. aunque solo sea para comprobar si vuestros pines coinciden con el diagrama que os pongo debajo (Que es del manual de Parallax). para comprobar la conexión de los segmentos.prometec. porque el vuestro puede ser distinto. y en caso negativo tampoco es grave porque basta con que conectéis los pines correctos al mismo orden de vuestro Arduino).youtube. OUTPUT). Como son 8 segmentos cuando escribamos el 8 más el punto. 9. delay(300).net/indice-tutoriales 16 { digitalWrite( j.youtube. que ponemos en LOW. DIAGRAMA DE CONEXIÓN Ahora que estamos seguros de que nuestros 7 segmentos están enchufados donde corresponde viene la cuestión de utilizar 4 pines de Arduino para elegir cual se ilumina. 12. ya podemos pasar a la siguiente fase. es.http://www. Pero no.net/curso-kit-inicio/ http://www. Y la solución. 8 y 6 a 4 pines de nuestro Arduino. digitalWrite( j. así que mejor que pensemos otra cosa antes de que huela a quemado.prometec. Nuestra primera idea sería conectar esas salidas del display. utilizar un transistor para permitir cerrar el circuito de cada dígito.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. HIGH). https://www. Si mantenemos esos pines en HIGH excepto el que queremos iluminar. parece que cerraría el circuito a GND y ya está. } } Si todos se encienden. LOW) . El consumo típico de cada segmento. el consumo será de 8 x 15 = 120 mA y pudiendo llegar a 160mA. (como de cada LED) es de entre 15 y 20mA. Muy por encima de los 40 mA que un pin de nuestro Arduino puede suministrar o drenar. naturalmente. delay(300). queridos amigos. 0. // 2 { 1.1.1.0 }. y 12 los transistores están al corte.1.1. Ahora ponemos en LOW el pin 12 y en HIGH el 11.net/indice-tutoriales 17 El 2N2222 es ya un viejo conocido (No os olvidéis de la resistencia de la base.1. // 0 { 0. Los valores de los segmentos iluminaran ahora el segundo digito. Si ponemos tensión en el pin 12. poniendo a LOW los pines 9.0. // 3 https://www.youtube. y eso se le da muy bien a nuestro Duino.prometec.0. El único trucos es hacerlo rápido. es imprescindible).0. 11.1.1.1.0. Y luego el terceo y el cuarto. EL PROGRAMA DE CONTROL Vamos a reaprovechar la función Display () que escribimos en la sesión anterior para dibujar los dígitos en el display.prometec.1.0.1.1.net/curso-kit-inicio/ http://www.1.0.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .1.0 }.http://www.0.1. y ningún digito puede iluminarse.0.1.0 }. // 1 { 1. su transistor se satura y permite la salida a Ground del primer digito que encenderá los segmentos que le indiquen los pines 2 al 8. 10. que si recordáis se apoyaba en un array para saber que segmentos encender: Prog_31_2 byte Digit[10][8] = { { 1.0 }. 1.1.1. digitalWrite(12.LOW).1.1. int N) { digitalWrite(9 .1. void setup() { for (int i= 2.LOW).0.1. // 4 { 1.1. // 5 { 1.net/indice-tutoriales 18 { 0. i<8 .0.1.1.0. // Apaga todos los digitos digitalWrite(10. Digit[N][i]) .0.0.LOW).1.0 }. 2 las centenas y 3 los miles.0 }.0. i++) // Esto no cambia de la session anterior digitalWrite(i+2 .0 }.0. OUTPUT). i<13. // 8 { 1.1.0 }.prometec.0. void Display(int pos. donde la posición 0 son las unidades.1. for (int i= 0 .1.1.1.1.0 } // 9 }.youtube.1. i++) pinMode(i. } Pero vamos a extender Display para que escriba un digito en la posición que queramos. // Enciende el digito pos https://www.1.0.0.1.http://www.0 }.0. digitalWrite(pos + 9.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .0.1.1. // 7 { 1.1.net/curso-kit-inicio/ http://www.prometec. digitalWrite(11. 1 las decenas.1.LOW). HIGH). // 6 { 1. En un alarde de creatividad he bautizado a esta función como CalculaDigitos() void CalculaDigitos( int Num) { int Digit0 = Num %10 . Display(1 . Display(3 . también aquí. Display(2 . pero hemos hecho que al entrar los apague todos. centenas y miles.net/curso-kit-inicio/ http://www. 12. int Digit2 = (Num % 1000) / 100 . 10. luego levanta los pines que queremos y solo luego activamos el transistor de salida de la posición que queremos.prometec. } Por si acaso alguien faltó el día que hablamos de las operaciones con enteros haremos un caso concreto. 3 les corresponden los pines 9. Digit1). https://www. Display(0 . la elección del orden de los pines juega a nuestro favor. Digit2). Una vez que tenemos resuelto dibujar el número buscado en la posición elegida tenemos que escribir otra función que descomponga un número dado en unidades.youtube. Calculamos el pin de salida como pos + 9. Y a continuación le pedimos directamente que nos saque los dígitos al display. int Digit1 = (Num % 100) / 10 . Digit0). o sea 6. Digit3). ¿Cómo obtenemos sus dígitos separados? 2386 % 10 = 6 Porque el % nos devuelve el resto de dividir por 10. int Digit3 = Num / 1000) . 1. 2.prometec. porque a las posiciones 0. Supongamos un número como 2. para eso se inventó la división entera.net/indice-tutoriales 19 } Como veis.386.los decimales se tiran 2386 % 1000 = 386 386 / 100 = 3 2386 / 1000 = 2 Directamente.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . es la misma función en la parte de iluminar segmentos. decenas. 2386 % 100 = 86 Ahora hacemos la división entera por 10 o sea 8. lo que hace que ilumine la posición pedida en pos.http://www. 11. Ya conocíamos millis(). Os dejo como ejercicio que hagáis un reloj que efectúa una cuenta atrás desde un número dado. int minutos = n / 60 . } ¿Creías que iba a ser difícil? Pues lo siento. ¿Y si queremos hacer una cuenta atrás? Venga pensad un momento antes de mirar la solución. // Lo pasamos a segundos int segundos = n % 60 . } De nuevo a partir del reloj interno de nuestro Duino.(que cuenta en milisegundos por lo que lo dividimos por mil para pasarlo a segundos).net/indice-tutoriales 20 Por ultimo para la función principal. Como nuestro contador va hasta 9999 basta con restarle a esto el cálculo de arriba. Pues haciendo la división entera (otra vez) nos da un contador de hasta 999 segundos. http://www. empecemos pidiéndole que cuente décimas de segundo (La cuenta atrás la hacemos. CalculaDigitos(k) .youtube. luego) void loop() { CalculaDigitos( millis() / 100). Es así de sencillo. calculamos los segundos y minutos. el reloj interno de nuestro Duino en milisegundos.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . o simplemente poner en lugar del 9999 la cifra desde la que deseamos descontar. Más interesante. void loop() { int n = millis() / 1000 . • Muy fácil también. https://www. para luego llamar a CalculaDigitos() que espera un numero centesimal y por eso multiplicamos por 100 los minutos para que cuadre el display. y práctico supone convertir esa cifra a minutos y segundos sexagesimales para hacer un reloj.prometec.prometec. millis(). int k = minutos * 100 + segundos .net/curso-kit-inicio/ http://www. ALGUNOS COMENTARIOS FINALES Cablear este montaje es un asco y si fuera un circuito comercial seria caro (Porque aunque los componentes sean baratos. montarlos cuesta pasta. a sabiendas de que el montaje que os he propuesto es bastante más pesado. Meted uno por donde queráis y ved lo que ocurre. RESUMEN DE LA SESIÓN • o Hemos presentado los displays LED de 7 segmentos y 4 digitos. Por cierto. Así que en la práctica os desaconsejo que uséis estos displays de por si. http://www. Lo normal es usar un display tipo I2C o similar que lleven un circuito de control interno.youtube. ▪ Lo suficiente como para comprender. que como ejercicio está bien. Ya hablaremos de las soluciones. Y ¿Por qué a pesar de todo hemos hecho esta práctica? Pues porque es importante que entendáis cómo funcionan las cosas y el concepto de multiplexado es uno de los claves básicas para entender la electrónica digital.prometec. y este es uno de esos casos.net/indice-tutoriales 21 • El circuito que hemos visto.net/curso-kit-inicio/ http://www. https://www.En internet encontrareis bastantes ejemplos en los que. es el correcto para garantizar que el display tenga una vida larga y pacífica. al hacer un multiplexado de los dígitos basado en que nuestro Duino recorra el ciclo completo en menos tiempo de lo que nuestro ojo percibe. más que los componentes en este caso). son algo poco práctico y potencialmente muy peligroso a medida que los proyectos que presentemos se vayan complicando.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Aunque hasta ahora hemos usado y abusado de los delays. que al combinarse resuelven problemas que inicialmente parecen inabordables. cualquier uso de un delay() dará al traste con el invento?. para que podamos usarla en displays de digitos múltiples(Seria muy fácil extenderla a 8 digitos).prometec. menos trabajosas. o Hemos visto que podemos abordar problemas complejos mediante pequeños pasos y funciones. ¿Os habéis dado cuenta de que. en vez de transistores usan resistencias de un cierto valor para limitar la intensidad en los controles de salida. o bien usar un integrado de control BCD como el Max7219 (Volveremos a hablar del asunto en un futuro próximo). de hecho es el que recomienda el fabricante. en vuestros proyectos. o Hemos resuelto una serie de problemas lógicos. Hay demasiados cables y siempre hay alguno dando guerra. He preferido no hacerlo así. en pasos más pequeños de abordar para mejorar nuestra competencia en la búsqueda de algoritmos útiles. o Hemos mejorado nuestra función Display(). pero veremos otras maneras de incluir estos displays. youtube. http://www. Arduino Uno o similar. o Aprendiendo a programar: Dividiendo el problema en funciones. Esta sesión acepta cualquier otro mod Una Protoboard. Cables de protoboard Un display de 7 segmentos y 4 dígitos. o Multiplxando los digitos.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www.prometec. LOS DISPLAYS LED DE 4 DÍGITOS https://www.prometec. o Vuelta a las operaciones con enteros MATERIAL REQUERIDO.net/indice-tutoriales 22 32-DISPLAY CON INTERFACE Arduino con display de 4 digitos Home Display Con Interface OBJETIVOS • o Nuestro primer display numérico de 4 digitos. net/curso-kit-inicio/ http://www.net/indice-tutoriales 23 En la sesión anterior vimos cómo usar un display de 4 dígitos montando nosotros toda la electrónica. tiene una librería muy simple y funciona tanto a 5V como a 3. fue lo pesado que es montar aquel circuito en una protoboard. de 4 dígitos que se gobierna con esos 4 pines que decíamos (y dos son Vcc y GND). pero en la realidad es mucho mejor utilizar un display con sistema anexo de control. y vimos que no se notaba el truco de multiplexar los dígitos. que conectamos a los pinos 2 y 3 respectivamente.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .3V. Pero lo que desde luego si que percibimos. un fabricante chino.prometec. Hoy os voy a presentar un display chiquitín.youtube. pero no tienen ninguno de los problemas que vimos.. Vimos que la cosa funcionaba bastante bien. Es un display de Catalex. pero todo llegará) y entonces haremos un sesión sobre el tema. https://www. que son un poco más caros. pero muy resultón. porque en general los Duinos son lo suficientemente rápidos para que no lo percibamos. que tengo rodando por la mesa ya un tiempo y que me encanta. • Espero recibir en breve uno de estos displays en versión I2C (Aaún no hemos hablado del I2C. Y eso es todo.prometec. En la práctica ese sistema solo es para los estudiantes (por aquello de que aprendan sufriendo). En realidad son tan sencillos que no suelen tener más allá de 4 pines y se controlan por software directamente. por la cantidad de cables que supone conectar y por lo fácil que es equivocarse o soltar uno inadvertidamente. http://www. DIAGRAMA DE CONEXIÓN El cableado de uno de estos displays es insultantemente sencillo: Conectamos tensión y Ground y solo nos quedan 2 hilos: DIO o Data Input Output y Clock. Veréis que os incluye una línea como esta: #include <TM1637.prometec. Para usarla. Seleccionad Programa – Añadir librería e indicadle el fichero que acabáis e descargar y se instalará. del que no teneís que preocuparos: int8_t Digits[] = {3.http://www. pero que es lo que hay.2.h> Que es un nombre impresentable. Y ahora el fabricante nos pide que le pasemos los dígitos a representar en un array de 4 unsigned byte definidos con un tipo raro int8_t.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .youtube. https://www.prometec. Y en la lista de librerías que sale en el desplegable elegid DigitalTube .net/curso-kit-inicio/ http://www.1.DIO).net/indice-tutoriales 24 EL PROGRAMA DE CONTROL El fabricante del display nos proporciona una librería para que podamos olvidarnos del multiplexado y demás historias: DigitalTube La descargamos e instalamos como vimos en la sesión Conociendo los servos. definimos un par de pines para la señal CLK y DIO: #define CLK 3//pins definitions for TM1637 and can be changed to other ports #define DIO 2 Ahora tenemos que crear una instancia del tipo TM1637 que llamaremos Display1 y le pasamos los pines que controlan la comunicación: TM1637 Display1(CLK.2} . display(Digits).display(Digits).1. Por pura vagancia os pongo el programa completo para que apreciéis la diferencia: #include "TM1637.h" #define CLK 3 #define DIO 2 TM1637 Display1(CLK.prometec. void setup() { Display1.set().youtube. https://www. Display1. Y listo.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . } void loop() { Display1. Y ahora hay que inicializar la librería y el display void setup() { Display1. Display1.DIO).init() . int8_t Digits[] = {5.set().net/indice-tutoriales 25 En este caso el display mostrara 3212.net/curso-kit-inicio/ http://www.2}.init() .http://www.2.prometec. } Y ahora ya solo queda pedirle que imprima Digits[] Display1. Display1. } Vamos a usar un contador para que veamos su valor en el display. Vamos a empezar por las definiciones #include "TM1637.h" #define CLK 3 #define DIO 2 TM1637 Display1(CLK.5. int8_t Digit1 = (Num % 100) / 10 .prometec.net/indice-tutoriales 26 } Vamos ahora a hacer el ejemplo del contador de la sesión anterior para que veamos cómo queda. int8_t Digits[] = {7. así que vamos a necesitar separar los dígitos del valor y meterlos en el array Digits. int8_t Digit2 = (Num % 1000) / 100 .youtube.prometec.http://www.DIO).set(). https://www. Para ello vamos a recuperar la función CalculaDigitos () de la sesión anterior con alguna pequeña modificación: void CalculaDigitos( int Num) { int8_t Digit0 = Num %10 .com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . int8_t Digit3 = Num / 1000 .4}.init() .net/curso-kit-inicio/ http://www.6. //Valor inicial void setup() { Display1. i<10000 . delay(100). i++) { CalculaDigitos(i). casi puedo perdonárselo. Digits[1] = Digit2 . Y para calcular el número: void loop() { for (int i = 0 . } Calculamos los dígitos y los metemos en el array. http://www. Digits[0] = Digit3 . que utiliza un bus propio (y no documentado) pero que como funciona.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . https://www.youtube. o La virtud de este tipo de display (Digital tubes para los ingleses) es la facilidad de conexión y de gestión con la librería. para que podamos usarla con este display u otros que requieran que les pasamos los dígitos separados.net/indice-tutoriales 27 Digits[3] = Digit0 .net/curso-kit-inicio/ http://www.display(Digits).prometec. o Hemos modificado nuestra función CalculaDigitos().prometec. } } RESUMEN DE LA SESIÓN • o Hemos presentado los displays LED de 7 segmentos y 4 dígitos de Catalex. después basta con llamar al método display (en minúsculas) del objeto Display (en mayúsculas). Digits[2] = Digit1 . Display1. Arduino Uno o similar.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www. o Veremos cómo enviar información o Definiremos algunos caracteres especiales MATERIAL REQUERIDO. Cables de protoboard Un Potenciómetro. Esta sesión acepta cualquier otro mod Una Protoboard.prometec.prometec.youtube.net/indice-tutoriales 28 33-DISPLAYS LCD Usando displays de texto LCD 16x2 con Arduino Home Displays LCD OBJETIVOS • o Vamos a montar un display LCD de 16×2. https://www. http://www. ANTES DE EMPEZAR Aunque.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . están muy bien. son baratos y prácticos.prometec. pero tienen el inconveniente de que no pueden mostrar mensajes de texto. LOS DISPLAYS LCD Los displays LEDs de 7 segmentos. • Están disponibles en varios tamaños y configuraciones. o sea Pantalla de cristal liquido. y por eso.net/curso-kit-inicio/ http://www. te lo envían en kit.prometec. todavía hay muchos sitios que cuando compras uno de estos.youtube. En esta sesión veremos cómo conectarlos a vuestros Duinos y cómo usarlos para sacar mensajes al exterior. con los pines aparte para que los sueldes • En algún momento tendremos que hablar de cómo soldar componentes. que vimos en las sesiones anteriores. de 16×2 o 16×4. sino solo números. últimamente. Son faciles de encontrar en diversos formatos : 16×2 (16 caracteres x 2 líneas) o LCD 16×4 (16 caracteres x4 lunes). y además. estos displays suelen venir con los pines soldados. Se echa de menos algún sistema para mostrar mensajes de texto sencillos. Básicamente porque: • Son baratos. y por eso se comercializan los displays LCD. • LCD viene del inglés Liquid Crystal Display. • Son de bajo consumo. Son una opción muy sencilla de usar.net/indice-tutoriales 29 Un display LCD. • Muy prácticos si te basta con mostrar solo texto (y algunos caracteres especiales). pero ese día. http://www. en los últimos años los displays LCD han ganado mucha aceptación en productos comerciales de todo tipo. dan un toque muy pro a vuestros proyectos. aún no ha llegado. https://www. Los sueldas y punto. Cualquier otra solución acabara funcionando mal. y que no vale sujetar los pines de algún modo más o menos extravagante.youtube.net/indice-tutoriales 30 Lo primero que tienes que saber. pincha el display en la protoboard.http://www. recuerda que habrá muchos. así que se generoso con el espacio que dejas. Hazte a la idea.net/curso-kit-inicio/ http://www. es que tienes que soldarlos.prometec. o directoramente con el display quemado. Cuando lo tengas listo. dejando sitio para el resto de componentes y cables.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . DIAGRAMA DE CONEXIÓN Aquí teneis el esquema de conexión: Y este es el esquema para potoboard: https://www.prometec. Conecta el pin16 del LCD a Ground y el 15 a 5V https://www. Empieza conectando tensión y GND a la protoboard.youtube. Asi que vamos a ir paso a paso con los diferentes cables.net/indice-tutoriales 31 La conexión no es complicada.prometec.http://www. Vamos ahora a a conectar la alimentación el panel LCD.net/curso-kit-inicio/ http://www. pero requiere ser cuidadoso.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. El centro al pin 3 del LCD. si no ves esto. Aprovechemos también para dar tensión al panel LCD.net/curso-kit-inicio/ http://www. Conecta el USB a tu Arduino y veamos.http://www.prometec. podemos seguir.net/indice-tutoriales 32 Si conectas ahora el cable USB a tu Duino. Si vas girando el potenciómetro. el potenciómetro de ajuste. en algún momento tienes que ver unos cuadraditos en la pantalla.youtube. El pin 1 va a GND y el 2 a tensión: Si todo ha ido bien.prometec. https://www. No sigas. revisa tus cables antes de seguir. ya podemos encender el dispay y probarlo. Para ello conecta uno de los extremos del pot a GND y el otro a 5V.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . el LCD debería iluminarse. Si ya veis las matrices de puntos en la pantalla. Vamos a conectar ahora. en caso contrario revisa las conexiones. si no. Lo primero es que al importar la librería nos ha escrito esto: #include <LiquidCrystal.youtube.h> https://www. porque no los necesitamos. Pinchad en: \\Programa\Importar Libreria\LiquidCrystal Y ahora podemos importar uno de los ejemplos o escribir el nuestro. y D4 . LCD pin 14 Arduino pin 12 DB6. LCD pin 6 Arduino pin 8 Y ya solo nos quedan los 4 cables de datos.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www. no vamos a usar todos los pines disponibles.prometec. LCD pin 12 Arduino pin 10 DB4. No necesitamos mas por ahora. LCD pin 13 Arduino pin 11 DB5.prometec. Solo usaremos dos pines de control. Sin entrar en muchos detallas. LCD pin 4 Arduino pin 7 EN.http://www. D5. RS y EN y los 4 pines de datos D7.net/indice-tutoriales 33 Vamos a conectar ya los pines de datos y control. LCD pin 11 Arduino pin 9 EL PROGRAMA DE CONTROL Vamos a usar una librería de control del panel LCD. D6. DB7. LCD pin 5 GND RS. que viene incluida en nuestro Arduino. Vamos con las conexiones de control del display: RW. comentando el código. print(millis() / 1000).setCursor(0. no corresponden a los ejemplos de Arduino. d6.print("Prometec. // ( RS. 9. 9.net"). // Enviar el mensaje } void loop() { lcd. line 1 lcd.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .youtube. 8). El resto es sencillo void setup() { lcd. 11.prometec. peroaseguraros de cambiar la línea de definición de los pines. así que podéis cargarlos. 12). 8. es la linea 0 y la segunda la linea 1. 11.prometec. la superior. // set the cursor to column 0. Creamos una instancia llamada lcd. pero muy sencillos de utilizar. hay que inicializar la librería. void setup() { https://www. 8. EN. Vamos a probar sacando un reloj (muy sencillo de momento). http://www. // print the number of seconds since reset: } • Cuidado: Como siempre la primera linea. 10. d5. d7) • Tened cuidado porque los pines que hemos usado. 12). Estos display son muy pesados de cablear. d4.begin(16. podemos recuperar alguna para presentar el valor de millis() como un reloj #include <LiquidCrystal. 2). Si recordáis las funciones que usamos en las ultimas sesiones.h> LiquidCrystal lcd(7.net/curso-kit-inicio/ http://www. de la clase LiquidCrystal y le pasamos como parámetros los pines que hemos usado: LiquidCrystal lcd(7.net/indice-tutoriales 34 Despues. // Fijar el numero de caracteres y de filas lcd. 10. o no correrán. 1).youtube.print(s) . lcd.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Pero fijaros que hemos definido reloj como String: String reloj() Eso significa que vamos a devolver un parámetro tipo String a quien nos haya llamado. En algún punto de la función habrá que hacer un return( String). calculamos los minutos y segundos a partir del reloj interno de Arduino en milisegundos. 2).begin(16. // Fijamos el numero de caracteres y filas lcd.prometec. // Lo pasamos a segundos int segundos = n % 60 . no hay nada nuevo en esto. En primer lugar en la función reloj. // Ponte en la line 1.net/indice-tutoriales 35 lcd.print("Prometec. String S = String(minutos) + ":" + String(segundos). comentar algunas cosas de este código.http://www. } Merece la pena. posicion 6 String s = reloj() . // Aqi va el mensaje } void loop() { lcd.setCursor(6. int minutos = n / 60 . Fijaros que definimos dentro de la función un string llamado s: https://www. } String reloj() { int n = millis() / 1000 .prometec.net/curso-kit-inicio/ http://www.net"). return (S). print() se usa exactamente igual con esta instrucción. ¿Cómo lo arreglarías. es muy interesante que veamos cómo definir algunos caracteres especiales. En la función loop. porque en la tabla base del LCD. Lo primero que tenéis que saber. DEFINIENDO TUS PROPIOS CARACTERES Vamos a definir un carácter propio. Para sacar el mensaje de texto. para escribir la hora centrada. como si los dibujarais en una cuadricula de ese tamaño. En esta línea no hay que confundir (aunque se escriben exactamente igual). para digamos. Al final le añadimos un par de espacios en blanco. con la función String(n) que convierte un numero n en un string de texto para que pueda mezclar el número de los minutos y los segundos separados por un símbolo de “:”. La librería LCD.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . que os conviene probar. 1). http://www. hemos usado lcd. // Ponte en la line 1. Sin llegar a tanta sofisticación. el tipo String para definir S. simplemente.setCursor(6. no están incluidas ñ.print(s) .prometec.youtube. Todo lo que ya sabéis de Serial. que tenéis que cambiar las definiciones de los pines para que corran. en el que define una serie de símbolos especiales y los mueve por la pantalla en función de los valores que lee de un potenciómetro. el símbolo de grados centígrados. y rellenando el cuadradito completo.net/curso-kit-inicio/ http://www. de nuevo) de 8×8.prometec. es que los caracteres se definen con un array ( si. o €. para evitar arrastrar fantasmas en la pantalla • Quita los espacios y miro lo que pasa en el cambio de minuto. por ejemplo. en la posición 6 de la segunda línea. Recordad. Así que dependiendo del uso que le deis pude seros de interés saber cómo definir tus propios símbolos. viene con varios ejemplos muy interesantes. Así por ejemplo para el símbolo del grado seria: https://www.net/indice-tutoriales 36 String S = String(minutos) + ":" + String(segundos). acentos. grados. Y por último. tenemos una línea como esta: lcd. Aquí os dejo un mini video con el resultado. Un ejemplo particularmente interesante. es el de CustomCharacter. sin el truco de poner esos espacios al final? Piensalo. posicion 6 Que lo que hace es posicionar el cursor del panel. net/curso-kit-inicio/ http://www. de caracteres y crearlos y matarlos sobre la marcha).http://www. grado).h> LiquidCrystal lcd(7. 0b00000000 }. 0b00010010. 0b00000000.prometec. lcd. Aqui tenemos un ejemplo del programa: #include <LiquidCrystal. // Los definimos como binarios 0bxxxxxxx 0b00010010. 0b00001100. https://www. 9.createChar(0. Tened en cuenta que solo podemos definir 8 caracteres especiales en un momento dado ( Aunque podemos definir 30 arrays.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .createChar(1.net/indice-tutoriales 37 byte grado[8] = { 0b00001100.prometec. 0b00000000. euro). 12).youtube. 8. Y ahora ya estan disponibles. 0b00000000. Para montar los caracteres definidos usamos: lcd. 10. 11. prometec. // Hay que inicializar el LCD lcd. lcd. 2). 0b00001100. grado).http://www.youtube.net/curso-kit-inicio/ http://www. 0b00000000. 0b00000000 }. 0b00000000.begin(16. lcd. lcd. 0b00010010. 0).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . } void loop() { } Y aqui teneis una foto del resultado https://www.setCursor(0.write(1). 0b00000000.createChar(1. 0b00010010. void setup() { lcd.print("Estamos a 25").net/indice-tutoriales 38 byte grado[8] = { 0b00001100.prometec. ▪ Lo suficiente como para comprender.net/indice-tutoriales 39 Por último. como si fuera una puerta serie.prometec. dos. o Son muy comodos de manejar porque podemos imprimir directamente. conectando un buen número de cables. compraros uno que sea I2C o algo así. pero si vais a compraros un LCD. o Existen también. o Podemos ( y tendremos que hacerlo. y para cerrar ya la sesión (Todo llega en la vida). porque en su día piqué y me compre un display de estos ( en realidad. vuestra salud mental mejorará mucho y solo usa 4 cables. Esto solo se puede justificar. si necesitáis mas espacio en pantalla. displays de 16 caracteres y 4 líneas.prometec. En la próxima sesión montaremos uno para que veáis la diferencia. seguro) definir caracteres y símbolos no incluidos en el display.net/curso-kit-inicio/ http://www. pero veremos otras maneras de incluir estos displays. Tengo otro de 16×4). menos trabajosas. Deciros que de nuevo.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . https://www. http://www.youtube. hemos montado este display a la brava. RESUMEN DE LA SESIÓN • o Hemos visto los displays LCD de 16 caracteresy 2 líneas. que como ejercicio está bien. por Dios. net/curso-kit-inicio/ http://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . https://www. Cables de protoboard Una resistencia de 330Ω. Arduino Uno o similar. o Conectar un display I2C.prometec.prometec.net/indice-tutoriales 40 34-EL BUS I2C Arduino y el bus I2C Home El Bus I2C OBJETIVOS • o Comprender el bus I2C.youtube. http://www. Esta sesión acepta cualquier otro mod Una Protoboard. o Enviando mensajes a la pantalla MATERIAL REQUERIDO. Esa norma se llamó Inter Integrated Circuits bus.net/indice-tutoriales 41 Un display LCD. • Cada dispositivo conectado al bus I2C y cada uno tiene su dirección exclusiva. aumentaba exponencialmente. y es. todavía es pronto). más sencillo fabricar bloques de construcción electrónicos integrados en un único chip. y pronto se convirtió en un estándar de facto en la industria. I2C. se convirtió en un problema. (Asi que. y proporciona un protocolo de arbitraje y detección de colisiones. propuso una norma de comunicación digital. pero solo uno puede estar activo a la vez. engordó peligrosamente.net/curso-kit-inicio/ http://www. Por eso. • No se requiere una velocidad de reloj estricta. en los primeros 80. pero la idea básica sigue siendo la misma: • Protocolo de dos hilos de control.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . y también. http://www. y el protocolo a seguir para conseguir esa comunicación y la hizo abierta. en teoría. de 16×2 o LCD 20×4. el reloj asíncrono que indica cuando leer los datos SCL. IIC o I2C. niveles de tensión. SDA y otro. • Es multi master.youtube. ponerlos de acuerdo y conseguir que se comunicaran eficazmente. ya que es el master quien controla el Clock.prometec. (Si no has entendido esto. como TWI (Two Wire Interface. • Uno de estos componentes. pero siempre es lo mismo. https://www. entre los diferentes componentes de una sistema electrónico. es decir controla el reloj. o interface de 2 hilos). Puedes encontrar que a este bus se le llama I2C. y pronto el grosor de los catálogos de los fabricantes. no te preocupes. el número de componentes comerciales disponibles. Era relativamente fácil encontrar esos bloques de construcción pero cuando tu diseño requería usar una docena de esos bloques. EL BUS I2C A medida que la capacidad integración en un único chip aumentaba. podemos conectar 27 = 128. debe actuar como master. el master puede cambiar.prometec. uno para transmitir los datos. Una norma que especificaba la velocidad. o IIC. dispositivos). uno de los grandes fabricantes de electrónica (Phillips). Cada vez era. de 7 bits. Mas GND y 5V (cuando se requiera). Las especificaciones han ido mejorando con los años. https://www. La librería I2C. • Fijaros también que hay unas resistencias de Pullup conectadas a SDA y SCL. en este caso.net/curso-kit-inicio/ http://www. los pines I2C están en los pines analógicos A4 (SDA) y A5 (SCL). la señal activa es un 0. Pero tranquilo. ya que el bus es activo bajo (Esto es.prometec. que esto no te afecta) • Cuando vayas a conectar algo al busI2C. Son imperativas. La norma propone un sistema de arbitraje. no un 1. • Puede haber más de un master. Y la buena noticia es que nuestro Arduino lo soporta de fábrica con una librería estándar.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . solo uno puede ser el master. Es una de las muy grandes virtudes de la comunidad Arduino. pero en un instante dado. • En el Arduino Mega y DUE. son el 20 (SDA) y en el 21(SCL).prometec. o vienen puestos en el componente. sino construir sobre el trabajo de terceros. • Esto no es vagancia.net/indice-tutoriales 42 La idea es que todos los componentes se conecten en paralelo a las dos líneas del Bus. es imprescindible que leas el manual para saber si los pullups los tienes que poner tú. que utiliza dos de los pines analógicos para las funciones SDA (Datos) y SCL (Clock). • En el Arduino UNO. y gestiona el protocolo de comunicaciones completo. SDA y SCL. En cada momento solo puede haber un master. normalmente incluyen los pullups. http://www. sin necesidad de mancharte las manos de grasa. lo que es un detalle. • En el caso del display I2C que vamos a usar. en Arduino se llama Wire (para que no os confiéis). pues nos ahorra la parte aburrida de estudiar el protocolo y escribir programas para ello. para transferir el control de uno a otro. Muchas librerías para incorporar a nuestros proyectos. nuestro Duino y los demás se configuran como esclavos.youtube. pero bastante es que nos informe de que hay alguien en la dirección xx.prometec. este programa. claro. I2C scanner Naturalmente. esto implica que sabemos la dirección del componente. que en la vida las cosas rara vez son como en los cuentos. basta con colocarlo solo en el bus. EL resultado para el LCD que tengo es 0x27 Hexadecimal. es el receptor del mensaje.net/indice-tutoriales 43 En esta sesión vamos a conectar un display LCD de 16×2 con interface I2C. de lo que hay en nuestro bus y con qué dirección. y ahí suele decirnos cuál es la dirección por defecto. Así que ya podemos pasar a hablar de como programar el uso del display. indicando cuál de los muchos posibles. algún alma caritativa (y con mucho mundo a sus espaldas).youtube. y ver qué dirección nos reporta el I2C scanner. hizo un programita para Arduino. Si no sabemos en qué dirección está un componente dado. no tiene ni idea de quien responde y lo que hace. tenemos que asegúranos de otro asunto. en lugar del que se conecta directamente con 16 pines. y cada mensaje y orden que transmitimos al bus. Pero como ya sabemos. que nos informa. y así podréis comprobar porque en la última sesión os recomendé usarlo. Pero antes.http://www.net/curso-kit-inicio/ http://www. Lo normal es comprobar la información técnica del fabricante del componente. DIAGRAMA DE CONEXIÓN https://www. SCANNER DE I2C Cada componente que conectamos al bus I2C tiene una dirección única. lleva anexa esta dirección.prometec. Pero.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . zip y haz doble click.prometec.net/indice-tutoriales 44 La conexión es. y como es estándar la incluyes con: \\Programa\ImportarLibreria\Wire Ahora hay que incluir la librería LiquidCrystal normal y después la de LiquidCrystal_I2C. Ahora vamos a incluir la librería I2c que en Arduino se llama Wire.h> https://www.Deberiamos tener 3lineas como estas: #include <Wire. para que se instale en nuestro IDE.net/curso-kit-inicio/ http://www. y solo he visto que hacen referencia a que el nombre de la librería es Malpartida (A mí no me miréis). Descarga la librería LiquidCrystal_I2C .http://www.prometec. nuevamente. y vamos a instalarla lo primero \\Programa\ImportarLibreria\Añadir \Librería Busca en tu directorio de descargas. PROGRAMA DE CONTROL Lo primero. No he encontrado información del autor o autores.h> #include <LCD.youtube. la librería LiquidCrystal_I2C . Vamos con el programa. trivial: Simplemente Arduino A4 a SDA (Datos) y A5 a SCL (Clock).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Se llama LiquidCrystal_I2C y es un añadido para la librería estándar que viene con tu Duino (tranquilo no duele y debería ser automático). más GND y alimentación. es que descarguéis una nueva librería para maneja el display con I2C. http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 45 #include <LiquidCrystal_I2C.h> Vamos ahora a definir una variable con la dirección de nuestro display. En mi caso la 0x27 byte dir = 0x27 // Ese 0x significa que es hexadecimal, no decimal Y por último creamos una instancia del objeto LiquidCrystal_I2C: LiquidCrystal_I2C lcd( dir, 2, 1, 0, 4, 5, 6, 7); Al que le pasamos la dirección dir del display y varios números que indican que pines debe usar la librería para el display, no de Arduino. Ignóralo y lo copias así para los displays. El resto queda así: #include <Wire.h> #include <LCD.h> #include <LiquidCrystal_I2C.h> #define I2C_ADDR 0x27 LiquidCrystal_I2C lcd(I2C_ADDR,2, 1, 0, 4, 5, 6, 7); void setup() { lcd.begin (16,2); // Inicializar el display con 16 caraceres 2 lineas lcd.setBacklightPin(3,POSITIVE); lcd.setBacklight(HIGH); lcd.home (); // go home lcd.print("Prometec.net"); lcd.setCursor ( 0, 1 ); // go to the 2nd line lcd.print("Malpartida lib"); } https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 46 void loop() {} Aquí tenéis el resultado: RESUMEN DE LA SESIÓN • o Hemos presentado los displays LCD de 16×2 I2C o Funciona igual que los normales, pere requieren muchos menos cables para instalarlos y se evitan montones de problemas. o Muy practicos y cuestan poco mas que uno normal. https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 47 35-CIRCUITO CON UN BAR LED Arduino y los LEDBAR Home Circuito Con Un Bar LED OBJETIVOS • o Presentar las barras de LEDs. o Mostrar un circuito de muestra. o Son una solución elegante para hacer un display en porcentaje. MATERIAL REQUERIDO. Arduino UNO o equivalente. Una Protoboard más cables. 8 resistencias de 330Ω. Un chip FJB10R con 10 LEDs alineados. LOS LED BAR O BARRAS DE LEDS. https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 48 Con mucha frecuencia, vamos a querer indicar el nivel relativo de algo. Bien sea sobre el valor de un potenciómetro, de un sensor de luz, de un sensor de temperatura, o de cualquier otra variable. No es raro en este tipo de tutoriales encontrar razones para un indicador así, y con mucha frecuencia se hace con, digamos 8 LEDS, y se representa el porcentaje de algo con respecto a su valor máximo. El sistema funciona, pero es poco práctico y aún menos eficaz como indicador, por eso vamos a presentaros un integrado muy simpático: FJB10R. Los LEDs encapsulados en un único chip, listo para hacer esas cosas. Seguro que los habéis visto en más de un equipo por ahí, y son muy agradables de ver como bailan siguiendo las señales de audio. Son pequeños, baratos y muy eficaces a la hora de mostrar este tipo de señales en porcentaje que mencionábamos, y además están diseñados para `poderse cascadear, si con 10 LEDs, no os parece suficiente y además están disponibles en varios colores. La conexión es de lo más sencilla, porque al final son simplemente 10 LEDs encapsulados en barritas paralelas, pero se manejan exactamente igual que un LED normal. A partir de ahora, conviene que, por costumbre, busquéis en internet, la referencia de los componentes que vayáis usando, Así que buscad la referencia FJB10R en Google, para encontrar la hoja de normas del fabricante. Nos interesa sobre todo, la descripción de los pines del chip (Que en este caso es el obvio, pero no os fieis) • Hacer suposiciones sobre como es el patillaje (Pinout) de un chip, es hacer oposiciones a otro viaje a la tienda de electrónica, a buscar un reemplazo, para el precioso chip que acabamos de hacer a la brasa. • No supongáis. Comprobad. Y la única forma sensata, es buscar las especificaciones. Acostumbraros a hacer búsquedas de las referencias en Google. Veamos el esquema del fabricante https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos DIAGRAMA DEL CIRCUITO. porque solo podemos colocar el chip en el carril central de la protoboard y eso hace que tengamos que elegir entre colocar 10 resistencias o 1 resistencia y 10 cables. antes de conectar el resto. es que en mi chip no encuentro ninguna marca indicando el pin número 1. http://www. por lo que hay que probar a ver cuál es.prometec. ya sabéis que soy alérgico a usar 10 resistencias con 10 LEDs. Aquí tenemos el esquema de protoboard: https://www. he optado por la de menos componentes. La única dificultad que veo.youtube. el fabricante ha colocado los ánodos (Positivo) de los diodos en una cara y los cátodos (Negativo) en la otra… La conexión de estos chips es trivial. pues basta con poner una resistencia de limitación de 330Ω a cada LED y conectar los positivos a 10 puertas de nuestro Arduino. • Si me habéis seguido hasta aquí. como podíais esperar).prometec. no nos queda más remedio.net/curso-kit-inicio/ http://www.(Naturalmente.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 49 Como esperábamos. (demasiado vago) pero en este caso. Para ello conectad el positivo y negativo de un único LED y comprobar que se ilumina. com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 50 El chip encapsula los 10 LEDs y hay que conectarlos en paralelo con su resistencia y los conectamos a los pines de Arduino del 3 al 12.prometec.http://www. EL PROGRAMA DE CONTROL. i++) https://www. el primer pin y 14. void setup() { for (int i= 3. El programa ilumina los LEDs por debajo del valor leído y apaga el resto. porque queremos que el 13 sea el último. i<14 . Simplemente.prometec.net/curso-kit-inicio/ http://www. leemos el potenciómetro y mapeamos la lectura a un valor entre 3. para mostrar la función Ed estos displays. Hemos escrito un programa básico.youtube. j < 14 . LOW). 0. 13). j++) { if (j <= k) digitalWrite(j. pero LEDs normales.youtube.prometec. o Son 10 LEDs encapsulados en una bloque. http://www. un componente simpático y muy útil en cualquier proyecto que requiera mostrar un porcentaje. 3 . 1000. HIGH).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. int k = map ( v. o Lo utilizaremos en más sesiones en el futuro.net/curso-kit-inicio/ http://www.net/indice-tutoriales 51 pinMode(i. } } Aquí tenéis un video con el resultado RESUMEN DE LA SESIÓN • o Hemos presentado las led bars. https://www. else digitalWrite(j. for ( int j=3 . OUTPUT). } void loop() { int v = analogRead(A5). cómodo. 1.0.0.1.net/curso-kit-inicio/ http://www. a izquierda y derecha.1.0. y estado mental relajado.prometec. OR.0.1.0. // 2 { 1. // 3 https://www.youtube.0 }.1.1.1. algo así: byte Digit[10][8] = { { 1.0 }.1.net/indice-tutoriales 52 36-OPERACIONES CON BITS Opoeraciones logicas y bit shift con Arduino Home Operaciones Con Bits OBJETIVOS • o Presentar la forma de rerpresentar caracteres graficos.1.0.1.1.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec.0 }. // 1 { 1.0.0. Arduino UNO o equivalente. http://www. XOR o Presentar los desplazamientos de bits. en la sesión 31. o Presentar los operaciones básicas de bits AND.0. // 0 { 0.1.1. MATERIAL REQUERIDO.0 }. o Como codificar estos caracteres. DEFINIENDO EL GRAFICO DE UN CARACTER Si recordáis. definimos unos arrays como estos para mostrar los números en el display.1. en una matriz de puntos.1. net/curso-kit-inicio/ http://www.1./. // 8 { 1.1.1. y como si definimos el alfabeto completo. Si hacemos lo mismo que en el caso de la sesión 31. solo tenemos 2k.1.1.1. Tendríamos que definir unas matrices de 8×8 puntos.1.1.0. así que por aquí no vamos bien. Definíamos los segmentos que se tenían que iluminar. Afortunadamente. Claro que esto es para unos displays BCDs que tiene 8 segmentos por cada digito. // 5 { 1.1.0. Y la solución es codificar a nivel de bits y operar luego con ellos.youtube. números y algunos símbolos como +.* símbolos de puntuación y demás.0 }.0 }. con un byte. Si recordáis de cuando hablamos de la memoria para las variables. Suponed que quisiéramos utilizar unos displays un poco más sofisticados como una matriz de 8×8 puntos LED.0. que pudiéramos encender independientemente (Nuestra siguiente sesión). // 7 { 1.0 }.1.0.1.0.http://www.0. especificando un 1 o un 0. con mayúsculas y minúsculas.1.net/indice-tutoriales 53 { 0.1.1.1.1.0.0. // 6 { 1. DEFINIENDO ARRAYS COMPACTOS DE CARACTERES 8×8 Supongamos que quisiéramos dibujar las letras de PROMETEC en un display de 8×8.1.0.1.1.192 bytes.0.prometec.0 } // 9 }.0.1.1. Que por 64 bytes cada uno.0 }. Lo que significa que ese array ocupa 80 bytes (Podéis comprobarlo con la función sizeof(Digits)). nos da la bonita cifra de 8.0 }.prometec. Y esto nos lleva directamente a los objetivos de esta sesión. // 4 { 1.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .0.1. y resulta que necesitamos 8k para estos arrays.1. para dibujar una letra concreta.-. no somos los primeros en tener este problema (Sorpresa) y más en la época heroica donde ponerle 8k de RAM al ordenador podía costar una cifra con más ceros de los que podíamos pagar. Podríamos jugar a dibujar en cuadriculas algo parecido a esto: Para la R: https://www. cada letra ocupara 8 x 8 bytes= 64 . nos iremos enseguida a unos 128 caracteres.1. 0x40. 0x44. 0x44.net/curso-kit-inicio/ http://www. 0x42. 0x42. será sacar los bits cuando los necesitemos. he añadido una última columna en hexadecimal. 0x4C. 0x58. 0x42. 0x42. byte O[] = { 0x3C. El problema ahora.net/indice-tutoriales 54 Para la O: Fijaros que además de escribir el valor en binario. 0x70. 0x44. 0x46 }. 0x42. 0x40. Fijaros que lo único que hemos hecho.prometec. es tan fácil como coger los dígitos binarios de 4 en 4 y pasarlos directo a hexadecimal con la siguiente tabla: Una manera compacta de escribir esos valores es: byte P[] = { 0x78.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .youtube. 0x42. • Dijimos la última vez que hablamos del tema. con 8 bytes codificamos los bits necesarios para dibujar cada letra. 0x40 }. 0x78. 0x78. 0x3C }. porque es más cómodo de manejar. De este modo. Para los que tengáis interés. que el hexadecimal se usaba mucho porque era muy fácil de pasar al binario y viceversa. 0x44. 0x40. es copiar los números de arriba en hexadecimal ( aunque es lo mismo si los ponéis en binario o decimal). lo que nos lleva de cabeza al siguiente punto OPERACIONES CON BITS https://www.prometec. byte R[] = { 0x78. http://www. usaríamos 128 caracteres x 8 bytes = 1024 bytes Eso sí. 125 in decimal. resulta muy complicado explicar la solución a problemas que aun no has tenido.youtube. El problema es que tendremos que desempaquetar los bits para poder iluminar cada punto del display. // in binary: 0000000001100101 int c = a & b.prometec. si los dos son 1. pero un 0 si ambos son 1 o 0. Su símbolo es | int a = 92.http://www. Su operador es & (no confundir con && . // in binary: 0000000001011100 int b = 101. no en 8. // result: 0000000001111101.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . que es uno si cualquiera de ellos es un 1. 0x40. Veamos el resultado con un par de números: int a = 92. ir decimal 6 ¿Y para qué sirve todo esto? La pregunta del millón. Lo escribimos en hexadecimal. pero tranquilos que enseguida os pondré uno de estos. que es el operador lógico). 0x40 }.net/curso-kit-inicio/ http://www. Pues como siempre. // in binary: 0000000001100101 int c = a | b. y cero si ambos son 0. https://www. el resultado es 1.prometec. del siguiente modo: El resultado es uno si cualquiera de los bits es 1 o ambos lo son. Fijaros que realiza la operación bit a bit en binario. // result: 0000000001000100. También hay un operador XOR. // binary: 0110. Su símbolo es ^ int x = 12. 0x44. // binary: 1100 int y = 10. 0x40. 68 in decimal. Si hacemos esto para definir un juego completo de caracteres. Pero la idea es que la primera fila de la P está contenida en el primer 0x78 del array. 0x40. por comodidad. OR se calcula a nivel de bit. nos encaja y aún nos queda otro k de memoria para variables corrientes. byte P[] = { 0x78. pero vamos a ver que C++ tiene medios para eso. contenido en un único bit. // in binary: 0000000001011100 int b = 101. En caso contrario el resultado es 0.net/indice-tutoriales 55 Vamos a empezar con la P y con el array que la define gráficamente. AND se efectúa a nivel de bits. Vamos en primer lugar con la función AND a nivel de bit. Veamos la función OR. 0x78. // binary: 1010 int z = x ^ y. 0x44. Y lo mismo con el resto de las filas del dibujo. Cada uno de los bits que dibujan su primera fila está allí. alla vamos. // Hex 0x36 DEC 54 Y que queremos obtener el bit 3. Al desplazar a la izquierda. Pero Arduino contiene registros internos que podemos leer en bloques de 8 y cada bit representa el estado de una puerta digital. también con int. lee los registros en bloque y después hace operaciones a nivel de bit. OR. tendremos que usar este tipo de operadores y además utilizar los bitwise operators. Para extraer un bit concreto de un byte de datos. Veamos un ejemplo: int a = 5. http://www. Es muy parecido a lo que pasaba con un shift register. donde los bits eran empujados. y hay ocasiones en que mejorar la velocidad de tu programa puede ser crítico. XOR .youtube. right shift y left Shift. para mostrarnos el resultado de un digitalRead. Cuando haces un shift a la derecha. El caso de representar caracteres. byte n = 0b00110110 . Y existe el bitshif left equivalente cuyo símbolo es <<. // Vuelta al 5 inicial Si desplazamos 00000101. El primero es el operador >>. empezando por la derecha ( posición 2). ¿Cómo lo haremos? https://www. mediante matrices de puntos es uno de estos problemas.net/curso-kit-inicio/ http://www. funcionan igual con independencia del tipo de la variable. que hacerlo tú. que funciona desplazando tantos bits a la derecha un número. Y esto queridos amigos es más lento.prometec. pues armados ya con estas herramientas vamos a ver como sacamos un bit concreto de un byte concreto: • Estas operaciones de AND. Cuando queramos encender un punto LED en una matriz e 8×8. Bueno. OBTENIENDO BITS INDEPENDIENTES Supongamos que tenemos un número como este. // binary: 00000101 int b = a << 3. en el que estas operaciones serán críticas. el IDE de Arduino. // 40 en decimal int c = b >> 3. Asi que.prometec. leyendo su valor.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . long y demás. • De hecho. y los que entran son 0s. tres dígitos a la izquierda el resultado es 00101000. tendremos que sacar uno. los bits que entran por la derecha son 0s y los que salen se pierden sencillamente. // binary: 00000101.net/indice-tutoriales 56 • Hasta ahora hemos usado las puertas de Arduino de una en una. // binary: 00101000. es decir funciona. a uno los bits independientes de un byte que representan los puntos a iluminar o no. los bits salientes por la derecha se pierden. como HIGH o LOW. • No tengo intención de entrar en este tema aún (aunque todo llegará). pero es importante que os vaya sonando. // coger solo el ultimo bit return b . } Esta función nos devolverá un TRUE o FALSE según que el bit sea 1 o 0.youtube. os incluyo aquí un programita que te va listando los bits consecutivos de un número n cualquiera. Podemos escribir una función de propósito general para obtener un bit concreto de un valor: bool GetBit( byte N. de izquierda a derecha la posición es pos = 7 6 5 4 3 2 1 0 Podríamos empezar haciendo un rigt shift de 3 bits: byte n = 0b00110110. y vamos a tener ocasión de probarla. void setup() { Serial. que le pases en la primera línea: byte n = 0b01110110 . el resultado será 1. n >>3 = 0b00000110 // Los bits salen por la derecha y entran ceros por la izquierda Pero lo que nos interese es solamente el bit que está a la derecha ahora y no el resto. liquidamos todas las posiciones que llevan 0 y solo si el bit menos significante de n es 1.http://www.net/indice-tutoriales 57 Empecemos definiendo la posición de los bits a así. así pues haremos: byte resultado = n & 0b00000001 // Decimal 1 Al hacer el AND a nivel de bits. k>=0 .begin(9600).prometec. https://www. int pos) { // pos = 7 6 5 4 3 2 1 0 int b = N >> pos . } void loop() { for ( int k=7.net/curso-kit-inicio/ http://www. k--) { byte m = GetBit( n. k). de lo contrario será 0.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . A modo de diversión.prometec. // Shift bits b = b & 1 . Serial. que tenía pendiente comentaros(y este no parece mal momento).net/indice-tutoriales 58 Serial.http://www.print(". int pos) { // pos = 7 6 5 4 3 2 1 0 int b = N >> pos . // Shift bits b = b & 1 .youtube.prometec. } Por cierto. acepta modificadores para decirle si queremos que el resultado salga en binario. int n = 415 . } void loop() { Serial.println(). Serial. } bool GetBit( byte N.begin(9600). void setup() { Serial. Serial. que nuestro Serial. decimal. // coger solo el ultimo bit return b .net/curso-kit-inicio/ http://www.print.print(n.prometec.print(n.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . } Serial.print(m). https://www. "). DEC). BIN). ").print(". hexadecimal. net/indice-tutoriales 59 Serial. OR.print(". Serial. que nos permite sacar un bit independiente de un byte previo y que seria muy fácil extender otros tamaños.youtube.print(".print con modificadores. como rerpresentar caracteres graficos. hexadecimal. o Hemos preparado una función genérica GetBit. y como codificar de modo compacto esta información bit a bit. en una matriz de puntos. ").com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . XOR o Hemos hecho algún ejemplo de desplazamiento de bits a derecha e izquierda. o Describimos la forma de usar Serial.prometec. Serial. HEX). Serial. binario u octal. o Presentamos los operaciones básicas de bits AND. RESUMEN DE LA SESIÓN • o Hemos visto. OCT). ").print(n. para que formatee la salida en decimal. } Y así espero ahorraros algún dolor de cabeza convirtiendo formatos. http://www.prometec.println(n.net/curso-kit-inicio/ http://www. https://www. Una Protoboard más cables.prometec.net/indice-tutoriales 60 37-MATRIZ LED DE 8×8 Arduino y los array de 8x8 LED Home Matriz LED De 8×8 OBJETIVOS • o Presentar las matrices LED de 8×8.youtube.prometec. o bien Una matriz de LEDs 8×8 1388ASR https://www. MATERIAL REQUERIDO. o Programar un mensaje móvil.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Arduino UNO o equivalente. http://www. 8 x resistencias de 330Ω. o Mostrar un circuito de muestra. Una matriz de LEDs 8×8 1588AS .net/curso-kit-inicio/ http://www. net/curso-kit-inicio/ http://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . La idea. para demostración de lo que podríamos hacer con una docena de estos simpáticos displays. e incluso las hay de una matriz RGB (Os dejo imaginar la de pines que tiene). definiendo matrices de puntos para representar las letras. para el display LCD. Utilizaremos una única matriz e iremos arrastrando. que espero.youtube. una matriz de diodos LED normales y corrientes que se comercializa en multitud de formatos y colores. como su nombre indica. https://www. hace gala de esa creatividad. cuando definimos el símbolo de grado.net/indice-tutoriales 61 LAS MATRICES LED Parece que los LEDs se fabrican en todos los tamaños y formatos imaginables. letras y símbolos.prometec. sirva como demostración de cómo manejarla y de lo que se puede hacer con este tipo de material. es que como tenemos una matriz de 8×8 podemos dibujar letras y símbolos de la misma manera que ya hicimos en el pasado. de nuestro tutorial Arduino. y este componente que os presentamos hoy.prometec. Las matrices de LEDs (o LED arrays) son. a las que tienen varios colores posibles. que luego sacaremos por el Display. En esta sesión.http://www. vamos a usar una matriz de 8×8 LEDs de color rojo. Desde las de un solo color. Es decir. Porque este es uno de esos casos en los que el fabricante.prometec.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . ha decidido mezclar unas y otras de forma aleatoria. hasta han acuñado un acrónimo en inglés para ello: RTFM. digamos la fila 4. que se conectan a las filas y las columnas. por supuesto) y el pin col 2 x fila 4.net/curso-kit-inicio/ http://www. Si alguno creíais que las 8 filas y 8 columnas de la matriz corresponderían a las dos filas de pines. aplicar la regla número uno. https://www. De hecho. son diodos LED totalmente normales. Buscad el manual del fabricante en Google (es más fácil de lo que crees). • Dependiendo del fabricante podéis encontrar de ambos tipos.net/indice-tutoriales 62 Por lo demás. digamos la 2. se encenderá. organizados en forma de matriz. no se iluminara nada aun. Pero cuando hagamos LOW en. que me ahorraré traducir.youtube. se cerrara el circuito a GND (con una resistencia de limitación.prometec. donde una fila serían las columnas y la otra las filas. Si ponemos HIGH en una columna. vais dados. http://www. iniciales de una bonita frase. Así pues. • Si los diodos se unen por el positivo. por razones inescrutables a los mortales comunes. que tendremos que multiplexar para poder iluminar uno u otro punto. haciendo poco menos que imposible adivinar cuál es cual sin el manual y convirtiendo el cableado en una pesadilla. se dice que son matrices de Ánodo común (El nombre pedante del positivo) y se se une por el negativo decimos que son de Cátodo común. lo lógico ¿no?. tal y como hicimos en la sesión del teclado matricial. • Por cierto en Internet encontrareis muy a menudo lo de léete el manual. Este componente se presenta con dos filas de 8 pines cada una. el resto es fácil. • Lo que yo he hecho ha sido conectar 5V y GND. y buscar los pines 13 y 9 correspondientes a la columna 1. Os recomiendo que una vez que lo hayáis localizado. pero sobre todo nos dice que pines del chip son cada fila y columna.net/indice-tutoriales 63 Así pues vamos con el manual del 1588AS : Fíjate que aquí lo importantes es. yo no he sido capaza de localizar una marca que lo indique. fila 1.prometec. vayáis conectando el resto de los pines poco a poco y vayáis probando las conexiones. En mi caso he conectado las columnas de la siguiente manera: MATRIZ 13 3 4 10 6 11 ARDUINO 2 3 4 5 6 7 Y las filas: https://www. pero en mi chip.net/curso-kit-inicio/ http://www. la descripción de la matriz.youtube. el manual marca con una cruz el pin 1. http://www. a pesar de que si os fijáis. donde nos habla de filas y columnas.1 se encendió. A partir de ahí. hasta que el punto 1.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. con una resistencia de 330Ω. y aquí. Ya solo nos falta saber cuál de los pines es el uno. no he sido capaz de encontrar ninguna marca asimétrica. com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 64 MATRIZ 9 14 8 12 1 7 ARDUINO 10 11 12 13 A0 A1 Kit de Inicio Prometec.prometec.http://www. https://www. la configuración e sintercambiable.youtube. el display que viene es un 1388ASR.net Para los que uséis el nuevo kit de inicio de Prometec.net/curso-kit-inicio/ http://www.prometec. que es un modelo de Ánodo comun. la disposición de los pines es diferente y su definición es esta: La conexión a vuestro Arduino es como sigue: MATRIZ 1 2 6 11 7 13 ARDUINO 2 3 4 5 6 7 Y para las filas: MATRIZ 12 15 10 16 5 9 ARDUINO 10 11 12 13 A0 A1 Fijaros en que como conectamos la misma disposición de filas y columnas a nuestro Arduinoy en el mismo orden de pines. http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 65 Aquí os dejo un programita que va barriendo la matriz y os ayudara comprobar las conexiones Prog_37_0 Creo que esta va a ser la primera, y espero que ultima vez, que no vamos a incluir esquema ni protoboard, para mostrar las conexiones, porque no he encontrado ninguna pieza para Fritzing con una matriz como esta, y porque creo que añadiría muy poco, a las tablas de arriba. EL PROGRAMA DE CONTROL El programa de barrido que hemos usado para comprobar que teníamos bien conectados los puntos, contiene ya la base de nuestro programa de control. void setup() // Prog_37_1 { for (int j=2; j<19; j++) pinMode(j, OUTPUT); } void loop() { for (int j=2; j<10; j++) { digitalWrite(j, HIGH); //Levantamos la columna for (int k= 10 ; k<18 ; k++) { digitalWrite(k, LOW); //Encendemos el punto delay(250); digitalWrite(k, HIGH); //Apagamos el punto } digitalWrite(j, LOW); //Bajamos la columna } https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 66 } Lo importante en el, es que en primer lugar definimos en el setup como salidas de los pines 2 al 19. ¿ AL 19 ?. ¡No existen tantos pines!. Bueno, en realidad sí. Ya vimos en su momento que los pines analógicos e A0 al A5 se podían usar como pines digitales normales. Y cuando es así podemos numerarlos como pines digitales del 14 al 19. Me he aprovechado de esta curiosidad, para que sea más cómodo escribir el programa. Para iluminar un punto concreto, en primer lugar poner en LOW todas las columnas y en HIGH todas las filas, lo que apaga todo. Después levantar la columna que contiene el punto a iluminar. Fíjate que esto de por sí, no va a encender nada aun. Sera cuando pongamos una de las filas en LOW, cuando se cerrara el circuito y un punto se iluminara. La curiosidad de esto, es que el diodo se ilumina cuando ponemos 0 en una fila, no un 1 como hasta ahora. A esto se le llama, lógica negativa, porque la acción se ejecuta con un valor bajo y no alto. Entonces ¿ Cómo hacemos para mostrar un carácter, digamos la P? Pues tal y como vimos en la sesión previa. Dibujando cuadraditos en un papel cuadriculado. Pero, ¿Entonces, tenemos que definir una matriz por cada letra que quiero representar? La respuesta, querido amigo, es un rotundo SI. Y no solo para cada letra, mayúscula y minúscula, sino también para cada número y símbolo que quiera representar. • De hecho este es el primer sistema que los ordenadores han usado desde el principio para dibujar los caracteres en pantalla. Para escribir PROMETEC, tendremos que definir las letras correspondientes: byte P[] = { 0x78, 0x44, 0x44, 0x78, 0x40, 0x40, 0x40, 0x40 }; byte R[] = { 0x78, 0x44, 0x44, 0x78, 0x70, 0x58, 0x4C, 0x46 }; byte O[] = { 0x3C, 0x42, 0x42, 0x42, 0x42, 0x42, 0x42, 0x3C }; byte M[] = { 0x66, 0x7E, 0x5A, 0x42, 0x42, 0x42, 0x42, 0x42 }; byte E[] = { 0x7C, 0x40, 0x40, 0x78, 0x78, 0x40, 0x40, 0x7C }; byte T[] = { 0x7E, 0x18, 0x18, 0x18, 0x18, 0x18, 0x18, 0x18 }; byte C[] = { 0x7c, 0x40, 0x40, 0x40, 0x40, 0x40, 0x40, 0x7C }; byte N[] = { 0x42, 0x62, 0x72, 0x5A, 0x4E, 0x46, 0x42, 0x42 }; byte dot[]={ 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x06, 0x06 }; byte sp[]= { 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00 }; https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 67 Vamos ahora, a ver como sacamos una de estas letras en el display. Lo primero es que vamos a usar la función GetBit de la sesión anterior para sacar la información a presentar en el display. bool GetBit( byte N, int pos) { // pos = 7 6 5 4 3 2 1 0 int b = N >> pos ; // Shift bits b = b & 1 ; // coger solo el ultimo bit return b ; } Por tanto barreremos filas y columnas, para posicionar cada punto, y leeremos con GetBit si debemos iluminarlo o no. Vamos a empezar definiendo el setup y ell array para la P: byte P[] = { 0x78, 0x44, 0x44, 0x78, 0x40, 0x40, 0x40, 0x40 }; void setup() { for (int j=2; j<19; j++) pinMode(j, OUTPUT); Serial.begin(9600); } Y ahora definimos un esqueleto que barra filas y columnas, sin preocuparnos de los números de pin: void loop() { for (int fil = 0; fil <8 ; fil++) { byte F = P[fil] ; for (int col =7; col >= 0 ; col--) { } Serial.print(F, HEX); https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 68 Serial.print(", "); } Serial.println(); } Los print centrales han sido para comprobar que lee correctamente (que nunca se sabe). Vamos ahora a buscar el bit para cada fila y columna, y lo sacaremos en pantalla, para asegurarnos de que lee bien los bitss: void loop() { for (int fil = 0; fil <8 ; fil++) { byte F = P[fil] ; for (int col =7; col >= 0 ; col--) { bool b = GetBit(F, col) ; Serial.print(b); Serial.print(","); } Serial.println(); } Serial.println("----------------------"); } https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos prometec. Y las filas son activas en LOW. que presenta correctamente los valores de cada bit. j++) // Valores de los pines de columna digitalWrite(j. Vamos a comprobarlo Col 0 1 2 3 4 5 9–0 9 -1 9-2 9-3 9-4 9-5 pin 9 8 7 6 5 4 A que no era para tanto.con este sí que os atrevéis. LOW). por lo que que todas a HIGH. ¡VA! Pensad un poco. Ya encenderemos luego los que nos interesen. y no hay más. vamos a ver despacito como hacemos esto. HIGH).net/indice-tutoriales 69 Volvemos a comprobar. // Todos apagados for (int k= 10 . Si entornáis los ojos casi se ve la P entre los 1s y 0s Ahora nos queda convertir los valores fila y columna a pines de Arduino. Pin = 9 – col . El programa quedara más o menos así void loop() // Prog_37_1 { https://www. Esto nos garantiza que todos los puntos se apaguen.youtube.http://www. Vamos ahora a ver como convertimos las filas del 0 al 7 en pines del 10 al 17…. Recordad que las columnas van del pin2 al pin9 de Arduino.net/curso-kit-inicio/ http://www. Queremos convertir valores de columnas que van del 7 al 0. según lo definimos en GetBit. Como este no es mi primer baile. Una que apague todos los puntos LED para borrar el display: void Clear() { for (int j=2. con lo que ya hemos desempaquetado el valor de cada punto del display. ¿Qué formula aplicamos?. Nos falta otra pequeña función antes de escribir el programa completo. j<10. k<18 . k++) digitalWrite(k. en valores de pin que van del 2 al 9. pero la dos corresponde a nuestra columna 7. así que ponemos todas a LOW. // Todas las filas cortadas } Las columnas son activas en HIGH.prometec. ¿No? Pin = fil + 10.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Basta con esto. col . // Activamos la fila para el barrido byte F = P[fil] . col--) { bool b = GetBit(F. LOW) . if (b) digitalWrite( 9 . Y eso es lo que haremos con el siguiente programa.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . //Levantamos la columna else digitalWrite( 9 .http://www.prometec. Bueno. // Apagamos fila antes de salir } } Podéis comprobar que pinta una bonita P en el display. Claro que estaría bien.HIGH).col . poder elegir que letra vamos a dibujar.prometec. vamos bastante bien.net/curso-kit-inicio/ http://www. col >= 0 . // Si 0.LOW). col) . for (int col =7.net/indice-tutoriales 70 Clear().youtube. Para https://www. for (int fil = 0. fil <8 . fil++) { digitalWrite( fil + 10 . HIGH) . apagamos } digitalWrite( fil + 10 . } Y además.http://www. a la que llamaremos pasándole el carácter que queremos dibujar y la fila en que nos encontramos (para que nos devuelva la fila correspondiente):Prog_37_2 byte Selecciona( char c. col >= 0 . if ( c == 'M') return( M[fil]).prometec.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . fil++) { digitalWrite( fil + 10 . vamos a escribir otra función . if ( c == 'T') return( T[fil]). if ( c == 'R') return( R[fil]) .net/indice-tutoriales 71 ello. LOW) . // Activamos la fila para el barrido byte F = Selecciona( p. a la que pasamos el carácter que queremos mostrar. y dentro de esta función llamaremos a Selecciona () para leer la información del array correspondiente. fil).prometec. for (int fil = 0. if ( c == 'N') return( N[fil]). modificaremos nuestro anterior loop. if ( c == '. void SetChar(char p) { Clear(). if ( c == 'O') return( O[fil]). byte fil) { if ( c == 'P') return(P[fil]) .') return( dot[fil]). if ( c == 'C') return( C[fil]). para convertirlo en una función. for (int col =7. if ( c == ' ') return( sp[fil]). fil <8 .youtube. if ( c == 'E') return( E[fil]).net/curso-kit-inicio/ http://www. col--) https://www. LOW). con su pin digitalWrite( 9 .length(). char c = s[n]. while ( millis()< t+ 400) SetChar(c).prometec.net/indice-tutoriales 72 { digitalWrite(8-col.youtube.HIGH).col . else digitalWrite( 9 .col . if (b) //Levantamos la columna. n< l.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . apagamos } digitalWrite( fil + 10 . int l = s. col) .prometec. // Apagamos fila antes de salir } } Ya solo falta escribir el loop: void loop() { String s = "PROMETEC. n++ ) { long t = millis().net/curso-kit-inicio/ http://www. HIGH) . } } https://www. // Si 0.LOW).NET " . //Bajamos la columna bool b = GetBit(F.http://www. // Calcula la longitus de s for ( int n = 0. youtube. Ya comentamos en alguna sesión previa. Aqui os dejo un pequeño video con el resultado RESUMEN DE LA SESIÓN • o Hemos visto.net/curso-kit-inicio/ http://www. antes de que vuelva a empezar con la función. Como he definido los espacios como todo apagado. las letras del String s y llamar a Setchar para que la represente. y como codificar de modo compacto esta información bit a bit. Cuando necesitéis un retraso. Pero con una complicación adicional. Esto nos da un retraso adicional. probadlo) porque la imagen en el display depende de la velocidad a la que refrescas los puntos. http://www. o A medida que los prgramas se van complicando. para representar un caracter en el display. • Fijaros que he añadido un par de espacios al final del string s. para que no os aburráis. y no podáis poner un delay. o Hemos creado un programa que va sacando esa informacion.prometec. utilizar un while como este suele ser seguro. como rerpresentar caracteres graficos.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . es ir tomando una a una. en pequeños pedazos que sean acometibles. vamos viendo como partir problemas. bit a bit. y el delay sencillamente lo impide.net/indice-tutoriales 73 Que lo único que hace. o en este caso puntos.prometec. como ahora. en una matriz de puntos. https://www. cualquier intento de utilizar un delay acabará en desastre ( No me creáis. que cuando multiplexas segmentos. com/tutorials/serial-peripheral-interface-s Los errores que haya en esta sesión son ciertamente míos.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Esta sesión es prácticamente una traducción literal de la págin el mismo tema.sparkfun. pero la realidad es terca.net/indice-tutoriales 74 38-EL BUS SPI Arduino y el Serial Perifereal Interface Home El Bus SPI OBJETIVOS • o Comprender los problemas de la comunicación serie. a la misma velocidad.net/curso-kit-inicio/ http://www.prometec. porque esta va ser teóricas que si bien te puedes saltar casi sin que se note. sencillamente suponemos que todo ha ido bien. o Mostrar la conexión con uno y con múltiples esclavos. LA COMUNICACIÓN SERIE Si ya tenemos un protocolo de transmisión de datos asíncrono como las puertas series que vimos anteriormente ¿Por qué necesitamos otro bus serie? ¿Hay algo malo con la comunicación serie del que no hayamos hablado? Teóricamente no hay ningún problema.prometec. o Ventajas e inconvenientes con el Bus I2C. y así dijimos que bastaba con definir una velocidad común para transmitir datos inmediatamente entre dos puntos. bien porque no está a la misma velocidad o bien porque sencillamente esta en babia. No tenemos ninguna garantía de que ambos extremos estén. que podéis encontrar en https://learn. es co conceptos que hay detras de un bus de comunicaciones. MATERIAL REQUERIDO. o Presentar el bus SPI. pero ya sabéis que el demonio está en los detalles. https://www. per directamente atribuible a Sparkfun. Paciencia y buena disposición de espíritu. No tenemos ninguna manera de garantizar que la otra parte ha recibido el mensaje. http://www.youtube. lo que puede hacer que enviamos todos nuestros datos y la otra parte no se entere. de hecho. Murphy se frota las manos. Se añade un par de bits extra a la comunicación en forma de un bit de Start y otro de Stop. https://www.net/curso-kit-inicio/ http://www. normalmente dentro la placa de circuito impreso. ademas de un cachondo. que ha ganado bastante aceptación en la industria como sistema de comunicación de muy corta distancia. Algún día recibirá el reconocimiento que merece. porque utiliza unas líneas diferentes para los datos y el Clock. Pero esto supone además un aumento en el hardware para decodificar la señal y sincronizar los relojes. entre las que se encuentran el bus I2C que ya vimos en su día y el bus SPI que vamos a ver ahora.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . El primer problema que suele aparecer es que las velocidades a en los dos extremos sean diferentes. • Todavía hay mucha gente que cree que Murphy era un pesimista. EL BUS SPI. Es un protocolo de transmisión que permite alcanzar velocidades muy altas y que se diseñó pensando en comunicar un micro controlador con distintos periféricos y que funciona a full dúplex (Una forma retorcida de decir que puede enviar y recibir datos al mismo tiempo). seguro que irá mal y además en el peor momento.prometec. Para corregir este problema. El Clock es una señal que indica al que escucha exactamente cuándo leer las líneas de datos. podemos re sincronizar los relojes de ambos extremos usando estos bits de Start y Stop. Y puestos a complicar las cosas ¿Porque no buscar una solución síncrona al problema? La solución que dio la industria fue múltiple. pero no. entre dispositivos electrónicos presentado por Motorola en 1982. UNA SOLUCIÓN SÍNCRONA El SPI es un protocolo de comunicación síncrona de 4 hilos. O sea dos relojes a poner de acuerdo.youtube. (Fijaros que para enviar 8 bits de datos ahora tenemos que enviar 10 bits) De este modo aumentado en un 25% (8bits / 2) en la carga de trasmisión serie. http://www. con lo que el problema de perdida de sincronía se elimina de raíz. que dice que si algo puede ir mal. Fin de la comunicación (Seguro que a estas alturas ya habéis experimentado este problema entre Arduino y la consola en algún momento) El segundo problema es que la forma de fijar la velocidad pactada se debe hacer con un reloj propio a cada extremo.net/indice-tutoriales 75 • Este es un buen momento para mencionar la ley de Murphy.prometec. SPI utiliza una solución síncrona. en las comunicaciones seria se pacta otro aspecto que hasta ahora no habíamos comentado. Es cuestión de tiempo de que pequeñas diferencias entre los cuarzos que los sincronizan den lugar a problemas de comunicación. Lo que es una solución mucho más simple (Y barata) que una UART (Universal Asíncronous Receiver Transmitter o sistema universal asíncrono de recepción y transmisión serie) de comunicación serie. lo hace por una línea de datos que normalmente de nombre MOSI (Master Out Slave In) y si el esclavo responde lo hace a través de una línea llamada MISO (Master In Slave Out) siguiendo una de esas tradiciones de imaginación desbordante en los nombres tecnológicos.prometec. pudiendo haber uno o varios en el bus.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . no se necesita pactar la velocidad de transmisión. COMO SE RECIBEN LOS DATOS En un bus SPI una de las partes genera el Clock al que llamamos master. ya que será el Clock quien fije la velocidad y puede ser variable a lo largo de la comunicación sin que sea un problema (Aunque por supuesto según el dispositivo habrá un límite de velocidad). Uno de los motivos por los que SPI es tan popular es que el hardware de recepción puede ser un sencillo Shift register como los que vimos en la sesión N. A la señal de reloj se le suele llamar CLK por Clock o SCK por Serial Clock.prometec.http://www. https://www.net/indice-tutoriales 76 Por eso mismo. Cuando el master envía información.net/curso-kit-inicio/ http://www. y el resto son los esclavos. que le envié una lectura. si un esclavo va a devolver una respuesta y de que longitud. Basta con activar la línea correspondiente y el esclavo esta listo para recibir sus órdenes https://www.net/indice-tutoriales 77 Como es el master quien genera el Clock. BUS CON MÚLTIPLES ESCLAVOS Hay dos maneras de conectar múltiples esclavos a un bus SPI.prometec. necesita saber de antemano.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. para mantener el Clock hasta que la transferencia esté completa. y así evitar que dos hablen a la vez. digamos un sensor. o bien que se reclama que envié una respuesta a una petición del master. normalmente sabemos que van ser 2 bytes. Con una línea SS por cada esclavo o en cascada: En general cada esclavo requiere su propia línea SS para ser activado. Esto no es normalmente un problema porque cuando el master pide a. llamada Slave Select o SS. que indica a un esclavo que el mensaje que viene es para él. porque el resultado sería ruido inútil. SELECCIÓN DE ESCLAVO SLAVE SELECT SS Hay una última línea de control. lo que despierta al esclavo seleccionado. Cuando se termina la transferencia la línea se levanta a HIGH y el esclavo se desactiva.http://www.net/curso-kit-inicio/ http://www. La línea SS normalmente se mantiene HIGH y se activa con LOW. En este caso incluso podemos desconectar la línea MISO Por último y para cerrar esta sesión.net/indice-tutoriales 78 Es un sistema cómodo. Envía y recibe a la vez lo que aumenta la velocidad. • Más rápido que el I2C y que el puerto Serie asíncrono normal https://www. En este caso solo usamos una única línea SS. Esta configuración es típica de una situación en la que le master envía datos pero no recibe nada de vuelta. siempre y cuando no sean muchos esclavos porque podemos necesitar muchas líneas.prometec. COMPARACIÓN CON I2C Y CON PUERTO SERIE NORMAL Ventajas del Bus SPI • Comunicación Full Duplex. http://www.prometec. Cuando el número de esclavos crece suele ser más frecuente conectarlos en cascada.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . como en el caso de una cadena de múltiples display LEDs ( Matrices de 8×8) .net/curso-kit-inicio/ http://www. con el MISO de uno (Salida). en los que se envía información para ser mostrada pero. comentar que naturalmente vuestro Arduino soporta de serie el bus SPI. que se comparte entre todos los esclavos.youtube. con una librería estándar que sorprendentemente se llama SPI y que podéis instalar tranquilamente. que gestiona todas las complicaciones y el arbitraje del protocolo. conectado al MOSI (Entrada) del siguiente. no hay datos de vuelta. ICSP-4 50.prometec. se espera que obedezca y punto. ICSP-1 52. ICSP-4 12.net/indice-tutoriales 79 • El tamaño de los mensajes puede ser arbitrariamente grande • Se requiere un hardware sencillo (Léase barato) • Requiere un menor consumo y menor electrónica de conexión que el I2C • Como el Clock lo proporciona el master. estaban fijados a unos ciertos pines. Eso significa. que para controlar el bus SPI es necesario usar esos pines inexcusablemente. aunque podemos elegir entre dos juegos de ellos. ICSP-3 53 Leonardo ICSP-4 ICSP-1 ICSP-3 Z DUE ICSP-4 ICSP-1 ICSP-3 z • Fijate que aunque los pines del bus SPI cambian según el modelo de Arduino que usemos. http://www. https://www. • No hay señal de conforme del esclavo. los esclavos no necesitan osciladores ( O sea. siempre son los mismos en el ICSP. entre ciertos pines digitales. ICSP-1 13. tradicionalmente estos. • Las comunicaciones tiene que estar perfectamente establecidas de antemano.youtube. No puedes enviar mensajes de diferentes longitudes cuando te convenga.prometec.net/curso-kit-inicio/ http://www. según el modelo y la tabla que especificamos abajo. PINES SPI EN ARDUINO Aunque últimamente han aparecido algunas librerías que nos permiten mover de sitio los pines de control del SPI en nuestros Arduino. Esos pines son: MODELO ARDUINO MOSI MISO SCK SS SLAVE UNO 11. ICSP-3 10 MEGA 51. y usando los equivalentes en el bus ICSP. • Master único y casi sin posibilidad de master múltiple • Funciona solo en distancias muy cortas • Normalmente necesita un pin adicional por cada esclavo y si el número de esta creces puede acabar siendo un problema. las desventajas son: • Necesita más pines que el I2C o el Puerto serie normal. otra vez más barato) Y como en la vida no hay nada gratis.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . http://www.net/curso-kit-inicio/ http://www.youtube. y con la comunicación serie normal. https://www.prometec.net/indice-tutoriales 80 • Eso permite diseñar Shields coherentes con todos los modelos de Arduino. Los pines ICSP son esos que están a la derecha centrados cuando leemos los rotulos en la placa: RESUMEN DE LA SESIÓN • o Hemos tratado de mostrar porque hay ocasiones en los que el puerto serie tiene limitaciones graves.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. o Presentamos el bus SPI y sus líneas de control. o Hablamos de las ventajas e inconvenientes de este bus con respecto al bus I2C que vimos en sesiones previas. o Vimos como conectar múltiples esclavos al bus. com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . con gobernada por un MAX7219 LAS MATRICES LED https://www.prometec.net/indice-tutoriales 81 39-MATRIZ LED 8×8 CON MAX7219 Y SPI Arduino y los arrays de 8x8 SPI Home Matriz LED 8×8 Con MAX7219 Y SPI OBJETIVOS • o Presentar las matrices LED de 8×8 controladas por MAX7219. Una Protoboard más cables.net/curso-kit-inicio/ http://www.prometec. Una matriz de LEDs 8×8. o Mostrar un circuito de muestra. o Programar diferentes mensajes. MATERIAL REQUERIDO. Arduino UNO o equivalente. http://www..youtube. prometec. https://www.youtube. Sus características son: • Entrada y salida en serie. ya estáis familiarizados con la idea. http://www. pesado o molesto. para necesitar menos pines. no son una excepción. • Es barato y se consiguen por pocos euros. las lleva incluidas. alguien se descuelga con un chip integrado que nos resuelve la papeleta y así podemos dedicarnos a pensar en lo que queremos y no estar preocupados por si se suelta un cable o por si habremos definido bien las matrices de caracteres. De hecho. Así que la única razón para manejar cualquier tipo de displays LED a mano y cableando. Mayúsculas. • Es compatible con SPI y QSPI. (Algún día tendremos que hablar del SPI). pero en el mundo real usaremos un chip de este estilo. por trabajoso. el MAX7219/MAX7221 que nos hace reconciliarnos con las matrices LEDs y hasta con los displays de 7 segmentos. de que cuando en electrónica algo es un asco.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . • Incluye decodificador BCD (No hay necesidad de dibujar matrices de caracteres. • Incluye memoria de los caracteres. porque nos ahorrará muchas horas de improperios. es la de comprender un circuito y aprender (Sufriendo por supuesto). • Solo requiere una resistencia externa para los 64 LEDs. Y como ya sospechabais. • Bar graph displays o Barras de LEDs.net/indice-tutoriales 82 Si me habéis aguantado hasta aquí.prometec. • Se encarga del multiplexado de los caracteres y dígitos. • Matrices de 8×8 o hasta 64 LEDs individuales. las matrices LED de 8×8. minúsculas y hasta números y signos).net/curso-kit-inicio/ http://www. tenemos un integrado muy extendido del fabricante Maxim. • Controla displays de 7 segmentos de hasta 8 dígitos. com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . ya nos venden unas plaquitas con una matriz gobernada por un MAX7219 y con pines para olvidarnos de las complicaciones.net/indice-tutoriales 83 En el futuro incluiremos alguna sesión mostrando como manejar displays con el chip directamente.net/curso-kit-inicio/ http://www. es decir. montar hasta 8 en serie.youtube. pero de momento vamos a empezar por una placa que incluye una matriz de 8×8 con uno de estos chips.prometec. La conexión con nuestros Duino es a través de un puerto serie asíncrono SPI ESQUEMA DE CONEXIONES De nuevo.prometec. cuando se usa un controlador externo. Y para la protoboard https://www. Por menos de lo que valen los componentes. la conexión es trivial.http://www. Son fáciles de montar en una protoboard y con la ventaja añadida de que se pueden cascadear. // Poner el brillo a un valor intermedio lc. llamada LedControlMS y que podéis descargar desde aquí Libreria adafruit LEDControl Una vez que la hayáis instalado con Programa\Importar Librería\Añadir librería. uno de momento y crear una instancia de la clase LedControl.setIntensity(i.net/curso-kit-inicio/ http://www. Hay que levantarlas for (int i=0.shutdown(i.8). pasándole los pines de control y por último el número de matrices que vamos a usar: #define NumMatrix 1 LedControl lc=LedControl(12.prometec. // Y borrar todo https://www. // Activar la matriz lc.11.http://www.h" Después indicar cuantos displays vamos a usar.10.prometec. Cuando arrancamos las matrices están en modo standby.youtube. NumMatrix). debéis lo primer hacer el include correspondiente: #include "LedControlMS.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . i< NumMatrix .net/indice-tutoriales 84 EL PROGRAMA DE CONTROL Para manejar el array. i++) { lc.clearDisplay(i). existe disponible una librería de control.false). delay(1000). // Y borrar todo } } void loop() { lc.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net ").10.http://www. En resumen.writeString(0. } https://www. // Activar las matrices lc.clearDisplay(i). i++) { lc.8). NumMatrix).false). // Poner el brillo a un valor intermedio lc.setIntensity(i.prometec." Curso Arduino de Prometec.net/curso-kit-inicio/ http://www. el programa completo para escribir un mensaje quedaría así: Prog_38_1 #include "LedControlMS.youtube.prometec.11.net").net/indice-tutoriales 85 } Y ya solo queda escribir el mensaje: lc. i< NumMatrix .h" #define NumMatrix 1 // Cuantas matrices vamos a usar LedControl lc=LedControl(12.writeString(0.shutdown(i. // Creamos una instancia de LedControl void setup() { for (int i=0."Curso Arduino de Prometec. youtube. esta librería por debajo. ni preocuparnos de multiplexar los pines.No tenemos que definir arrays de caracteres.net/curso-kit-inicio/ http://www. Definir arrays de caracteres y funciones de multiplexado de LEDs. http://www. igual igual que en la sesión anterior. muy por encima. las caracteristicas MAX7219. porque haciendo \\Programa\Añadir fichero podéis buscar dos programas en vuestro directorio de librerías. • Pero no os equivoquéis.cpp veréis los programas que forman la librería(No os asusteis. hace exactamente lo que vimos en la sesión anterior.net/indice-tutoriales 86 Como podeis ver.prometec. que se manejan muy facilmente si queremos sacar mensajes de texto o numeros. pero esto es porque los chicos de Adafruit. se han trabajado una librería para nosotros. RESUMEN DE LA SESIÓN • o Hemos visto. • Soy un fiel defensor de trabajar lo mínimo para conseguir nuestros objetivos (en la jerga informática se llama optimizar recursos). https://www. o En el futuro volveremos sobre este integrado. Entre tanto aqui os dejo un mini video con el resultado. • Si tenéis interés. a los que nunca les daremos suficientemente las gracias. que las libreiras no estan hechas para que las entiendan los novatos). o Hemos visto que ya nos venden montadas con bus SPI modulos con array de 8×8 y unMAX7219. porque resuleve muy bien la problemática de displays LEDs de diferentes tipos. (Alguien habrá digo yo) podéis verlo.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . que suele ser\Documents\Arduino\libraries\LedControlMS en Windows y si cargáis LedControlMS.prometec. youtube. Arduino UNO o equivalente.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Una Protoboard larga más cables.prometec. o Desplazar esos textos por la pantalla (Scrolling).net/curso-kit-inicio/ http://www. http://www. Aquí vamos a us AGRUPANDO MATRICES LED 8×8 https://www. MATERIAL REQUERIDO.net/indice-tutoriales 87 39B-SCROLLING CON MAX7219 Desplazamiento lateral de mensajes en el display Home Scrolling Con MAX7219 OBJETIVOS • o Continuar jugando con los displays MAX7219. con un MAX7219. Vais a necesitar cables macho / macho y al menos 4 macho/h Varias matrices LEDs 8×8.prometec. o Montar un grupo de displays que nos permita mostrar líneas de texto. Y entonces recordé que esta era una de las aplicaciones más simpáticas de estos displays. Pero recientemente un amable lector. y además este es uno de esos encantadores casos de que un único cable mal puesto arruinará el circuito.net/indice-tutoriales 88 Cuando montamos el primer tutorial de estas pequeñas matrices LED 8×8 estábamos centrados en montar una colección de tutoriales que pudiera usar. Por eso. y así. esperamos que nos disculpéis si se nos fueran quedando cosas en el tintero y nos olvidásemos de tocar algunos temas que sin duda podrían ser de interés. para iniciarse en Arduino y no íbamos sobrados de tiempo para otros menesteres. y que en su día se quedó fuera. más por falta de oportunidad que de ganas. volviéndolo prácticamente inútil. En primer lugar os conviene usar una protoboard larga que os permita acomodar los displays que vais a usar. pero que quizás. ( En mi caso 4) y por eso me las he traído al frontal de la protoboard. quien tuviera interés.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . para mostrar la forma de mover mensajes por la pantalla.youtube. Y por eso.prometec. queridos amigos. en esta sesión vamos a intentar reparar tan desafortunada omisión. seguro que los seguidores más osados podrán hacer mezclas de ambos a su gusto. y que montar un grupo de ellos en fila podía ser de una cierta utilidad para más de uno de nuestros lectores. haciendo ese desplazamiento (Scrolling) tan típico de displays de LEDs de mayores dimensiones. nos animó a escribir una sesión en la que usáramos una colección de estas matrices 8×8 basadas en el MAX7219. y de cómo desplazarlos por la pantalla cuando lo deseéis. algunas ideas se fueron quedando fuera.prometec. aquel no era el momento. porque no sobran sitios donde pinchar los cables. ESQUEMA DE CONEXIONES Antes de que empecéis a cablear este ejemplo tenéis que entender que os vais a hartar a colocar cablecitos en la protoboard.http://www. Vamos a montar los ejemplos sencillos de ambos casos y luego. Tomaros un tranquilizante y empecemos con calma. Así que ánimo.net/curso-kit-inicio/ http://www. montando un pequeño ejemplo de cómo podemos usar estos displays con MAX7219 para mostrar mensajes fijos por un lado. para informar o anunciar cosas. https://www. Yo he usado los colores habituales.prometec. Los displays MAX7219 tienen rotulado en la parte inferior la función de cada pin. https://www. http://www. unid todos los pines inferiores desde la protoboard de esta señal. rojos para Vcc y negros para GND. porque de lo contrario. es el que está más a la derecha (Sorpresa). • Este es uno de esos casos en que es imprescindible ser medio ordenado. pero si un tanto confuso de presentar en una protoboard con Fritzing.net/curso-kit-inicio/ http://www. Elegid otro color cualquiera para la señal de CS. Tened en cuenta que como vamos a mover el texto hacia la izquierda (Al revés.prometec.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . • Os recomiendo muy seriamente. y cuando acabéis haced lo mismo con GND ordenadamente. en mi caso Azul. Vamos a empezar uniendo el pin VCC de cada display al siguiente. Empecemos conectando los pines de Vcc y GND. así que vamos a usar una representación simbólica de las conexiones. que uséis cables de colores y os ciñáis a que cada color corresponda a un pin de señal. seria problemático de leer) el display número 1. es muy improbable que consigáis conectar todos los pines correctamente. y nada de lo que he visto me ha convencido. porque cuando tengáis que revisar porque no funciona (Uy sí. que creo que será más fácil de seguir. Os va a pasar casi con seguridad) tener un criterio de colores es lo único que nos salvará del desastre.youtube. Por eso conviene que empecéis cableando desde allí para evitar errores de interpretación.net/indice-tutoriales 89 Vamos a empezar colocando la alimentación de las matrices. El cableado de esta sesión no es complicado. http://www.prometec.net/indice-tutoriales 90 Ahora hagamos lo mismo con todos los pines de Clock (Amarillo en mi caso) y CS Azul.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . https://www.youtube.net/curso-kit-inicio/ http://www.prometec. que son Chip Select. • Si conectáis empezando desde el de la izquierda no va a funcionar así que ojo.youtube.prometec. • Recordad que el primero es el mas a la derecha según miráis a los displays. el pin inferior central está rotulado como DIN o Data In. todos los displays se activarán o apagarán a la vez. por lo que al unir los CS. http://www. La función de estos pines superiores son exactamente los mismos que los de la parte inferior con una excepción. Por eso hay que usar ahora los cables macho/Hembra para conectar la salida del primer display DOUT1 a la entrada de datos del display 2 DIN2. además del inferior.net/curso-kit-inicio/ http://www. Para ello https://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Ya solo falta conectar la cascada a nuestro Arduino.net/indice-tutoriales 91 Recordad que estamos usando unos displays que usan el bus SPI. mientras que el superior hace las funciones de DOUT o Data Out salida. es decir entrada de datos. Pero también queremos que la información fluya de cada display al siguiente. y para eso los displays tienen otro conector en la parte superior.prometec. algo que ya dominamos y que por si acaso.h> Lo siguiente es que como la librería no incluye ningún Font. CS a los pines 12. El primer programa mostrará como sacar un mensaje estatico en el conjunto: Prog_39B_1 Lo primero es instalar la librería siguiendo el procedimiento habitual y después podemos empezar nuestro programa con un include. CLOCK. Y con eso dejamos listo el hardware. 11 y 10 respectivamente.http://www. ya se nos habían adelantado con una librería que hace exactamente lo que queremos y sin complicaciones. https://www.prometec. tenemos que proporcionar el nuestro. no por vagancia.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . e incluye un par de ejemplos de cómo mostrar mensajes estáticos y con desplazamiento lateral que usaremos directamente como base para nuestros programa. Andaba yo pensando en que librería usar para manejar los displays y mira por donde. para cargar la librería: #include <MaxMatrix. de unir VCC y GND. No señor) Esta Liberia se llama Arduino MaxMatrix library y tiene su propia página en GoogleCode que podéis encontrar en cuanto la busquéis.youtube.net/curso-kit-inicio/ http://www. además claro está. nos viene dado. así que vamos a tirar de ella directamente (Simplemente por eficiencia y eficacia.prometec. EL PROGRAMA DE CONTROL.net/indice-tutoriales 92 Llevamos los pines de control DIN. PROGMEM es una directiva que indica al compilador almacenar el array de caracteres en la memoria FLASH de Arduino y no en la SRAM más escasa y fácil de agotarse. // Iniciar el conjunto m. • Hay una diferencia importante. void setup() { m.setIntensity(15). // Brillo de los displays. y el número de displays que vamos a usar. int maxInUse = 4.net/indice-tutoriales 93 No voy a incluir aquí el array de caracteres (Que veréis en cuanto carguéis el programa) pero si hacer un comentario.prometec. Entre 0 y 15 printString(msg).init(). • Como no me daba problemas he preferido usar la memoria RAM normal para evitar complicaciones.net/curso-kit-inicio/ http://www.6. // Mostrar el mensaje } Aquí tenéis una foto con el resultado: https://www. Los ejemplos originales incluyen la definición del array de Font como: PROGMEM prog_uchar CH[] = {…… } Que aquí hemos cambiado por const byte CH[] = {…… } Porque la versión 1. Después tenemos unos valores importantes.prometec. clock. //Numero de displays a usar MaxMatrix m(data. http://www. Usaremos un array de char.4 de Arduino me daba error de compilación y a priori no hay diferencia practica entre ambas expresiones. int load = 10.youtube. especialmente si hacéis un programa mayor. pero nunca se sabe. load. y por último creamos una instancia de MaxMatrix para gobernar el conjunto de displays: int data = 12. para contener el mensaje estático que queremos mostrar char msg[] = "Arduino". int clock = 11. las definiciones de los pines de control.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . maxInUse). Serial.net/indice-tutoriales 94 No ha estado mal para abrir el apetito.init().net/curso-kit-inicio/ http://www. int clock = 11.http://www. m. así que vamos con ello: Prog_39B_2 #include <MaxMatrix. load. pero aquí el plato principal es hacer desplazarse las letras lateralmente.prometec. maxInUse).available() > 0) https://www. void setup() { m. int load = 10. clock. Las definiciones previas son iguales. por lo que he visto). } Vamos en loop a recoger lo que escribamos en la puerta serie: while (Serial.h> int data = 12. int maxInUse = 4.youtube. //change this variable to set how many MAX7219's you'll use MaxMatrix m(data.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . y el setup inicializa la instancia m de MaxMatrix y bajo un poco la intensidad para intentar que el video final no salga demasiado saturado (Empeño bastante inútil.setIntensity(8).prometec.begin(9600). read(). Relleno Desplaza a la izquierda shiftRight Bool Rotar. pero no. Y esto es todo por ahora. lo leemos char a char.net/indice-tutoriales 95 { byte c = Serial. • También disponemos de estas otras funciones: FUNCION PARAMETROS DESCRIPCION shiftLeft Bool Rotar. sea esto lo que sea). Serial. 100).prometec. Cuando hay algo disponible en la puerta serie. http://www. Aquí tenéis un video con el resultado: RESUMEN DE LA SESIÓN https://www.prometec. y que podéis usar como cualquier otra función disponible en la librería.youtube. Reconoceréis que os esperabais algo mas difícil.println(c. m. true). No he notado la diferencia.shiftLeft(false. } delay(100).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Relleno Desplaza a la derecha shiftUp Bool Rotar Desplaza arriba shiftDown Bool Rotar Desplaza abajo El programa incluye también un par de funciones de utilidad printCharWithShift() y printStringWithShift(). y llamamos a la función printCharWithShift () a la que le pasamos el carácter a mostrar y el delay en el desplazamiento de este primer carácter. Es la ventaja de usar librerías Adhoc. DEC). • El primero indica si queremos o no que el mensaje se repita (Aunque funciona fatal) y el segundo es si queremos rellenar de 0s. printCharWithShift(c. a las que no vale la pena dedicar tiempo por ahora.net/curso-kit-inicio/ http://www. Después shiftLeft() desplaza todo el mensaje a la izquierda. al que le pasamos dos bool. o Vimos cómo usar la librería MaxMatrix de Arduino para sacar mensajes estáticos. como usar estos grupos para hacer scrolling lateral de los mensajes a través del conjunto. también. o Hemos visto .youtube.net/curso-kit-inicio/ http://www. https://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . http://www.net/indice-tutoriales 96 • o Hemos visto. como conectar múltiples MAX7219 en casa cada para montar un display de varios caracteres.prometec.prometec. Arduino UNO o equivalente.net/indice-tutoriales 97 -GRUPO DE 4 MATRICES LED 8×8 CON SPI Uniendo varias matrices led 8x8 SPI MAX7219 Home Grupo De 4 Matrices LED 8×8 Con SPI OBJETIVOS • o Presentar los grupos de 44 matrices LED de 8×8 controladas por MAX7219. https://www. o Descargar y aprender a usar las librerías necesarias. MATERIAL REQUERIDO.youtube. http://www. Unos cables macho-hembra.prometec.net/curso-kit-inicio/ http://www. o Conectarlas y programarlas correctamente.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. Si lo pensamos un poco. aunque cuando hablamos de Arduino suelen ser de 8×8.prometec.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . La comunicación de este módulo se realiza a través de SPI.http://www.prometec. https://www. por lo que sólo necesitaremos 3 pines de Arduino a parte de la alimentación. Como ya vimos en la sesión que le dedicamos Matriz LED 8×8 con MAX7219 y SPI.youtube.net/curso-kit-inicio/ http://www. Tendríamos que conectar uno a cada fila y columna (o sea 16 en total) y activaríamos un LED poniendo a HIGH y LOW a su respectiva fila y columna.net/indice-tutoriales 98 Una grupo de 4 matrices LED 8×8 Con SPI con GRUPO DE 4 MATRICES LED 8×8 CON SPI Las matrices LED son displays que están formados por un grupo de LEDS formando normalmente cuadrados o rectángulos de diferentes tamaños. al aplicar HIGH y LOW a varias filas y columnas de forma simultánea se encenderían todos los LED de las intersecciones. para controlar este tipo de matrices directamente con Arduino se necesitarían muchos pines. Por eso estas matrices normalmente se usan junto a un controlador. sería muy difícil generar gráficos. y tendríamos que recurrir a trucos que tienen que ver con como percibimos las imágenes a través de la vista. que suele ser el MAX7219. Además. por lo sencillo y lo económico que es. net/indice-tutoriales 99 Lo mejor de estas matrices es que además nos permite combinar las que queramos de ellas.youtube. aunque podemos unir a otros tantos grupos de estos como queramos. Para unir los dos grupos lo que hemos hecho nosotros ha sido doblar un poco los pines de entrada de uno y soldarlos en los de salida del otro.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .http://www. Nos basta con 5 pines. y en diferentes posiciones. https://www. En lo que concierne a este tutorial vamos a usar 2 grupos que vienen ya con 4 de estas matrices unidas.prometec. dos para la alimentación y 3 para el bus SPI. la conexión de estas matrices a Arduino es muy sencilla.prometec. En este caso vamos a usar el Arduino UNO. conectando la salida de una a la entrada de la siguiente. ESQUEMA DE MONTAJE Y PROGRAMACIÓN Como ya hemos comentado un poco más arriba. aunque es un poco chapucero y seguro que podéis hacerlo mejor.net/curso-kit-inicio/ http://www. pero podríais cambiarlo según vuestros propósitos. En cuanto a la programación. const int numberOfVerticalDisplays = 1.h> #include <Max72xxPanel. Además inicializaremos el objeto con esos parámetros: #include <SPI.youtube.net/curso-kit-inicio/ http://www. https://www.prometec. El programa que vamos a utilizar nos servirá para mostrar textos desplazándose de izquierda a derecha a través de 8 matrices.h> #include <Adafruit_GFX. MOSI y SCK. numberOfVerticalDisplays). En particular vamos a mostrar de forma aleatoria 11 Strings que hemos cargado relacionados con nuestra página. numberOfHorizontalDisplays.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 100 pero si usáis otro tipo de Arduino tenéis que mirar qué pines son los que les corresponden al bus SPI: SS. Max72xxPanel matrix = Max72xxPanel(pinCS. const int numberOfHorizontalDisplays = 8.prometec. el número de matrices verticales y horizontales y el pin CS. Lo primero que haremos será incluir las librerías y definir algunas variables que vamos a necesitar. tampoco va a ser nada del otro mundo gracias a un par de librerías que tendremos que descargar e instalar como siempre hemos hecho: arduino-Max72xxPanel-master y Adafruit- GFX-Library-master.h> const int pinCS = 10.http://www. 0).prometec. Recordad que no tienen por qué ser palabras simples. 5. 0. 0> matrix.http://www. 0). 0).prometec. 2. 0). 0). const int width = 5 + spacer."Raspberr y Pi". Podéis guardar tantas como quepan en la memoria de vuestro Arduino.youtube.net/indice-tutoriales 101 A continuación vamos a definir las variables que dictarán la velocidad de desplazamiento de los textos. // El segundo display esta en <1. pueden ser frases completas.setIntensity(7). 0)."Programacion"."Comunicaciones". // El séptimo display esta en <6. 0). // Ajustar el brillo entre 0 y 15 // Ajustar segun las necesidades matrix. // El primer display esta en <0.setPosition(4. 3. const int wait = 100. el ancho de la fuente y el array donde guardaremos las strings que queramos mostrar. // El tercer display esta en <2. 0)."Electronica". 0> matrix."Tutoriales de Arduino"."Arduino".com/channel/UC51LheGI2gCZbc2Ocrry49g/videos ."Robotica infantil".setPosition(2. 0). 0> matrix.setPosition(3.setPosition(0.setPosition(1. // Ancho de la fuente a 5 pixeles String cadena[]= {"Prometec". 7. // En milisegundos const int spacer = 1. // El cuarto display esta en <3. 0> matrix. // El sexto display esta en <5."IoT"}. 0> https://www. 0> matrix.setPosition(7. //textos En el setup tenemos que definir el brillo que queremos que tengan las pantallas. 0> matrix.setPosition(5. que en nuestro caso quedaría de esta forma: void setup() { matrix.setPosition(8. así como las posiciones en las que hemos montado las matrices. // El quinto display esta en <4. 1."Sensores".net/curso-kit-inicio/ http://www. 8. // El noveno display esta en <8."S4A". // El octavo display esta en <7.setPosition(6. 6. 0> matrix. 4. 0> matrix. 1). i++) { matrix. 1). // Posición del display matrix. // Posición del display matrix.setRotation(8.setRotation(5. 1). 1).1 .spacer.fillScreen(LOW).net/curso-kit-inicio/ http://www. i < width * cadena[n]. 1).setRotation(4. // Posición del display matrix.net/indice-tutoriales 102 matrix.http://www.setRotation(0.1) .width() .i % width. // Posición del display matrix. // Centrar el texto while (x + width .10). int letter = i / width. // Posición del display matrix.setRotation(7.setRotation(6.prometec. int x = (matrix. 1).width() .youtube.height() . // Posición del display } Y en el loop vamos a ir pasándole los strings para que los vaya mostrando en las pantallas como indica la librería: void loop() { int n = random(0. // Posición del display matrix.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . int y = (matrix.prometec.setRotation(1.setRotation(3.8) / 2. // Posición del display matrix. for (int i = 0.setRotation(2.length()) { https://www. 1). 1).spacer >= 0 && letter >= 0) { if (letter < cadena[n].length() + matrix. // Posición del display matrix. 1). 1).prometec.net/indice-tutoriales 103 matrix.write(). // Muestra loscaracteres delay(wait). ENVIANDO CADENAS POR EL PUERTO SERIE Para completar vamos a incluir un programa que muestre las cadenas que le enviemos por el puerto serie. x -= width. aunque visto el programa anterior no tiene mucho misterio.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www. LOW. } matrix. HIGH.prometec.http://www.youtube. cadena[n][letter].drawChar(x. La diferencia vendrá en que no definiremos el array https://www. } letter--. } } Aquí os dejamos el programa completo Prometec4matrices. y. length() + matrix. int x = (matrix. } matrix.height() .drawChar(x. long int time = millis().spacer.8) / 2. i++) { matrix.width() . cadena[letter].write(). } for (int i = 0.http://www. LOW.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . // Centrar el texto while (x + width .available()) { cadena += char(Serial.length()) { matrix.youtube.1 . int y = (matrix. } letter--. si no que los crearemos en el loop con lo que recojamos por el puerto serie (recordad también que hay que fijar la velocidad de comunicación en el setup): void loop() { String cadena = "". y. // Muestra loscaracteres https://www.1) .width() .net/indice-tutoriales 104 de strings.read()). i < width * cadena.net/curso-kit-inicio/ http://www.prometec.fillScreen(LOW). HIGH.i % width.spacer >= 0 && letter >= 0) { if (letter < cadena. 1). int letter = i / width. while (Serial.prometec. x -= width. RESUMEN DE LA SESIÓN En esta sesión hemos aprendido varias cosas importantes: • o Hemos visto como funcionan las matrices de LED SPI basadas en el chip MAX7219. https://www.net/indice-tutoriales 105 delay(wait). Además os dejamos una idea para que la trabajéis vosotros.prometec.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . http://www. } } Aquí os dejamos el programa completo Matrices_puerto_serie y un vídeo con el resultado.youtube. conectarle un módulo bluetooth y pasarle las cadenas desde un teléfono móvil. o Hemos aprendido a unir varios grupos y a programarlos.net/curso-kit-inicio/ http://www.prometec. o Hemos aprendido a utilizar grupos de 4 de esas matrices. Esta sesión acepta cualquier otro mod Una Protoboard.youtube.net/curso-kit-inicio/ http://www. o Presentar las primitivas graficas disponibles. MATERIAL REQUERIDO.prometec. o Mostrar la forma de conectarlo correctamente. Arduino Uno o similar.prometec. http://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . o Mostrar algunos programas para sacarle partido imprimiendo texto de diferentes colores y tamaños de letra.8”.8″ Arduino y el primer display TFT Home Display TFT SPI 1.8″ OBJETIVOS • o Presentar los primeros displays TFT de 1.net/indice-tutoriales 106 40-DISPLAY TFT SPI 1. Cables de protoboard 5 resistencias de 1kΩ https://www. en distintos tamaños. Per naturalmente. invariablemente. https://www. especialmente las más accesibles para alguien que quiere introducirse en el mundo de Arduino y la electrónica.http://www. gracias a Dios) hasta hace muy poco y muchos de ellos incorporan algún tipo de bus de control para simplificar su acceso. una parte en la que necesitaremos mostrar información al usuario exterior. el mercado nos ofrece un sinfín de posibilidades de displays cuya capacidades y grados de sofisticación son crecientes y que suelen conllevar un cierto grado también de complejidad.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . para los teléfonos móviles y que han acabado popularizándose como displays en color y de pequeño tamaño. Es el caso de los displays TFT que empezaron a venderse.net/indice-tutoriales 107 Un display TFT de 1.prometec.prometec.8″ con SPI LOS DISPLAYS SPI Casi cualquier proyecto que planteemos tendrá.net/curso-kit-inicio/ http://www. En los últimos años han ido apareciendo un creciente número de displays de buenas prestaciones con precios inimaginables (Por lo bajos.youtube. En el curso de introducción fuimos viendo algunas de las opciones disponibles en el mercado. y para ello necesitaremos alguna forma de display. están bastante mal documentados. porque la documentación que hay en internet es muy pobre y se olvidan de darte una clave fundamental para que la cosa funcione.8” en color con interface SPI. por lo que he visto. sin conseguirlo.prometec. la conexión es trivial. de manera que encajen en la protoboard.prometec. montar esas resistencias y veréis como enseguida vuestro display estará haciendo cositas a colorines.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Así pues. es baja 128 x 160 puntos en pantalla. Y es una pena porque son unos displays magníficos que por muy poco dinero nos permite manejar texto y gráficos a color con muy poco esfuerzo.http://www. Una vez que lo tienes claro.net/indice-tutoriales 108 En esta sesión vamos a ver como conectar a nuestros Arduinos un modelo de 1.youtube. que son relativamente sencillos de encontrar muy baratos y que.net/curso-kit-inicio/ http://www. Vamos a ver como conectarlos ESQUEMA DE CONEXIONES La conexión es muy sencilla y os incluye el ejemplo de conexión a la protoboard de la forma natural. https://www. es decir con el display hacia arriba y los pines de conexión hacia abajo. He estado bastante tiempo volviéndome loco tratando de conectar este display. aunque naturalmente la resolución no es gran cosa. Hay que poner resistencias de 1KΩ en los pines de datos para el SPI y el único que parece haberse dado cuenta son los chicos de domipheus. Cargad el ejemplo: Archivo\ejemplos\Adafruit_QDTech\graphicsTest_QDTech Aquí tenéis el resultado del ejemplo: Vamos ahora con el detalle de cómo se maneja.net/indice-tutoriales 109 Por cierto el pin al lado del GND del display.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Empecemos con las definiciones: https://www.zip y Libreria Adafruit_QDTech.net/curso-kit-inicio/ http://www. modificadas para el control vía SPI. Yo lo he conectado a 5V directamente.zip.http://www.prometec. Tenemos que cargar dos librerías Libreria Adafruit GFX. EL PROGRAMA DE CONTROL Como no podía ser de otra manera. está rotulado como BL o Back Light.prometec.youtube. pero puedes usar un pin de tu Duino para encenderla y apagarla a voluntad. Seguid el procedimiento habitual para instalar librerías y veréis que también os instalarán una serie de ejemplos. y se usa para encender la luz de fondo del display y que pueda verse lo que hay en pantalla. vamos a utilizar las librerías de Adfruit para TFTs. testdrawtext (" Curso Arduino\n Prometec.print(“Text”) https://www.net/curso-kit-inicio/ http://www.h> Son las definiciones de pines de conexión que corresponden con la imagen de la protoboard arriba.prometec.Lanscape tft. 18 .0) en la esquina superior izquierda hasta el punto (128.h> // Core graphics library #include <Adafruit_QDTech. Creamos una instancia del objeto Adafruit_QDTech que llamamos tft. Seleccionar la orientación vertical y borrar la pantalla: tft. del punto x=0.QDTech_BLUE).net \nPantalla de 21 x 20\n caracteres. QDTech_ WHITE). Para escribir usamos la función testdrawtext(“xxxxxxxx”).fillRect (0.init(). Adafruit_QDTech tft = Adafruit_QDTech(cs. 100. 128. borrar Y aquí es donde le vamos a mandar escribir y dibujar: tft. 16. 160 .youtube.18 de color azul.setRotation(0).160) en la esquina inferior derecha. // Rellenar de negro. Lo siguiente es inicializar el objeto.h> // Hardware-specific library #include <SPI. // Inicializamos tft tft.fillScreen(QDTech_BLACK). o bien posicionamos el cursor en un punto y usamos tft.fillRect (0. 128. http://www. • La pantalla va del punto (0. dc. // 0 . y=16 hasta el punto 128.QDTech_RED).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . 1 . tft. que es el interface del display actual. o sea. rst). Mas las librerías necesarias incluyendo la SPI.\n".net/indice-tutoriales 110 define sclk 13 // No cambiar #define mosi 11 // No cambiar #define cs 9 #define dc 8 #define rst 7 //Es el reset del display #include <Adafruit_GFX.Portrait. Le pedimos que rellene un recuadro con fillRect().prometec. QDTech_BLUE).setRotation(0). 100. testdrawtext (" Curso Arduino\n Prometec.\n". // Inicializa la pantalla tft.net/curso-kit-inicio/ http://www.h> // Hardware-specific library #include <SPI.prometec. // Cursor a 10.QDTech_RED).net/indice-tutoriales 111 Y aquí tenemos el programa completo Prog_40_1 #define sclk 13 // No cambiar #define mosi 11 // No cambiar #define cs 9 #define dc 8 #define rst 7 // Podemos conectarlo al Arduino reset #include <Adafruit_GFX.net \nPantalla de 21 x 20\n caracte res.h> Adafruit_QDTech tft = Adafruit_QDTech(cs. // Color del texto azul https://www.fillRect (0. 128.http://www. 128.h> // Core graphics library #include <Adafruit_QDTech. QDTech_WHITE).Portrait.fillScreen(QDTech_BLACK).fillRect (0. // Invoke custom library void setup() { tft.Lanscape tft. 16. dc. // 0 .50 tft. tft. rst). 18 . 160 .youtube.setCursor(10. 50).init().com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . tft.setTextColor(QDTech_BLUE). // Rellena de rojo tft. 1 .prometec. Para poder escribir las comillas y que C++ no lo confunda con el cierre del string literal he usado \” para indicarle que quiero usar las comillas dentro del literal.print("Display SPI de 1.prometec. } • Fíjate en que para poder poner 1. y por cierto los colores disponibles de serie son: QDTech_BLACK QDTech_RED https://www. tft. // Si el texto no cabe pasalo a la siguiente linea tft.setCursor(0.setTextColor(color).print(text). tft.8” en la última línea de texto hemos escrito “Display SPI de 1. // Escribe en la posicion del cursor } void loop() {} void testdrawtext(char *text.youtube.setTextWrap(true).prometec.8\”” esto no es un error. uint16_t color) { tft.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www.8\""). 0).net/indice-tutoriales 112 tft. http://www. A la izquierda teneís el resultado del programa. prometec. // 0 . https://www.net/curso-kit-inicio/ http://www.net/indice-tutoriales 113 QDTech_GREEN QDTech_BLUE QDTech_YELLOW QDTech_MAGENTA QDTech_CYAN QDTech_WHITE QDTech_GREY Pero no debería ser demasiado difícil definir nuevos colores.prometec.youtube.h> Adafruit_QDTech tft = Adafruit_QDTech(cs. 1 . Vamos a insistir un poco en un programa que imprima textos de diferentes colores en la pantalla en distintas orientaciones.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . dc.setRotation(0).h> #include <Adafruit_QDTech. // Invoke custom library void setup() { tft.Portrait.Lanscape tft.h> #include <SPI.fillScreen(QDTech_BLACK). tft. Prog_40_2 #define sclk 13 // No cambiar #define mosi 11 // No cambiar #define cs 9 #define dc 8 #define rst 7 #include <Adafruit_GFX.init().http://www. rst). para que no haya dudas. setTextColor(QDTech_GREEN).setTextSize(3).setCursor(0. // Escribe en la posicion del cursor tft.setTextSize(2). 80).setTextWrap(true).setTextColor(QDTech_CYAN).print("Display").setTextColor(QDTech_BLUE). 50). // Color del texto cian tft. 25). // Cursor a 10.prometec.print("Display"). delay(500).setTextSize(4). // Cursor a 10. // Color del texto rojo tft.prometec. tft.youtube.http://www. // Escribe en la posicion del cursor tft.print("Display").com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . // Color del texto azul tft.setCursor(0. https://www.setCursor(0.50 tft. // Cursor a 10.print("Display").50 tft. // Si cambias esto lo que no quepa sigue en la siguiente linea tft.setTextWrap(false). // Cursor a 10.setCursor(0.net/curso-kit-inicio/ http://www. tft. 10). tft. tft.net/indice-tutoriales 114 tft. // Color del texto azul tft.50 tft. tft.50 tft.setTextSize(1).setTextColor(QDTech_RED). // Escribe en la posicion del cursor tft. Color) Dibuja una línea vertical de la longitud L https://www.drawPixel(x0.setRotation(1). // Al cambiar la orientación cambia el punto 0.drawFastHLine(x0.setTextSize(2). 1 – Lanscape.y 0.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .setCursor(0. Color) Dibuja una línea horizontal de la longitud L tft.fillRect (x0.setTextColor(QDTech_YELLOW). Color). y1. Pinta el pixel y ya está ( A mí no me miréis) tft.prometec. L. y1.fillScreen( Color ) Borra la pantalla con el color indicado tft.y0 a x1.y0.Portrait.drawFastHLine(x0. H. Color). x1.y0. Rellena un recuadro de color entre x0.youtube. Cambiamos orientacion tft.x1.Color) Dibuja una línea tft.y 0. // 0 .http://www. 10).y0.0 tft.y1 tft.net/curso-kit-inicio/ http://www. tft.prometec.net/indice-tutoriales 115 tft.print("Display"). // Escribe en la posicion del cursor } void loop() {} El resultado es como este: La instancia de tft tiene varios métodos gráficos interesantes: MÉTODO DESCRIPCIÓN tft. // Color del texto amarillo tft.drawLine(x0. Dibuja un triángulo entre los 2 puntos indicaos tft. así como la forma de posicionarlos en pantalla. color). Dibuja un circulo relleno tft.net/curso-kit-inicio/ http://www.drawRoundRect(x0. x1. Dibuja el contorno de un circulo tft. que nos devuelve la altura. y0. color). o Hemos visto que el único truco que tienen para conectarlos es usar unas resistencias de 1kΩ en los pines de datos. http://www. o Presentar sin entrar mucho en ello las primitivas graficas que nos permiten dibujar líneas.drawTriangle(x0. color) Rectángulo redondeado entre P0 y P1 con redondeo de r Y alguna propiedades que merecen destacar como tft.prometec.height().net/indice-tutoriales 116 MÉTODO DESCRIPCIÓN tft. y2. y1. y.y1h. https://www.x2. y0. color). que nos devuelve la anchura de la pantalla y tft.width(). radius. círculo y rectángulos. o Hemos visto los principios básicos para mostrar textos en varios colores y tamaños. algo que está muy mal documentado y que ha generado mucha confusión en internet.drawCircle(x.prometec. radius.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . RESUMEN DE LA SESIÓN • o Hemos presentado los displays TFT de 1. x1.youtube. R.8”.fillCircle(x. y. Algunos cables de protoboard. o Describir sus características.net/curso-kit-inicio/ http://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . http://www. o Montar un circuito de ejemplo y un programa sencillo que lo use sacando texto MATERIAL REQUERIDO.youtube.prometec.net/indice-tutoriales 117 41-DISPLAY NOKIA 3310 Un display barato y eficaz Home Display Nokia 3310 OBJETIVOS • o Presentar el display Nokia 3310. Arduino DUE. preferiblemente Dupont ma Un display Nokia 3310 https://www. Una Protoboard .prometec. porque no vais a encontrar nada con menor consumo y además proporcionan un buen contraste con luz ambiente.net/indice-tutoriales 118 LOS DISPLAYS NOKIA 3310 En los primeros años de los móviles. pues usa 4 LEDs. ¿Por qué usar un display como este. • En internet he visto que unos usan estas resistencias y otros nada. que es en blanco y negro? En primer lugar porque los LCDs equivalentes de 16×2. y sin embargo parece ir como una seda cuando conecto los pines de Arduino UNO directamente sin más. siguen disponibles por muy poco dinero.prometec. Por si fuera poco. es barato es eficaz y se maneja con pocos pines pues usa el bus SPI. • He hecho la prueba con un DUE y funciona perfectamente con todo a 3.8” a color. Empieza poniendo las resistencias que es más seguro y si no consigues nada prueba sin ellas. que suelen ser muy guapos y que también podemos conseguir por pocos euros. Nokia era la indiscutible reina del baile con aquellos teléfonos pequeñajos y con pocas posibilidades. tienen más resolución y más posibilidades pero también consumen bastante más que estos pequeños displays en blanco y negro. así que tú mismo. Este es el caso que nos ocupa con el display Nokia 3310.3V. https://www. o en su defecto interponer en serie resistencias de 10k.para adaptar el nivel de tensión. el consumo de estos 3310 es de unos muy modestos 5mA.3V y con la luz de fondo 80mA.8” a color. por lo que no podíamos dejar pasar la oportunidad de presentarlos (Nokia) CARACTERÍSTICAS DEL NOKIA 8133 En primer lugar estos displays son de 3V y nos previenen repetidamente contra alimentarlos a 5V porque podríamos quemarlos. Nos hemos hartado a ver displays de 16×2 líneas LCD y también pequeños displays de 1. y si usamos uno I2C. necesitan 8 pines para controlarlos lo que es un asco de cables. probablemente usarán estos displays y es un buen momento para sacárselos junto con el teclado numérico. http://www. En el caso de que no encendamos la luz de fondo. También nos insisten en Internet.prometec. Por eso son ideales para funcionar con baterías. a 3. que usaban unas pantallas en blanco y negro que hacían poco más que escribir texto y algún gráfico del tipo de pequeños iconos con mapa de bits.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www. Además son tan fáciles de manejar. no he conseguido que mi display se entere de nada con Arduino UNO y estas resistencias de 10kΩ. • Tengo que decir que por más que lo he intentado. Como se hincharon a vender.youtube. que si usamos un micro controlador como el Arduino UNO de 5V debemos usar un level shifter para adaptar los niveles de tensión de todos los pines de comunicaciones. que pueden ser una buena solución para cantidad de situaciones. Y en cuanto a los de 1. A mí me funciona con un UNO y sin resistencias pero me daba poca confianza después de leer el manual. entonces el precio es entre 2 y 3 veces el de estos Nokias. así que usaré un DUE para este ejemplo por pura vagancia. varios teléfonos antiguos de los que tengáis tirados por los cajones. apareció un mercado que suministraba a bajo precio las pantallas LCD que usaban aquellos cacharritos y aunque hoy no creo que exista ningún teléfono con estos displays. Descargad esta librería : Nokia.prometec.net/indice-tutoriales 119 Utiliza un controlador Phillips PCD8544 para gobernar el display y nos proporciona acceso mediante SPI.youtube.prometec. que se empiezan contando desde la esquina inferior izquierda. pero no necesitamos mucha velocidad para enviar caracteres de texto. pero no vamos a cargar la librería propia de Arduino. porque una librería de Nokia que gestiona el display lo lleva incluido y nos permite usar cualquier pin para su control. así que tened cuidado por si acaso. Mi display es así: https://www.zip • Podemos usar los pines hardware SPI de Arduino y seguro que será bastante más rápido. lo que no está nada mal para un display de tan bajo precio CIRCUITO DE CONTROL Ya hemos dicho que el display se gobierna mediante SPI. He visto más de un orden de pines en Internet. (En caso de que no aquí tienes la sesión correspondiente) Se trata de una pantalla de solo 84 pixeles de ancho por 48 de alto mapeado en bytes. nos proporciona un display de 12 caracteres de ancho por 6 líneas (Seguro que podéis hacer la división vosotros también).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . y a estas alturas es un bus que os resulta sobradamente familiar. Instaladla por el procedimiento habitual (Instalando librerías en Arduino). como muestra el manual: Como cada carácter ocupa 7 pixeles de ancho y 8 de alto. lo que nos hace bastante fácil la conexión. http://www.net/curso-kit-inicio/ http://www. net/curso-kit-inicio/ http://www.net/indice-tutoriales 120 Y voy a usar un montaje similar a este: https://www.prometec.prometec.http://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .http://www.prometec.net/curso-kit-inicio/ http://www.net/indice-tutoriales 121 https://www.prometec.youtube. os lo propongo como ejercicio. // (SCK. num linea Y para imprimir el texto usamos: NokiaLCD. Recordad ahora que el display permite 6 líneas. NokiaLCD. eso quiere decir que seleccionamos el display poniendo un LOW en el pin correspondiente.init().4. lo que hace un total de 80 mA lo que queda muy lejos de las capacidades de un pin del DUE y hasta del UNO o del MEGA. que controle la alimentación. V veamos un pequeño programa de aproximación: Prog_41 #include <NokiaLCD.net/curso-kit-inicio/ http://www. podemos ahorrar un pin de Arduino. • Para usar un botón que ilumine la parte posterior del display. Para posicionar el cursor en un lugar dado usamos: NokiaLCD. conectando CS (El pin 3 del display marcado como SCE) a GND directamente con lo que estará permanentemente seleccionado. CS) Incluimos la librería y creamos una instancia de NokiaLCD al que le pasamos los pines de control que hemos usado en el montaje.print("Primera linea"). Linea).prometec. // Pixels desde el borde izquierdo. hace que el manejo del display sea trivial.clear().youtube. • El pin CS.h> NokiaLCD NokiaLCD(3. Usa 4 diodos LED cada uno de 20 mA.net/indice-tutoriales 122 • El pin 8 del display es el backlit. Si hay dudas con esto. Después inicializamos y borramos el display con: NokiaLCD. de la 0 a la 5 de 12 caracteres cada una.prometec. http://www.setCursor(N. RST.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .7). Muy complicado como podéis comprobar. chip select es activo LOW. (Si. mándame un email y publicamos una solución) EL PROGRAMA DE CONTROL La librería que hemos descargado e instalado.5. necesitaríamos un circuito adicional con un pulsador y un transistor como el 2N2222.h> https://www. DC. numerados del 0 al 11. o luz trasera para poder leer en la oscuridad. MOSI. Si solo vamos a usar un dispositivo SPI en nuestro montaje. Empezamos con: #include <NokiaLCD.6. print("Prometec.prometec. } Que produce un display como este: https://www. NokiaLCD.net"). MOSI. // Clear screen. CS) void setup() { NokiaLCD.print("Arduino").clear().6.0).setCursor(0. NokiaLCD.4. NokiaLCD. DC. NokiaLCD.net/indice-tutoriales 123 NokiaLCD NokiaLCD(3. NokiaLCD.setCursor(17. RST. NokiaLCD. NokiaLCD.5.2).setCursor(7.init().7). NokiaLCD.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .print("con").print("Nokia 3310").setCursor(30.http://www.youtube.prometec. // (SCK. NokiaLCD.setCursor(14.print("Probando").5). } void loop() { NokiaLCD. // Init screen. NokiaLCD.net/curso-kit-inicio/ http://www.1).3). youtube. Hay varios programas por ahí que os lo hacen.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www. https://www. pero al final lo que muestra es un asco y me conformare con comentaros que podéis usar la función: NokiaLCD. practico y barato.net/indice-tutoriales 124 Y por si aún os parece poco. Pero desde luego no os la recomiendo para nada que no sea sacar algún bitmap muy pequeño (de 84×48 pixeles exactamente) y desde luego no esperéis virguerías.prometec. este display es capaz de mostrar imágenes de bits a condición de que creemos un array de bytes. http://www. este display no dá para más. RESUMEN DE LA SESIÓN • o Hemos visto que le Nokia 3310 es un display sencillo.bitmap(array).prometec. Pues esto es todo. net/indice-tutoriales 125 o Por lo que vale una cerveza. te permite escribir en una array de caracteres con buen contraste.youtube. http://www.prometec.net/curso-kit-inicio/ http://www.prometec. o Es muy fácil de manejar con la librería incluida y hemos visto un sencillo ejemplo del mismo.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . (Hacer uno complicado no ha sido posible) https://www. 96” OBJETIVOS • o Presentar el display OLED 128×64. MATERIAL REQUERIDO.96” Otro tipo de displays Home Display OLED 0.prometec.youtube. Arduino UNO. o Describir sus características.net/indice-tutoriales 126 42-DISPLAY OLED 0. http://www. https://www. Una Protoboard .com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . o Montar un circuito de ejemplo y un programa sencillo que lo use sacando texto.net/curso-kit-inicio/ http://www. Algunos cables de protoboard.prometec. Pero antes de nada… ¿Para qué queremos otro display pequeñajo y de tecnología OLED? Pues en principio. vamos a montarla y luego opinamos.3V. o sea que son diodos LED con otra tecnología.prometec. porque como casi todos los modelos nuevos de fabricantes chinos. Así que sin más preámbulos vamos a ver cómo utilizar este precioso display. Tiene un contraste magnificoy no necesita backlit para poder ver el display. tanto a plena luz. Además permite la representación tanto de caracteres como de matrices graficas e imágenes en una cierta resolución claro. Y aquí comienza un peregrinaje por Internet.youtube. pero me ha encantado porque este display tiene muchas ventajas. Bueno. no prejuzguemos nada.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . acostumbrados como estamos a ver displays del tipo del Nokia de la sesión anterior uno parece esperar una pantalla similar. no un display como es debido. pero en su lugar esta pantalla parece un sello de correos. http://www. Así que vamos a ver si podemos aportar algo de luz en tema que merece la pena.net/curso-kit-inicio/ http://www. andan muy escasos de documentación con un mínimo de calidad. Casi diría que son ridículamente minúsculos y desde luego. 128×64 pixels. es su tamaño. como en la oscuridad completa. • Lo de OLED viene de Organic Leight Emitting Diode. Son pequeños. Y lo sorprendente es que en cuanto lo pones en marcha te olvidas de lo enano que es y empiezan las buenas noticias.net/indice-tutoriales 127 Un display OLED de 0. CONEXIÓN DE UN DISPLAYS OLED DE 128×64 https://www. porque nos gusta jugar (que le vamos a hacer) y después porque el consumo que presenta este display es increíblemente ridículo: unos 16 mA.prometec. tanto para la alimentación como para las señales de datos.98” SPI. aún menos que un LED y eso con una resolución de 128×64 pixels. LOS DISPLAYS OLED DE 128×64 Lo primero que te sorprende cuando recibes una de estos displays OLED de casi una pulgada. entre ellas que supuestamente funciona igual a 5V que a 3. y ni siquiera en inglés parece haber demasiado. ya que la tecnología OLED genera la luz de por sí. buscando como se conecta y configura la pantalla que acaba resultando bastante frustrante. El mío es de un precioso azul clarito y resulta muy agradable de leer. para programarlos directamente.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Yo he elegido de este último tipo porque en principio es más rápido y da menos guerra de configurar.youtube.net/indice-tutoriales 128 Hay variantes de estos displays en I2C y en versión SPI. https://www. podemos aprovecharnos de la facilidad de usar una protoboard para conectar los pines del display OLED directamente a los pines digitales de Arduino. OLED ARDUINO GND GND Vcc 5V SCL D12 SDA D11 RST D10 DC D9 Como es habitual.prometec.http://www.net/curso-kit-inicio/ http://www.prometec. La conexión resulta trivial. youtube. https://www.http://www.prometec.net/curso-kit-inicio/ http://www. ya veis.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. Podemos usar una librería de Adafruitpara manejar los displays basados en el controlador SSD1306 que es el chip que usa nuestro display.net/indice-tutoriales 129 Y el asunto no da para más. pero en general no me han convencido mucho. EL PROGRAMA DE CONTROL Hay varias librerías disponibles para manejar estos OLED. #include "stdio.net/curso-kit-inicio/ http://www. Simplemente están a la vista en lugar de estar escondidas en la librería.h es una novedad y merece una explicación. http://www. Pero el include del stdio. En el setup. const int DC_PIN =9. y luego podemos usar varias de las librerías habituales de Adafruit como la GFX para dibujar gráficos en este display. Las constantes son para definir los pines que usamos de control del display. mediante un par de funciones que podeis consultar sin problemas mas adelante: void setup() { LEDPIN_Init(). LED_Init(). Así que al final encontré un programa en Instructables que manejaba directamente el display por programa y que aunque parece un poco más complicada.youtube.prometec. • Una que funciona a la primera sin configurar nada más que los mensajes de texto que queremos sacar. pero me dió problemas. const int SDA_PIN=11. que vamos a retrasar un poco hasta que surja el motivo de su uso. https://www. } La primera instrucción define los pines como entrada y salida. Ambas funciones están un poco más abajo. El programa es este que tenéis aquí: Prog_42_2 No os asustéis cuando veáis que contiene un montón de funciones definidas. y la segunda se encarga de inicializar el display dejándolo listo para su uso. const int RST_PIN=10. lo que no está mal porque podríamos hacernos las librerías graficas o funciones de dibujo. También definimos un buffer de caracteres para usar luego. Vamos con algunas definiciones: const int SCL_PIN=12. • Otra que disponemos de todo el código a mano para modificar lo que queramos.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 130 La podéis descargar de Github como Adafruit_SSD1306. pero podemos usar el display sin más que manejar una única función con los textos que nos interesen. si las necesitamos.h" char buffer[10]. tiene dos grandes ventajas. inicializamos de todo como es habitua.prometec. necesitaba la función sprintf(). //char *S = "hola" . int horas = t/3600 . Porque antes había displays de estos de 32 pixels de alto y este es de altura doble (No te líes. y el tercero el texto a imprimir. 4. usamos una función de nombre extravagante: P8x16Str.net/curso-kit-inicio/ http://www. con excepción del loop. void loop() { long t= millis()/1000 .6. segs). " .prometec.minutos * 60) % 60 .h" char buffer[10]. LED_P8x16Str(20. 2. LED_P8x16Str(22. porque he elimado el array y las funciones correspondientes para no cargar el ejmplo y la memoria.youtube.net").net/indice-tutoriales 131 Podemos ignorar tranquilamente el resto. LED_P8x16Str(20... https://www. pero para poder imprimir un numero formateado. A la que le pasamos por valor un array de char o String..com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . } Para imprimir un texto. "%02d:%02d:%02d". http://www. int n = sprintf(buffer. consulta la pagina de instructables que mencionamos mas arriba. horas. el segundo parámetro el número de línea.. int minutos = (t % 3600) / 60. minutos.. " . Podemos pasarle textos directamente por valor.0. buffer )." ).4. LED_P8x16Str(20. las líneas se numeran de forma par). que no viene incluida en Arduino por defecto y por eso usamos al principio las líneas: #include "stdio. • Al ser un display de 64 pixels de alto las líneas las numeramos como 0."Prometec. int segs = (t .horas*3600 .6." ).prometec. ya que no es necesario para manejar el display. • El primer parámetro indica la distancia en pixels del margen izquierdo. • Si tu display es de los modelos antiguos de 128×32.2.. En la función de inicio LEDPIN_Init (). con la máscara indicada entre comillas y guardar el resultado en buffer. Pero otra virtud de este pequeño display.OUTPUT). para quienes no estéis acostumbrados a C++ y a sprintf. Los que aspiran a nota. Al final. es que al tener en fila los pines y consumir muy poco.prometec.OUTPUT). o sea como un reloj. significa un decimal con dos dígitos y con un cero de relleno si el número es de un solo digito. “%02d:%02d:%02d”. se habrán dado cuenta de que hemos elegido astutamente. minutos. y el 02d. OUTPUT). el resultado final son números de dos dígitos rellenos de 0 cuando se necesita. a la vez que devuelve la longitud de la cadena formateada. el 2 que queremos que tenga 2 dígitos. la función nos devuelve la longitud del texto generado aunque aquí no lo usamos para nada útil. pinMode(DC_PIN. podemos alimentarlo directamente desde un pin de Arduino UNO y usar el resto para controlar el display. pinMode(SDA_PIN. } Y el resultado es este MOSTRANDO IMÁGENES https://www. Por lo demás.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . pinMode(13.OUTPUT). Quería mostrar un reloj a partir de los millis (). sirva decir que esta función formatea un texto de acuerdo a las reglas que le marcamos en la cadena de control entre comillas y lo deposita en buffer.net/curso-kit-inicio/ http://www. Aquí os pongo un mini video con el resultado.http://www. los pines seguidos con toda la intención de pinchar el display directamente a Arduino. separados por ‘:’. El sprintf (buffer. segs) indica que queremos mostrar las variables horas.prometec. minutos y segs.HIGH). y por eso calculamos horas minutos y segundos a partir del tiempo que lleva Arduino iniciado.OUTPUT).net/indice-tutoriales 132 Para poder disponer de esa función sin complicarme la vida formateando el número. horas. Fijaros además que al poner un ‘:’ entre las máscaras. En “%02d:%02d:%02d” cada ‘d’ significa un numero decimal. void LEDPIN_Init(void) { pinMode(SCL_PIN. digitalWrite(13. incluimos deliberadamente una llamada a pinMode para usarlo como OUTPUT y luego pusimos un HIGH para alimentar el display. pinMode(RST_PIN.youtube. 0x80.0x80. ………………….0x80. usamos una llamada a : LED_PrintBMP(0. pero es cuestión de trabajártelo.0x80.net/indice-tutoriales 133 Este pequeño display es capaz de mostrar imágenen bitmaps en monocromo.0x80. Hay varios programas que sirven para montar un array de char a partir de una imagen en jpg o similar.0x80.0x80.0x80.0x80.0x80.0x80.0x80.0x80. }.0x80.0x00.0x80.0x80.0x80.0x80.0x80.0x00.0x80. El más sencillo que he visto es LCDAssistant.0x80.0x80. A partir de la imagen. usaré una con el logo de Bently que nos proporcionaba Alex Chu en Instructables como ejemplos: Prog_42_3.(unsigned char *)logo).0x80. pero ahora tenemos un array logo: const unsigned char logo[]= { 0x00. con el equivalente monocromo de la imagen. Que incluye el array de 168×64 a mostrar en pantalla.0x80.0x80.0x80.128. 0x80. Como yo soy un poco inútil trabajando las imágenes.prometec.0x80.0x00.0x80.0x80.0x80.0x80.0x80.youtube.0x80..0x00.0x80.http://www.0x80.0x80.0x80.0x80.0x80.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .0x80. 0x80.0x80.0x80.0x80.0x80.0x80.0x00.0x00. 0x80.0x80.0x80.0x80.0x80.0x80.0x80.0x80.0x80. Y en el loop.0x80. 0x80.0x80. Aquí os dejo una imagen del display: https://www. si se las pasamos en el tamaño adecuado de 128×64 pixels. Lo que quiere decir que se pierden colores y grises y los resultados no son siempre lo esperas. EL programa es el mismo que el anterior.0x80.0x80.0x80. Para mostrar la imagen logo en pantalla.7.0x80. te genera un fichero de texto con la fuente de un array de char para C.0x80.net/curso-kit-inicio/ http://www.0x80. y podéis descargarlo fácilmente con una búsqueda en Google.0x80.0x80.0x00.prometec.0x80.0.0x80.0x80.0x80.0x80. prometec. Según la documentación. Como el display OLED que nos ocupa. esta pequeña joyita puede funcionar tanto a 5V como hemos hecho hasta ahora con el UNO.prometec.http://www. me encanta el DUE. Impresionante. como a 3.net/indice-tutoriales 134 Por aun tenía una duda pendiente. tanto en alimentación como en señales. pues lo que he podido encontrar en la página de Arduino DUE es que hay un límite entre 3mA y 15mA dependiendo del pin. da un consumo máximo de 15 mA (Supongo que cuando todos los pixels esta encendidos) nos queda una cierta incertidumbre de si el DUE puede manejarlo o no.net/curso-kit-inicio/ http://www. Y como no lo veía nada claro probé a conectarlo directamente a mi Arduino DUE (Si. que queréis que os diga). Además. y para mi satisfacción funcionó a la primera exactamente igual que con el Arduino UNO. como prueba: https://www. pero no específica cual es cual.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Aquí os dejo una imagen del DUE corriendo este mismo programa del reloj.youtube.3V. otro problema es que no tengo claro hasta que corriente puede suministrar el DUE en uno de sus pines. youtube. porque emite luz propia con un consumo ridículo y un precio menor que el de una entrada de cine https://www.net/curso-kit-inicio/ http://www. http://www.net/indice-tutoriales 135 RESUMEN DE LA SESIÓN • o Hemos presentado los displays OLED con este pequeño primer modelo. o Vimos que la conexión es trivial y que podemos montarlo directamente en los conectores de nuestros Arduino.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. lo que supone un plus muy interesante. o Es bastante fácil de manejar. o Un display que me ha gustado por su nitidez. tanto para textos como para pequeños bitmaps y disponemos de los ejemplos necesarios para usarlo.prometec. MATERIAL REQUERIDO. https://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . o Generar un gráfico de líneas que se van desplazando continuamente hacia la izquierda.96” 128×64 Dibujando con el diplay OLED Home Gráficos Y OLED 0.prometec. Arduino UNO o equivalente.96”. Una Protoboard . o Generar un diagrama de barras leyendo los valores de las puertas analógicas. http://www.net/curso-kit-inicio/ http://www.96” 128×64 OBJETIVOS • o Presentar los gráficos en el display OLED de 0. Algunos cables de protoboard. o Presentar las primitivas básicas.youtube.prometec.net/indice-tutoriales 136 43-GRÁFICOS Y OLED 0. No sería difícil de hacer primitivas gráficas sencillas para complementar este display. https://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Una vez listo buscad en el menú \\Archivo\ejemplos\\ Adafruit_SSD1306 el ejemplo SSD1306_128x64_SPI.8″ y que incluye muchas primitivas básicas de dibujo. no he podido resistirme a darle otra vuelta al asunto y ver como lo resolvíamos. y que no habíamos usado hasta ahora. que es el modelo del que dispongo pero fijaros que también hay ejemplos para display I2C y para 32 pixels de altura en lugar de 64. Me puse un cafecito cargado y empecé las pruebas para ver qué pasaba y…. Ahora la única cuestión es descargar e instalar las librerías correspondientes de Adafruit. Insertando el primer pin GND del display OLED en el pin GND de Arduino que tenemos al lado del digital pin 13. La primera es Adafruit_SSD1306 que corresponde al chip de nuestro display. Bastó con definir correctamente los pines a la entrada de los programas de ejemplos y arrancó inmediatamente con todas las funciones gráficas activadas.net/indice-tutoriales 137 Un display OLED de 0. La segunda librería es la gráfica de Libreria Adafruit GFX. que ya habíamos utilizado anteriormente en las sesión Display TFT SPI 1. he disfrutado mucho de este pequeño display y como habíamos dejado pendiente el tema de los gráficos. por pura vagancia y cuando me canse de ver el ejemplo gráfico me puse a ver cómo definir un par de programas más y el resultado. Se ve que el día anterior estaba más tonto de lo habitual.http://www. LOS GRÁFICOS Y EL OLED DE 128×64 Como os contaba en la sesión anterior.prometec.youtube. CONEXIÓN DE UN DISPLAYS OLED DE 128×64 Lo primero es que conectéis vuestro display como en la sesión anterior.prometec. Confio en que os pueda servir de algo. funcionó todo a la primera. conecté el display OLED directamente a mi Arduino. Instaladlas siguiendo el procedimiento habitual.98” SPI. Naturalmente.net/curso-kit-inicio/ http://www. pero me pareció absurdo que no pudiéramos usar las magníficas librerías graficas GFX de Adafruit que ya probamos en algún capitulo anterior y que para algo se ha currado el tema esta gente (A la que nuevamente renuevo mis agradecimientos). lo tenéis delante. con lo que el resto de los pines encajaran en su sitio sin más. Así que me dispuse a darle otro repaso al tema y buscar el problema porque en el primer intento me ganó por goleada y desistí. Para ello tienes que incluir estas líneas en el setup del ejemplo: pinMode(13. • El programa de ejemplo es grande y lleva la memoria del Arduino UNO muy cerca de su límite.net/curso-kit-inicio/ http://www. por lo que veréis mensajes de que puede haber problemas.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . De este modo mapeareis correctamente los pines. Volcad el programa y disfrutad el espectáculo. Aquí os dejo el ejemplo ya modificado para que lo probéis: Prog_43_1. OLED_CS). OLED_CLK.prometec.youtube. por ejemplo. digitalWrite(13. Así que se me ha ocurrido montar un programa que nos permitiese mostrar los valores que leemos en las puertas analógicas en forma de barras de altura proporcional a la señal leída. como si fuera un pequeño ecualizador gráfico. Reemplaza el código siguiente: // If using software SPI (the default case): #define OLED_MOSI 11 // 9 #define OLED_CLK 12 //10 #define OLED_DC 9 //11 #define OLED_CS 12 #define OLED_RESET 10 //13 Adafruit_SSD1306 display(OLED_MOSI. Además tenemos que alimentar el OLED dando tensión al pin 13. OLED_RESET. OUTPUT). La imagen promocional de este display OLED es un diagrama de barras que baila en la pantalla.prometec.net/indice-tutoriales 138 Ahora tenemos que redefinir los pines de conexión para que correspondan a la conexión que hemos hecho. y mini video con el tema: UN DIAGRAMA DE BARRAS O BAR CHART ¿Qué hace un ingeniero cuando resuelve algo demasiado pronto? Pues venirse arriba y complicarse la vida buscando algo más difícil. HIGH). http://www. OLED_DC. Y eso es todo. No le deis más importancia recordad que podéis usar cualquier modelo de Arduino. al ritmo de la música mp3. https://www. naturalmente. más las librerías de Adafruit graficas GFX y la que corresponde al chip que controla nuestro display OLED.h> #include <Adafruit_GFX. // Iniciar el display display. OLED_RESET.youtube. vamos a usar barras de 16 pixels de ancho porque 128/16 son 8 barras.net/indice-tutoriales 139 Veamos cómo empezar el tema. OLED_DC. y de paso aprovechamos para hacer un pequeño tutorial de esta librería GFX de Adafruit.clearDisplay().h> #include <Adafruit_SSD1306. // Borrar todo } https://www.h> #include <Wire. Necesitamos las librerías de SPI y WIRE de Arduino. En el setup.prometec.prometec.begin(SSD1306_SWITCHCAPVCC). Para simplificar un poco los problemas. y para ordenar el problema definiremos un array de 8 elementos. OLED_CLK.h> Después tenemos que definir los pines de control de nuestro display. byte data[8] .net/curso-kit-inicio/ http://www. const int ancho = 16 . iniciamos el display y lo borramos: void setup() { display. que son los mismo que comentamos en la sección previa: #define OLED_MOSI 11 // 9 #define OLED_CLK 12 //10 #define OLED_DC 9 //11 #define OLED_CS 12 #define OLED_RESET 10 //13 La siguiente línea crea una instancia del display SSD_1306: Adafruit_SSD1306 display(OLED_MOSI.http://www. la SSD_1306: #include <SPI. OLED_CS).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . data [8] que contendrá las alturas de las 8 posibles barras. que nos rellena un rectángulo de color. i<6 . Usaremos la función display. } Usamos un bucle de 0 a 5 para leer las puertas analógicas de A0 a A5. podéis subir este límite hasta 8.0) está en la esquina superior izquierda del display y no en la esquina inferior izquierda como suele ser habitual en las representaciones cartesianas. el punto de inicio X0. http://www. https://www.fillRect () de las librerías GFX.prometec. la del display OLED. pero podrías tocar la const ancho y bajar la anchura a 12 pixels y podrías usar 10 barras simultaneas. la anchura y la altura del rectángulo y luego un parámetro que es 0 para rellenar con negro y 1 para rellenar con blanco. SI usáis un MEGA o DUE. Haremos esto para cada puerta analógica y lo guardaremos en data[]: void loop() { for (int i=0 . barChart( ). Y0.youtube. int X1 = ancho . delay(150).net/indice-tutoriales 140 Como la máxima altura de la barra es de 64 pixels. • Nótese que el punto (0. i++) data[i] = 64 * analogRead( i )/1024 .com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Los parámetros a pasarle son.net/curso-kit-inicio/ http://www.2 . byte H = data[j]. j<6 . for (int j=0 . j++) { int X0 = ancho * j . calcularemos la altura como 64 * Lectura / 1024. Veamos la función: void barChart() { display. • Porque no caben más de 8 con el ancho de 16 pixels.clearDisplay(). porque estoy usando un UNO.prometec. en las que un punto va barriendo la pantalla y dejando una estela que nos muestra los valores anteriores.fillRect( X0. no tiene perdida. pero… (Siempre hay un pero) si llamásemos a Fillrect así: display. 1 ). Y calculamos X0 en función del número de barra que toca dibujar. 63. Aquí teneis Prog_43_3. la leemos del array data [].fillRect( X0. 127.http://www. verás como es así.youtube.h> #include <Adafruit_GFX. como los murciélagos y las estalactitas.h> https://www. 0.prometec. 1 ).net/curso-kit-inicio/ http://www.h> #include <Wire.h> #include <Adafruit_SSD1306. 1 ). display. necesitamos buscarnos problemas mayores. } Hacemos un for de 0 a 5 para calcular las posiciones de las 6 barras. 64. 1). Piénsalo.display(). Vamos a empezar con la parte más sencilla. 63. Tenéis que saber que si dibujas algo. Las barras colgarían del techo. que es dibujar un punto en cada abscisa (O sea la X) y cuando alcanza el final por la derecha simplemente borra y vuelve a empezar. Aquí os dejo el programa listo para ejecutar Prog_43_2 y un pequeño video que muestra el resultado en forma de barras bailando y siguiendo a un par de potenciómetros. X1 . 64. } display.X1 .fillRect( X0.64-H .prometec. el ancho de la barra es ancho – 2 para tener una zona de separación.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .Por eso cuando entramos a la función borramos la pantalla y al salir le pedimos que refresque la pantalla.display () .drawLine(0. por lo que tenemos que invertirlas haciendo: display. Empezamos con incluir algunas librerías y definir los pines correspondientes: #include <SPI.net/indice-tutoriales 141 display. para que estas librerías muestren los cambios de lo que has dibujado en pantalla tienes que invocar a display. Así que vamos a probar a ver qué pasa con un gráfico tipo las de esas máquinas que muestran el ritmo cardiaco del paciente. DIBUJANDO LÍNEAS QUE SIGUEN LA LECTURA Como dibujar las barras han sido demasiado fácil.X1 . y la costumbre es que la altura de las barras se mida desde el suelo. H .64-H . La altura H. x++) { int d = 64 * analogRead( 0 )/1024 .begin(SSD1306_SWITCHCAPVCC). display.drawPixel(x. } https://www. 1).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . d. display.prometec.clearDisplay().net/curso-kit-inicio/ http://www.net/indice-tutoriales 142 #define OLED_MOSI 11 // 9 #define OLED_CLK 12 //10 #define OLED_DC 9 //11 #define OLED_CS 12 #define OLED_RESET 10 //13 Adafruit_SSD1306 display(OLED_MOSI. for ( byte x = 0 . x<128 . En esto nada nuevo.clearDisplay(). void setup() { display. } delay(500). OLED_RESET. OLED_CLK. OLED_CS).http://www. } Vamos ahora con la parte difícil: void loop() { display. OLED_DC. display.prometec.youtube.display(). y tampoco en el setup. La idea es que reservo un array de 128 bytes y un índice que llamaremos index que crece a con cada nueva lectura.prometec. Lo primero que se me ocurre es usar un array de 128. Asi que me dispuse a grabar la imagen aleatoria que generaba el display al leer la puerta A0 y tuve una sorpresa. y además como nos sobra tiempo. ¿Y cómo hacer esto? Así de fácil: index = index % 128 . pero seguro que podemos mejorarlo.youtube. por lo menos hasta ahora. y lo que queremos es que apunte al 0 cuando sobrepasa el final del array a la lectura 128. Al empezar index vale 0 pero va creciendo. http://www.net/curso-kit-inicio/ http://www. En al pantalla solo tengo que dibujar los últimos 128 pixels. no acaba de aparecer. no voy a buscarla. https://www.. Como no estamos dibujando más que puntos sueltos cuando el cambio es rápido los puntos aparecen inconexos. pero el número de lecturas puede ser infinito. pero como lo que quiero es ilustrar la idea de un buffer circular. • Probablemente haya alguna función que me mueve una serie de pixels a la izquierda.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 143 ¿En serio os habias creido que era difícil? La parte difícil. ¿Cómo puedo resolver esto? La solución es un buffer circular. Echar una ojeada al video y me diréis: ACTUALIZANDO EL DISPLAY DE MODO CONTINÚO No está mal. para guardar las lecturas a medida que se produzcan e ir moviendo a la izquierda la pantalla que ya está dibujada.prometec. queremos que el display se vaya desplazando hacia la izquierda de modo continuo para hacer sitio a las nuevas lecturas. esto significa que primero usamos el valor de i y luego lo incrementamos. x++) { i = i % 128 . data[index] = 64 * analogRead(A0)/1024 .drawPixel( x. pero antes la aplicamos el truco de tomar su resto. si la variación es importante con relación al valor anterior. su valor recorre correrá desde 0 127 y volverá a empezar de modo que nunca rebasaremos su capacidad y conservamos las 128 últimas lecturas para poderlas dibujar. Solo me queda asignar la altura leyendo el array con i de índice. Para almacenar las lecturas de A0 tenemos que ajustarlas a escala: index = index % 128 . así que lo suyo seria unir estos puntos con una línea recta. para que al llegar a 127 se ponga a 0 y no tenga que hacer comprobaciones de si es mayor de 128 y cosas parecidas (Elegancia. así que hago byte i = index .prometec. Ahora uso un for con valores de x de 0 a 127. Ya tenemos resuelto conservar las 128 últimas lecturas. index++ . http://www.display(). ¿Pero cómo dibujarlas? Probemos con esto: byte i = index .youtube. el último punto a la derecha.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . for (byte x = 0 . Index apunta a la posición del valor más antiguo que tenemos (Lo que significa que será el próximo a borrar) y por tanto lo tengo que dibujar en x=0. y la altura son los valores guardados en el array que lo recorremos de modo circular con el truco del resto. lo que no resulta muy elegante. ¿Qué os parece? A este truco se le llama buffer circular y es muy útil en multitud de ocasiones. • Fijaros que hacemos data[i++]. el mas a la izquierda. 1).net/indice-tutoriales 144 A medida que el index crece como tomamos su resto con 128. al alcanzar ese valor se pone a 0 él solito. Y así ya puedo jugar con i. x <128 . display. Si fuera ++i seria incrementa primero y úsalo después. • Podéis crear un buffer circular de cualquier tamaño con este sencillo sistema y recorrerlo con seguridad. mucha elegancia siempre). los puntos quedaran muy separados. del mismo modo. Si grabamos la lectura actual en la posición que indica index++. pero no puedo tocar index porque lo necesitamos para saber dónde escribir el próximo valor.net/curso-kit-inicio/ http://www. data[i++]. El único problema con este planteamiento es que al dibujar puntos.prometec. Así que x va de 0 a la izquierda hasta 127. } display. mediante la instrucción: https://www. drawLine(x. 1). o Presentamos un modelo para dibujar gráficos de barras en movimiento. o Vimos como dibujar graficas de líneas que se van desplazando. como dibujar puntos y líneas.net/indice-tutoriales 145 display. http://www. y0.drawLine(x0. i++ . x-1. y1. data[i-1]. x1.prometec. o Hemos visto el procedimiento para dibujar con ellas y también algunas primitivas básicas. podemos hacer : display. Y como disponemos de la historia de los puntos en el array data. Aquí os dejo el programa completo Prog_43_4 y un mini video con el resultado: RESUMEN DE LA SESIÓN • o Hemos visto que es muy sencillo usar gráficos con las librerías de Adafruit GFX. https://www.youtube.net/curso-kit-inicio/ http://www. o Presentamos el concepto de buffer circular o Ring Buffer.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. data[i]. 1) . https://www. http://www. o Plotear una senoide. 3.2” Probando un display de tamaño medio Home Usando Un TFT Color De 3. líneas. o Complicar un poco más la programación de gráficos (poco más) con las gráficas de Lissajous.net/indice-tutoriales 146 44-USANDO UN TFT COLOR DE 3.youtube.2” TFT color de Seed Studio con touch panel D GRÁFICOS CON TFT DE 3.net/curso-kit-inicio/ http://www.prometec.. o Ver los comandos básicos para dibujar puntos. Arduino UNO o MEGA.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .2” 320×240 Tenía ganas de probar un display un poco más grande de lo que habíamos usado hasta ahora. y como tenia este display rodando por la mesa. le ha tocado el turno de pasar revista. textos.2”.2” OBJETIVOS • o Presentar los gráficos color con un display TFT de 3.prometec. MATERIAL REQUERIDO. net/curso-kit-inicio/ http://www. porque me ha dado no sé qué problema de complicación. porque me vendría de perlas la potencia del DUE para los cálculos gráficos.prometec. Además dispone de panel táctil integrado como bonus. que incluyen algunos programas sencillos para mostrar las posibilidades y que ilustran magníficamente las posibilidades de este display.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . En cambio no ha querido funcionar en un DUE.http://www. que es un problema que ilustra perfectamente los problemas de dibujar cosas en pantalla y que además nos fuerza a hacer algunos cálculos básicos de trigonometría en tipo float (Ya os digo que llovía mucho) Así que.8 centímetros) lo que es un tamaño ya respetable. DIBUJANDO UNA SENOIDE EN EL DISPLAY https://www. Resolución de 320×240 pixels.prometec. como yo sé que disfrutáis mucho con las matemáticas vamos a probar con este primer programa.net/indice-tutoriales 147 En principio tiene unas especificaciones de los mas interesantes.2 pulgadas (O de 7. Utiliza.youtube. además el bus SPI para comunicarse con nuestros Duinos sin sacrificar velocidad y me ha funcionado a la primera sin más que instalar las liberáis correspondientes. por supuesto. pantalla de 3. que no está mal para el tamaño y con color disponible. Lo primero que me ha gustado es que este display se comporta como un Shield que se instala directamente en un UNO o en un MEGA sin problemas. No es un display barato pero tenía curiosidad por ver que tal iba y como además llovía con ganas no apetecía nada salir. y e suna pena. ¿Qué puede uno hacer con un display grafico de colores como primera prueba? Pues dibujar una senoide. así que me dispuse a probarlo. 120.http://www. https://www. el punto (0. porque no tiene pinta de que vaya a dejar de llevor en mucho tiempo.prometec. Instalaremos esta librería y la SPI para comunicarnos con el display. que sepáis que esto es tan sencillo que tendremos que buscarnos algo más difícil. float y = i * 320/360 .0) del display será la esquina superior derecha y además para despistar un poco más. El loop será muy fácil: void loop() { for ( long i = 0 . usaremos una variable i que va tomando los valores de 0 a 360 grados. } exit(0). SI colocamos el display conectado a nuestro Arduino de modo que la alimentación le quede a la izquierda.319.setPixel(x.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . i++) { float y = i * 320/360 . i<360 . y de ahí.youtube.0. mediante las instrucciones #include <TFTv2.net/indice-tutoriales 148 Para los que aún no hayáis salido huyendo.y.RED). usa la vertical como coordenada x y la vertical como y (A mí no me miréis mal.TFTinit(). pero como el display dispone de 320 pixels de ancho tenemos que escalar el valor y por eso hacemos que y (que es la horizontal) vaya de 0 a 320 pixels cuando el Angulo varia de 0 a 360 grados.y0) a (x1.h> En el setup iniciaremos el display con Tft.drawLine(120.h> #include <SPI.0.zip e instalarla siguiendo el procedimiento habitual que describimos en la sesion correspondiente. que yo solo soy el mensajero) iros acostumbrando. float x = 120 + sin( i * k ) * 110 . // Terminar el programa } Para dibujar la grafica. y1) Que dibuja una línea a la altura de x 120 a lo largo de toda la pantalla. que utilizaremos como 0 para la senoide.net/curso-kit-inicio/ http://www. Podemos dibujar una línea horizontal (Dejando la alimentación a la izquierda) con Tft. // (x0.prometec.CYAN). Tenemos que empezar descargando la librería correspondiente Seeed_TFT_v2. Tft. Son gráficas muy sencillas de montar pero un pelín más complicadas que la simple senoide y se basan en calcular puntos en el plano cuya posición depende de un par de parámetros multiplicadores y de una diferencia de fase entre las señales.1416 /360 .youtube. Como el valor de sin() estará entre 0 y 1. y la idea es que producen unas figuras geométricas bastante sorprendentes para quien no las haya visto previamente.setPixel(x. https://www. no se vería mucho en pantalla si no lo multiplicamos por la mitad de la altura de la pantalla (UN poco menos en realidad para que no llegue hasta arriba del todo) y después le sumamos 120 (la mitad de la altura para que empiece centrada) Para dibujar un pixel en la pantalla usamos Tft.y.net/curso-kit-inicio/ http://www.http://www. DIBUJANDO LAS GRÁFICAS DE LISSAJOUS Según la Wikipedia las figuras de Lissajous son la superposición de dos movimientos armónicos simples en direcciones perpendiculares. Que calculamos una única vez para acelerar el dibujo y por eso corregimos el ángulo i en grados como i *k a radianes. yo tengo que hacer algo un poco más complicado y se me ha ocurrido probar a dibujar las figuras de Lissajous que seguro que os encantarán a todo aquellos que no las conozcáis.net/indice-tutoriales 149 Como la función sin () en Arduino requiere que la pasemos los ángulos en radianes tenemos que convertir los grados mediante el valor en radianes para cada grado: float k = 2 * 3. Que enciende el pixel en la posición (x.y) con el color indicado Aquí tenéis el programa completo Prog_44_1 y el resultado es más o menos así: Como sigue lloviendo.prometec.CYAN).prometec.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . RED).RED).h> Y algunas variables https://www.drawString("p = ". Basta con aplicar unas formulas sencillas y listo. además del ángulo de desfase. 319. // Eje horizontal Tft. 84.2 .2 .drawString("Fase = ". // Plot n Tft. RED) . x = 120 + sin( n * angulo + fase) * 110.drawNumber(n.drawLine(120. RED) . 300.150.drawNumber( fase. 200.h> #include <TFTv2. mediante una función que llamaremos referencias(): void referencias() { Tft. 48. Como en el ejemplo anterior usaremos una variable i que va barriendo de 0 a 360 grados y calcularemos la x e y de los puntos de la siguiente manera: y = 160 + cos( p * angulo + fase) * 120 .0. // Plot p Tft. Tft.net/curso-kit-inicio/ http://www.prometec. RED). 12. 120.12.net/indice-tutoriales 150 • Que no cunda el pánico.2 .prometec.drawString("n = ". 0. RED) .2.8. Ya podemos empezar con el programa principal.2. Tft.RED). // PLot Fase Tft.h> #include <SPI.300. dibujando la línea media y poniendo los valores de n y p en el gráfico. Primero los includes #include <stdint. Vamos a empezar por lo mas sencillo.drawNumber( p.youtube.300. La grafica resultante depende de los valores enteros que hayamos dando a n y p. pero al final es una tontería. 300. } Usamos las primitivas de la librería para posicionar y Plotear en pantalla las variables de control.2.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . las cosas son mucho más complicadas cuando te lo explican así. http://www. net/curso-kit-inicio/ http://www.setPixel(x. y0 = y . Calculamos k como un factor de conversión de grados a radianes y asignamos valores iniciales a las variables de control n .net/indice-tutoriales 151 float k = 2 * 3. float x = 120 + sin( n * i * k + fase) * 110 .y. // Guardamos x.y0. CYAN). y0 .prometec. byte fase = 0 . byte p = 3 .prometec.youtube. inicio = false . y. de la que luego hablaremos.y para luego } https://www. CYAN). void setup() { //TFT_BL_ON. if (inicio) // No dibujes la linea del primer punto { x0 = x .com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . byte n = 5 . p. } //Tft.1416 / 360 . xo e y0 para recordar el último punto ploteado y una variable de control. i <= 360 . float x0.x. i++) { float y = 160 + cos( p * i * k + fase) * 120 . y0 = y . bool inicio = true . // turn on the background light Tft.TFTinit(). x0 = x . Tft.drawLine(x0.http://www. y fase. //init TFT library } void loop() { for ( long i = 0 . http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 152 referencias() ; // Plotear texto y linea media exit(0); // Al finalizar, terminamos el programa } Calculamos x e y mediante las funciones de Lissajous, y las multiplicamos por un valor de escala de poco menos de la mitad de la altura y anchura de la pantalla para ajustar la amplitud. Y después le sumamos la mitad de la anchura y altura para centrar el gráfico. Tengo que usar el muy poco elegante control de inicio para que no dibuje una línea inicial que desluce el gráfico (Y no os imagináis lo que me pudre el tema, pero no veo como evitarlo). Y por último podemos dibujar un único punto con Tft.setPixel() o dibujar una línea contra el punto anterior con Tft.drawLine() que me parece más elegante. Aquí os dejo el programa Prog_44_2 y algunos ejemplos de los gráficos que resultan: n=2/p=1 https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 153 n=4/p=3 https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 154 n=6/p=5 https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 155 n=8/p=9 No hemos usado la fase para distorsionar la figuras, pero seguro que los que tengáis interés podeis ir probando para ver lo que sale. • Recordad que los ángulos que pasamos a la función sin y cos, tiene que ser en radianes y no en grados. Yo he puesto fase =0 porque 0 es 0 en grados y en radianes, pero no olvidéis convertir a radianes este ángulo. Y por último como seguía lloviendo he hecho un programita, Prog_44_3 que convierte el método de Lissajous en una función que acepta n, p y fase como parámetros y va lanzando en secuencia diferentes combinaciones de ambas. Por si en vuestro barrio también sigue lloviendo, aquí os dejo un vídeo con los últimos éxitos de Lissajous en directo En la próxima sesión probaremos el modo táctil para ver como va. Entre tanto si queréis probar un programa con touch screen, probad a cargar el magnifico ejemplo de SeedStudio incluido llamado paint que creo que os convencerá. RESUMEN DE LA SESIÓN https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 156 • Hicimos nuestros primeros pinitos con un display TFT de 3.2 y color. • Ploteamos la senoide sin problemas. • Nos atrevimos con las gráficas de Lissajous para ver que tampoco era para tanto. https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 157 45-PANEL TÁCTIL Y TFTS Probando el touch screen Home Panel Táctil Y TFTs OBJETIVOS • o Probar el panel táctil o (touch screen)de un display TFT de 3.2”. o Ver los comandos básicos para determinar la posición. o Aprender a usar algunos sliders y botones. MATERIAL REQUERIDO. Arduino UNO o MEGA. 3.2” TFT color de Seed Studio con touch panel De LAS PANTALLAS TÁCTILES En la sesión anterior estuvimos jugando con los gráficos en una pantalla TFT de 3.2” y dejamos pendiente probar el panel táctil que incorporan de serie, para ver que tal resultado dá y hasta qué punto pueden ser prácticas para el manejo en unas pantallas de relativo pequeño tamaño. https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 158 No tenía muy claro que la precisión fuera suficiente para permitirnos hacer aplicaciones prácticas basadas en el panel táctil, así que me puse a hacer pruebas para salir de dudas y tengo que decir que el resultado ha sido de lo más satisfactorio. La precisión con la que el panel reconoce la presión, especialmente de un stylus o similar, es magnífico y nos permite usarlo en programas que no necesitan botones, deslizadores o pontenciómetros adicionales, sino que podemos usar con confianza la característica táctil de estos paneles. Así que pensando, pensando, se me ocurrió ampliar el programa anterior de dibujo de las figuras de Lissajous, añadiendo un panel táctil que nos permitan configurar los tres parámetros de entrada: n, p y fase. Bastaría con dibujar tres deslizadores para proporcionar el valor de los parámetros de 1 a 9 para los valores de n y p, y de 0 a 360º para el ángulo de fase. Además vamos a precisar de un botón de OK y otro de Cancel para devolver los valores al programa de dibujo, lo que nos presenta un problema interesante para trabajárnoslo. Necesitaremos también, algún modo de presentar valores numéricos en la pantalla para saber que valores vamos adoptando, lo que nos va a permitir hacer un repaso general a todas las primitivas disponibles en las librerías de SeedStudio. Así que vamos directamente al lio que vamos a tener trabajo. DESCRIPCIONES VARIAS En la última sesión se me olvidó incluir una descripción de los pines que utiliza este Shield TFT, por lo que es buen momento para corregir este descuido: Como este display utiliza el bus SPI para comunicarse con Arduino, reserva los pines correspondientes para el control, además del digital pin D4 para el control del lector de tarjetas SD y el D5 para el Chip select del display. https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos http://www.prometec.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 159 Para leer el panel táctil se reserva los pines analógicos del A0 al A3. El manual describe que el panel táctil se parece a un conjunto de 4 resistencias como estas: Cuando tocamos la pantalla aparece una nueva resistencia, como R touch, de modo que leyendo la tensión de las 4 resistencias podemos calcular la posición en la que se ha tocado la pantalla. La verdad es que no entiendo nada, pero como usando las librerías proporcionadas por SeedStudio, da lo mismo que no lo entienda, podemos usarlas tranquilamente. Y según el manual la unión de los pines es más o menos así: • Arduino A0 a Y- • Arduino A1 a X- • Arduino A2 a Y+ • Arduino A3 a X+ PROGRAMANDO EL PANEL TÁCTIL Para empezar necesitamos la librería táctil Seeed_TFT_v2.0.zip, además de la librería Touch_Screen_Driver- master y de la SPI, por lo que necesitamos algunos includes al principio de nuestro programa: https://www.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos // Fase Tft. 40.h> TouchScreen ts = TouchScreen(XP. YP. 24. 280*F/360 +50. //init TouchScreen port pins La última línea. //init TFT library Ya dijimos que necesitamos tres deslizadores p. 24.fillRectangle(30.fillRectangle(150.youtube. 40.net/curso-kit-inicio/ http://www.prometec. 24.fillRectangle(90. Vamos a dibujar todo esto con una función llamada initPlot: void initPlot() { Tft.prometec. 24. XM. // Slider 1 Tft. RED). BLUE). YM). } Aquí tenéis una foto con el resultado: https://www.fillRectangle(0. 24. GRAY1).fillRectangle(0. Tft. 40. 22*P+50.110. 250. 250.h> #include <SPI. BLUE). 24.net/indice-tutoriales 160 #include <SeeedTouchScreen.fillRectangle(30. n y fase para el programa además de dos botones para OK y Cancel. // PLot Status Slider 2 Tft. // PLot Status Slider 1 Tft. 250.162. GREEN). 40. GRAY1). GRAY1). Tft.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .fillRectangle(90. 22. BLUE). 22*N+50. 40. crea una instancia de touch screen llamada ts para que podamos leer el panel y necesitamos inicializarla mediante: Tft.TFTinit(). // Slider 2 Tft.110. 24.fillRectangle(150.http://www. 40.h> #include <TFTv2. 22. 0. RED) . int y) { Tft.y que corresponden a los valores de x e y del punto tocado. 0.net/indice-tutoriales 161 Los 3 deslizadores son de fondo gris.x.0. //mapear lecturas en coordenadas X.net/curso-kit-inicio/ http://www. Y para que al principio sepamos donde estamos pulsando.0) queda en la esquina inferior derecha.2.x y p. Tft.drawString("x = ".prometec. 240.300. TS_MINX.300.fillRectangle(0. La parte básica de leer el panel táctil son estas líneas: Point p = ts.RED). TS_MAXY.prometec. TS_MAXX.y = map(p.getPoint().150. // Plot x Tft. Recordad que con la alimentación de Arduino a nuestra derecha. 320). p. Creamos un objeto tipo Point que tiene dos valores p. BLACK).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . el punto (0.2. pero en la foto aparecen como azul oscuro y el nivel delos mismos se marca en azul.http://www.drawNumber( x. conviene que hagamos una función que nos informe sw donde tocamos: void referencias(int x. Además en rojo el botón cancel y en verde el OK.Y p. 294.youtube.x = map(p.y. pero con la y en la horizontal y la x en vertical para que no sea demasiado fácil. TS_MINY. // Borra valores de x e y Tft. // Plot y https://www. 48. 30. 240).drawString("y = ". 300.2 .RED). 270.15.270. https://www. int y) { if ( (x>20 && x< 65) && ( y>15 && y<270)) // Slider 1 P = map( y.net/indice-tutoriales 162 Tft.youtube. 200.15.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .1. Lo siguiente que vamos a necesitar es alguna manera de saber que estamos tocando dentro de uno de los deslizadores o botones para moverlos o activarlos.1.drawNumber( y.270.2 . RED) . if ( (x>90 && x< 133) && ( y>15 && y<270)) // Slider 2 N = map( y. Lo llamaremos SenseControl: void SenseControl(int x. Aquí os dejo una copia inicial del programa que ha dibujado esta imagen Prog_45_2 y que os servirá para mostrar las coordenadas del punto en el que se pulsa.-3.prometec.15.http://www. 300.360).net/curso-kit-inicio/ http://www.10).10). if ( (x>145 && x< 195) && ( y>15 && y<270)) // Slider 3 { F = map( y. } Con lo que veréis que los valores de x e y bailan lo suyo.prometec. 24. p. else if ( y>150 && y <270) // Boton rojo cancel Serial. 0.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .y) . p.youtube. Y ya solo nos falta el loop: void loop() { Point p = ts. } https://www. TS_MINY.net/indice-tutoriales 163 if (F <0 ) F = 0 . Esta función comprueba que los puntos donde tocamos queden dentro del recuadro correspondiente (poco más o menos) y mapea una variable P.prometec. if ( P0 != P ) { Tft.fillRectangle(30.y. 0. TS_MINX.x.net/curso-kit-inicio/ http://www.println("OK"). // PLot Status Slider 1 plotVal(). delay(200). 240). GRAY1).y = map(p. // Slider 1 Tft.getPoint(). 40. referencias(p. 320).x = map(p. TS_MAXX. TS_MAXY. 40. } if ( x<24) if ( y>16 && y <130) // Boton verde OK Serial.http://www.fillRectangle(30.N o F a valore de 1 a9 o de 0 a 360º en función de la altura del deslizador que se toca. } Donde mapeamos los valores correspondientes a n y p y entre 0 y 10. 22*P+50. 250.x. SenseControl(p. 24.y) .println("CANCEL").x. y hasta 360º para la fase. p. BLUE). // mapear las lecturas p.prometec. Me encantaría escribir OK y Cancel en los botones Verde y Rojo. 22*N+50. Para ello he mezclado un par de las funciones anteriores procesControl() y senseControl() en una única función . Aquí tenéis el programa completo Prog_45_1 UNIENDO EL PANEL TÁCTIL Y EL QUE DIBUJA LAS CURVAS El programa anterior mueve los valores de los deslizadores directamente desde el loop principal lo que no nos conviene nada para unirlo con el programa de ploteo de las curvas de Lissajous que vimos en la sesión anterior.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . 250*F/360 . } else if (F != F0) { Tft. 24.N o F cambian. // PLot Status Slider 2 plotVal(). } Cuando detectamos que al tocar en los distintos rectángulos los valores de P. F0 = F .youtube. pero no parece haber modo de girar las letras.fillRectangle(150. Por lo demás es exactamente lo mismo de antes: https://www.net/indice-tutoriales 164 else if ( N0 != N ) { Tft.net/curso-kit-inicio/ http://www. 40. porque no sé si os habéis dado cuenta que hemos cambiado la referencia de origen en ambos programas. 250. por lo que vamos a tener que tocarlo un poquito (Pero poco). desde una bucle while. 24.fillRectangle(90.prometec. • Lo que va a generar más de un problemilla. // Slider 2 Tft. 250. BLUE). para mostrar el avance del deslizador. 40. No vamos a usar ninguna idea nueva y se trata solo de adaptar ambos programas para que se mezclen sin hacer grumos. 40. 24. 40. BLUE). 24. } N0 = N . redibujamos el fondo gris y la parte en azul.prometec. GRAY1). plotVal().fillRectangle(150. GRAY1). http://www. // Fase Tft. P0 = P . del que solo se sale cuando pulsamos el botón de OK (Devuelve true) o de CANCEL (Que devuelve false).fillRectangle(90. lo que básicamente procesa todo el tema del panel de control y los deslizadores. while (true) { Point p = ts.prometec.1.15. if ( (x>90 && x< 133) && ( y>15 && y<270)) // Slider 2 N = map( y.getPoint().1.y. https://www. p. } if ( x<24) if ( y>16 && y <130) // Boton verde OK return(true). 240). 0.360).x.270.http://www.y .youtube.-3.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . if ( (x>20 && x< 65) && ( y>15 && y<270)) // Slider 1 P = map( y. TS_MAXY.x = map(p. int y = p. if ( (x>145 && x< 195) && ( y>15 && y<270)) // Slider 3 { F = map( y.prometec. / p.x. if (F <0 ) F = 0 .net/curso-kit-inicio/ http://www.15.x . 0.270.y) . TS_MINY. p. 320). TS_MINX. delay(200).270.15. int x = p.net/indice-tutoriales 165 bool procesControl() { initPlot() .10). TS_MAXX.10).y = map(p. referencias(p. plotVal().net/curso-kit-inicio/ http://www. GRAY1). } N0 = N . 24.fillRectangle(90. 24. if ( P0 != P ) { Tft. P0 = P . 24. 250*F/360 . 22*N+50. 40. // PLot Status Slider plotVal(). 40.prometec. 40. 40.prometec. 24. 22*P+50. BLUE). 40.fillRectangle(150. 250. } else if ( N0 != N ) { Tft. 250. } } Además he ampliado el loop principal que dibuja las curvas. } else if (F != F0) { Tft.net/indice-tutoriales 166 else if ( y>150 && y <270) // Boton rojo cancel return(false).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . para que pueda saltar a la función de proceso de los controles: void loop() https://www. GRAY1).http://www. // PLot Status Slider 2 plotVal().fillRectangle(90.youtube. GRAY1). // Slider 1 Tft. // Fase Tft. F0 = F .fillRectangle(150. 24. BLUE). 250.fillRectangle(30. 24. 40.fillRectangle(30. BLUE). // Slider 2 Tft. 0. Point q = ts. p. TS_MINX. } Tft. 0. TS_MAXY. i++) { float y = 160 + cos( p * i * k + fase) * 120 .y0. BLACK).. 240.x.y.http://www. // Borra display n = N .x = map(q. delay(200). TS_MINY.prometec. //referencias(p.x. CYAN). inicio = false . https://www.drawLine(x0.getPoint().net/curso-kit-inicio/ http://www. int y = q. 240.net/indice-tutoriales 167 { for ( long i = 0 . int x = q.youtube.x .y. 320.y = map(q. BLACK). // SI OK { Tft. 320). q. 320. // Borra display if ( procesControl()) . i <= 360 . y0 = y . p = P .prometec. TS_MAXX. 240).y) . float x = 120 + sin( n * i * k + fase) * 110 .fillRectangle(0. 0. } // ………………………………………………………. q. 0.fillRectangle(0.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .y . if ( x<120 ) { Tft. Ref() . x0 = x . y0 = y .x. if (inicio) { x0 = x . que. pero le hemos añadido más código tras la línea de puntos. hay cosas a posteriori que he tenido que encajar un poco a martillazos para que encajen. https://www. el tema del touch screen. que no hay quién lo entienda y en su lugar plotee el valor en grados y cosillas parecidas de ajuste. o sea la parte inferior con la alimentación de Arduino a la derecha. pero creo que voy a dejároslo a vosotros. Si es así. http://www.net/curso-kit-inicio/ http://www. No hay más. comprueba si se toca la pantalla para de x<120.youtube. p y fase a los que traemos de nuevos y redibuja la curva. } } } Fíjate que no hay diferencia en la función que plotea las curvas.prometec. modificar que no imprima el valor de la fase en radianes. • Como cuando empecé con el dibujo de las curvas no tenía aun en mente. RESUMEN DE LA SESIÓN • o Hemos jugado con el panel táctil para ver que funciona bastante bien y que nos permite evitar añadir potenciómetros y deslizadores adicionales para el control de nuestra aplicación. Si alguno se anima lo publicamos aquí para la posteridad. o Vimos que ha sido bastante sencillo definir zonas activas como botones y deslizadores a nuestro proyecto. me temo que ha habido varias versiones) y un mini video mostrando el uso del conjunto.prometec. o Y a pesar de la improvisación de la mezcla hemos sido capaces de combinar los dos programas previos en una aplicación única que nos permite modificar las curvas de Lissajous mediante 3 deslizadores y dos botones. • Hay alguna que otra cosa más como adaptar tipos de algunas variables para que coincidan. lanza procesControl () para que modifiques los parámetros y a la vuelta asigna los valores de n.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . básicamente. Aquí tenéis el programa Prog_45_9 (Si.net/indice-tutoriales 168 fase = F * 2 * PI / 360 . • Así que convendría pulir un poco el programa reescribiéndolo desde el principio para dejarlo presentable y poderlo enseñar. o Ver la forma de conectarlo a nuestros Arduinos. o Instalar las librerías de texto y graficas necesarias. Esta sesión acepta cualquier otro mod Una Protoboard.youtube.net/curso-kit-inicio/ http://www.prometec.net/indice-tutoriales 169 46-DISPLAY NOKIA 5110 Usando un sencillo display LCD Home Display Nokia 5110 OBJETIVOS • o Presentar el Nokia 5110. Arduino Uno o similar. http://www. MATERIAL REQUERIDO. Cables de protoboard Un display mocromo Nokia 5110. https://www.prometec.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . youtube. será una razón que se ira difuminando y por otro el consumo.prometec. y con dos ventajas importantes: poco coste y consumo mínimo.net/indice-tutoriales 170 LOS DISPLAYS NOKIA En una sesión anterior vimos cómo manejar un pequeño display Nokia 3110 y en esta vamos a tocar un pariente próximo el Nokia 5110. escasamente 20 mA en funcionamiento y aún menos si borras la pantalla. pero que nos permiten añadir más cuantas líneas de texto e incluso unas posibilidades graficas basadas en la librería GFX de los chicos de Adafruit.http://www. y si no enciendes las luces de contraste para poderlo ver en la oscuridad. Técnicamente no me parece mal el consejo. que a medida que los TFT se abaraten. por un lado el precio.net/curso-kit-inicio/ http://www. y en eso los TFTs no pueden competir por ahora (Excepto los OLED. lo que facilita mucho la conexión a nuestros Duinos con solo 4 hilos de control: https://www. pero hay dos cosas que juegan a favor de los Nokia 5110 en esta contienda. No es raro encontrar en Internet gente que desaconseja estos displays por considerarlos tecnología obsoleta. que comparte muchas características comunes con aquel y alguna ventaja. que aun están caros) Y por ese motivo vamos a dedicarles una pequeña sesión en la que veamos cómo manejarlos desde nuestros Arduinos. Veremos que son displays sencillos y de poca resolución. Este tipo de displays consumen menos que un mechero. DIAGRAMA DE CONEXIÓN Estos displays disponen de un interface SPI.prometec. y porque además son divertidos y con aspecto de tecnología retro que siempre es nos gusta. (Son los años 90) y recomendar usar un panel TFT en color moderno en su lugar.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . 3 y no 5V BackLit GND = Máximo brillo GND Ground GND Y aquí tenemos el diagrama de protoboard: https://www. son 3.net/indice-tutoriales 171 Vamos a empezar viendo la tabla de conexiones a nuestro Arduino UNO.youtube.prometec.http://www.prometec. PIN ARDUINO RST Reset 3 CE Chip Enable 4 DC Data/Command 5 DIN SPI IN 6 CLK SPI Clock 7 VCC 3.3V 3.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .3V Cuidado aquí.net/curso-kit-inicio/ http://www. prometec. .3V. que además de funcionar muy bien. que coincide (Por pura casualidad) con el diagrama de conexión que hemos seguido en esta sesión. que tendréis que modificar si vuestra conexión es diferente. Para cargar el ejemplo. • De no se así. por lo que se suele recomendar el uso de resistencias de 10KΩ para garantizar el nivel de la señal. que regula la intensidad y el consumo de la luz de fondo para ver el display en la oscuridad. al principio del ejemplo hay una definición de pines para el control SPI. Nos referimos a las librerías de Adafruit. PROGRAMANDO EL NOKIA 5110 Hay varias librerías disponibles para manejar este display. poniéndolo a GND se supone que es el máximo brillo. http://www. podéis hacer: https://www.net/indice-tutoriales 172 • En este diagrama no hemos usado el pin BL o BackLit.prometec. • El ejemplo gráfico que viene con la librería usa los pines de un cierto modo. pero vamos a optar por unas viejas conocidas. y con la virtud de ser gráficas unificadas para toda una colección de displays de distinta naturaleza. • Dado que este display está diseñado para 3.youtube. por lo que aplicando la regla de la vagancia no he incluido resistencias. estamos ya acostumbrados a su uso por sesiones anteriores. y aun cuando hemos conectado la alimentación a 3. Una vez instaladas lo más sencillo es lanzar la demos grafica que viene con la librería.3V las señales de los pines Arduino siguen siendo a 5V. que tiene una librería específica para este display Adafruit-PCD8544- Nokia-5110-LCD-library-master y si necesitamos gráficos deberemos incluir la Libreria Adafruit GFX. • En mi experiencia no ha sido necesario y el display no ha dado muestras de ningún problema tras varias horas de uso.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . o un level shifter (De los que tengo pendiente hablar un día e estos).net/curso-kit-inicio/ http://www. Aquí os dejo un pequeño video con el resultado de la demo: RESUMEN DE LA SESIÓN • o Hemos presentado el NOKIA 5110. o Los manejamos con las ya conocidas librerías de Adafruit https://www. pero si lo revisaís. No vale la pena entrar en el detalle del programa demo. encontrareis que está bien organizado como ejemplo de uso de la librería y podéis modificar las partes que os interesen para vuestros propios programas sin mayor dificultad.net/curso-kit-inicio/ http://www. • Si no fuese así.prometec. http://www. o Vimos que son displays sencillos pero también baratos y de poco consumo.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .youtube.prometec.net/indice-tutoriales 173 \\Archivo\Ejemplos\ Adafruit PCD8544 Nokia 5110 LCD library\pactes Y tras ello el display os mostrara la típica demos gráfica y de texto de la librería GFX. o Son muy sencillos de manejar mediante SPI. mandarme un email y ampliamos esta sesión para incluir algún ejemplo sencillo de como mostrar textos en pantalla. youtube.prometec. • Cargar y mostrar imágenes. • Control de acceso https://www.5″ Touch Para Arduino Mega • Preparar la librería y dibujar en la pantalla.5″ TOUCH PARA ARDUINO MEGA Índice de tutoriales del shield táctil de 3.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . http://www.net/curso-kit-inicio/ http://www.net/indice-tutoriales 174 -SHIELD TFT LCD 3.prometec. • Cómo usar la funcionalidad táctil.5 Home Shield TFT LCD 3. prometec.prometec.net/indice-tutoriales 175 -PREPARAR LA LIBRERÍA Y DIBUJAR EN LA PANTALLA Probando la librería UTFT Home SHIELD PANTALLA DE 3. lo que nos permite controlarla tocando con el dedo directamente sobre ella y tiene una resolución de 480×320 pixeles.5” o Descargar la librería UTFT modificada que funciona correctamente con ella. relativamente alta para su tamaño. http://www. CARACTERÍSTICAS DEL SHIELD El shield del que hablamos en esta ocasión consiste en una pantalla TFT LCD en color de 16 bits y de 3. de forma que encaja directamente sobre él y nos libra de tener que usar cualquier otro tipo de hardware adicional.net/curso-kit-inicio/ http://www. Funciona como pantalla táctil al incorporar un sensor capacitivo. https://www. aunque de momento no hemos conseguido hacerla funcionar en condiciones. Está diseñada específicamente para funcionar con el Arduino Mega.youtube. MATERIAL REQUERIDO Un Arduino Mega.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .5” TÁCTIL PARA ARDUINO MEGA OBJETIVOS . Además contiene una ranura para tarjetas SD.5” de tamaño. o Entender algunas funciones. o Cargar varios ejemplos y ver cómo funciona.5″ táctil. • o Presentar una pantalla TFT LCD táctil de 3. Un shield TFT LCD 3. En el setup lo que hace es inicializar y limpiar la pantalla y fijar la fuente para el texto.39. extern uint8_t SevenSegNumFont[].40. En este caso nuestro controlador es el ILI9481 y los parámetros para el Mega podemos verlos en los comentarios: UTFT myGLCD(ILI9481. Seleccionamos el sketch “UTFT_Textrotation_Demo”.38. Tenemos que declararlas aquí para poder usarlas más adelante en nuestro programa.net/curso-kit-inicio/ http://www.net/indice-tutoriales 176 Hay muchos tipos de pantallas como esta. imágenes o cualquier cosa que se nos ocurra. https://www. Para probarla vamos a abrir primero un ejemplo sencillito en el que mostraremos algunos caracteres en el display en diferentes tamaños. algunos ejemplos de la librería ni si quiera os compilarán… Pero no os preocupéis porque la hemos modificado para funcionar específicamente con este modelo de pantalla. Al abrir el programa veremos cómo lo primero que hace después de incluir la librería es declarar las fuentes de textos que vamos a usar. En este caso la nuestra usa el controlador ILI9481 y es de la casa mcufriend.prometec. como ya es costumbre. por lo que es muy importante estar seguro de cuál estamos usando y sobre todo del controlador que usa.41). figuras. y podéis descargarla aquí: UTFT. Un poco más abajo tendremos que seleccionar el controlador que usa nuestra pantalla e introducir los parámetros en función de la placa Arduino para la que está diseñado el shield.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. Podemos utilizarla para mostrar texto. limitados únicamente por la memoria de nuestro Arduino. y si bajáis directamente la librería UTFT que se utiliza en teoría para esta pantalla os van pasar bastantes cosas raras: ver la pantalla como si fuese un espejo.youtube. colores y direcciones. LIBRERÍA UTFT Esta pantalla es muy versátil y relativamente sencilla de usar gracias a una librería. Pero no es oro todo lo que reluce. funciones.http://www. Los ejemplos que sirven para nuestra pantalla están dentro de los ejemplos de la librería en el apartado “Arduino (ARM) + Teensy”. // Declare which fonts we will be using extern uint8_t BigFont[]. com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . 0). 90).print("45". myGLCD.youtube.setFont(BigFont). 255.InitLCD(). myGLCD. 45).print("90 degrees". 180). En el primero escribimos entre comillas el texto que queremos mostrar. myGLCD. El último parámetro es opcional y se utiliza si queremos que el texto se muestre en un ángulo diferente. 100. } En el loop utiliza dos tipos de instrucciones: myGLCD. 0. 255). myGLCD. y se hace mediante tres parámetros R.net/curso-kit-inicio/ http://www. myGLCD. como hemos hecho ya otras veces.print("270 degrees".rotation)” //Muestra texto en la pantalla myGLCD. https://www. 0.print("0 degrees". 0.x. myGLCD. 0.prometec.setColor(0.http://www. void loop() { myGLCD.clrScr().net/indice-tutoriales 177 void setup() { myGLCD. B.print("Text rotation". 90. G.setColor(0. 319. La segunda instrucción sirve para fijar el color. 270). myGLCD.setFont(SevenSegNumFont). 239. myGLCD.prometec.print("180 degrees". 0). 0. myGLCD.b)” //Cambia el color del texto La primera de ellas sirve para sacar texto en la pantalla y tiene 3 parámetro obligatorios y uno opcional. 0). myGLCD.print (“text”.setColor(r. 16. y a continuación la posición inicial X e Y para el primer carácter. 239. 319.y.g. radius) //Dibujo un círculo myGLCD.y2). 200. //Fija el color del fondo myGLCD.y1. Para ello vamos a la misma categoría que antes y esta vez seleccionamos “UTFT_Demo_480x320”.x2. FIGURAS Y FUNCIONES Otro de los ejemplos que viene con la librería nos va a servir para ver un poco por encima cómo se pueden dibujar líneas.drawCircle(x. 180).drawLine(x1. //Dibuja una línea entre dos puntos myGLCD.print("90".fillCircle(x.prometec.b).y. //Dibuja una circunferencia https://www. } DIBUJANDO LÍNEAS.fillRect(x1.y1.y.http://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 178 myGLCD. 50. 300.prometec.x2.y2). myGLCD. 200. while (true) {}.x2.setBackColor(r. //Dibuja un rectángulo con relleno myGLCD. funciones y algunas figuras geométricas.y) //Pinta un único pixel myGLCD.net/curso-kit-inicio/ http://www.y1. //Dibuja un rectángulo entre dos puntos myGLCD.drawRect(x1.youtube.g.radius).y2).print("180". 90). Toda la primera parte hasta el loop va a ser idéntica al programa pero una vez ahí vamos a echar un ojo a algunas de las funciones nuevas que contiene: myGLCD.drawPixel(x. drawRoundRect(x.net/indice-tutoriales 179 myGLCD.x2. pero aquí os dejamos un pdf en el que podréis ver cómo y para qué se utilizan: UTFT.drawBitmap (x. //Dibuja un rectángulo con los vértices redondeados myGLCD. costumbre ya a estas alturas. Esta instrucción dibuja la en la pantalla la imagen que tengamos guardada en el array que le indiquemos con los parámetros que le hayamos pasado. //Dibuja un entero Hay un montón de comandos más que no tendría sentido soltar aquí uno tras otro. y2). pero lo arreglamos fácil.printNumI(num.y.length. En este ejemplo tenemos que ir a los archivos de las imágenes y hacer que las guarde en la flash. x2.h> const unsigned short icon[0x400] PROGMEM={…} Además recordad que tenemos que modificar el modelo de pantalla que estamos utilizando.array. Cuando queramos mostrar una imagen lo primero que deberíamos hacer es convertirla en un array (ya veremos en la próxima sesión cómo hacer esto) y guardarla en la memoria flash del Arduino. Para eso incluimos la librería y modificamos la instrucción donde declaramos la variable: #include <avr/pgmspace.y.prometec. https://www. En este programa la instrucción nueva que vamos a usar es: myGLCD.fillRoundRect(x1.escala). //Dibuja un rectángulo relleno con los vértices redondeados myGLCD. si lo subimos al Arduino veremos tres logos en la pantalla en diferentes tamaños y posiciones.prometec. El nombre del programa es “UTFT_Bitmap”. Ahora sí.net/curso-kit-inicio/ http://www.filler). Si cargáis este programa directamente no os funcionará.http://www.youtube.y2).alto.ancho.x.y1. y.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . MOSTRANDO IMÁGENES EN PANTALLA Por último vamos a abrir un ejemplo de la librería en el que veremos cómo mostrar imágenes en la pantalla. https://www. o Hemos aprendido cómo funciona la librería que hemos adaptado a nuestro modelo de pantalla.youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec.net/curso-kit-inicio/ http://www. http://www. o Hemos visto unos ejemplos y aprendido cómo funcionan algunas de las funciones más importantes.net/indice-tutoriales 180 En la siguiente sesión crearemos nosotros un programa en el que además utilizaremos el sensor táctil de la pantalla para interactuar con ella. RESUMEN DE LA SESIÓN En esta sesión hemos aprendido varias cosas importantes: • o Hemos presentado una pantalla táctil con buena resolución y un tamaño considerable.prometec. Por otro lado. Normalmente existen dos tecnologías diferentes a la hora de fabricarlas. o Ver cómo funcionan algunos ejemplos. de forma que al presionar sobre ella dos capas entran en contacto. Un shield TFT LCD 3.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . MATERIAL REQUERIDO Un Arduino Mega. resistivas y capacitivas. o al sacar el bono del metro. la tablet. por ejemplo. más gruesas y pesadas.net/curso-kit-inicio/ http://www. se produce un cambio en la corriente eléctrica y detectamos la pulsación. por su comodidad y facilidad de uso para prácticamente cualquier persona. no les afecta ni el polvo ni el agua salada y se pueden usar con cualquier objeto. un dedo. http://www.prometec. desde niños muy pequeños a personas mayores. • o Aprender a utilizar la funcionalidad táctil. Y es que estos dispositivos se han hecho un hueco en nuestra sociedad a la velocidad del rayo. Las resistivas están compuestas por varias capas. un stylus o cualquier cosa que tengáis a mano (que no sea muy afilado o la pantalla se rallará).5 Home UTILIZAR LA PANTALLA TÁCTIL OBJETIVOS .youtube. o Descargar la librería URTouch modificada para este modelo. en el teléfono. o Crear un programa para visualizar las coordenadas de la pantalla que toquemos. el PC.net/indice-tutoriales 181 -UTILIZAR LA PANTALLA TÁCTIL Shield LCD TFT táctil 3. LAS PANTALLAS TÁCTILES A estas alturas no habrá nadie que lea esto que no haya utilizado una pantalla táctil hoy mismo y varias veces seguramente. https://www.prometec. un cajero.5″ táctil. Esto hace que las pantallas sean menos brillantes. http://www. empezaremos incluyendo las librerías que vamos a usar. Recordad que las resolución de la pantallas es 480×320. Así que en Prometec hemos modificado la librería para que funcione como es debido con este modelo de pantalla.net/indice-tutoriales 182 Las capacitivas están compuestas de una capa con aislamiento eléctrico (como el cristal) cubierto de un material conductor transparente. Para comprobar que funciona todo correctamente vamos a hacer un programa que nos muestre en la pantalla las coordenadas que toquemos en cada momento. y declararemos dos instancias. Además tenemos que incluir las fuentes que usaremos para el texto.prometec.h> #include <UTFT. las librerías que se utilizan para este tipo de pantallas táctiles son muy genéricas. DESCARGAR Y PROBAR LA LIBRERÍA De la misma forma que en la sesión anterior.prometec. y como suele decirse.youtube. Como nuestra piel es conductora. quien mucho abarca. • Definiremos también los pines que utiliza la pantalla de nuestro Arduino Mega. Como siempre. La pantalla que estamos utilizando nosotros es de tipo resistiva. Y si no tenéis la librería que utilizamos en la sesión anterior para utilizar la pantalla la tenéis aquí: UTFT. Este tipo de pantallas sólo podemos usarlas con el dedo o punteros o periféricos hechos de materiales especiales. Podéis descargarla aquí: URTouch.net/curso-kit-inicio/ http://www. poco aprieta. • Recordad que el driver que usamos para la pantalla es ILI9481. una para la pantalla y otra para el táctil.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . así que las coordenadas para las pulsaciones irán de 0 a 479 para el lado ancho de la pantalla y de 0 a 319 para la parte más estrecha. al tocar la pantalla se crea una distorsión eléctrica que podemos medir y detectar la pulsación. #include <URTouch.h> // Set the pins to the correct ones for your development board // ----------------------------------------------------------- https://www. InitTouch(PORTRAIT). 3.40.net/curso-kit-inicio/ http://www.prometec. 39. Al inicializar la funcionalidad táctil tenemos que elegir la orientación de la pantalla. En el setup tenemos que inicializar la pantalla como hicimos en la sesión anterior. 40. Además fijaremos el color del fondo de la pantalla y la fuente y el color texto que mostraremos. y si la queremos usar en vertical. 5.fillScr(VGA_BLACK).net/indice-tutoriales 183 // Standard Arduino Uno/2009 Shield : <display model>.prometec.41 UTFT lcd(ILI9481.http://www.18. tactil. 5. lcd.16 // Standard Arduino Mega/Due shield : <display model>. “PORTRAIT”. 4. void setup() { lcd. 2). 38.setFont(BigFont).39.setColor(VGA_WHITE).clrScr(). extern uint8_t BigFont[]. lcd.38.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . lcd.19.17. 41). // Initialize touchscreen // ---------------------- // Set the pins to the correct ones for your development board // ----------------------------------------------------------- // Standard Arduino Mega/Due shield : 6. 3. Si la queremos usar en horizontal le pasaremos el parámetro lo dejamos vacío o le pasamos “LANDSCAPE”. https://www. 4. 2 URTouch tactil( 6. lcd.youtube.InitLCD(). } delay(50). lcd. CENTER.printNumI(tactil. Eso sí. lcd. Deberíais ver algo como esto: PROBAR ALGÚN EJEMPLO Una vez hemos entendido cómo funciona.net/curso-kit-inicio/ http://www. No utilicéis el dedo.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Ahora sólo queda probarlo. leeremos los valores y los mostraremos en la pantalla.net/indice-tutoriales 184 } Y en el loop comprobaremos si se ha detectado alguna pulsación y.clrScr(). si la ha habido. } Podéis descargar el programa completo aquí: Mostrar_coordenadas.getX().getY().http://www.read().dataAvailable()) { tactil. vamos a abrir algún ejemplo para comprobar que todo funcione correctamente. Como https://www. 150). 100). usad alguna cosa que tengáis que tenga la punta fina. a poder ser un stylus o algo parecido para tener más precisión.prometec.printNumI(tactil. lcd.prometec. void loop() { while (tactil. CENTER.youtube. no caigáis en la tentación de utilizar el ejemplo que viene para calibrar la pantalla. que dedicaremos más sesiones a esta pantalla. os dará tres valores. URTouch_ButtonTest y URTouch_QuickPaint. o Probamos un par de ejemplos y comprobamos que funciona todo correctamente.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec. el tercero que proporciona a la librería el tamaño de la pantalla sí funcionará. Lo que es muy importante es que recordéis cambiar el driver al ILI9481 y los pines para el Mega si fuera necesario. o Hemos creado un pequeño programa para detectar y leer pulsaciones en la pantalla.youtube. y si utilizáis los valores que os da para modificar la librería. dejará de funcionar correctamente. • Los dos primeros son los que hacen que deje de funcionar. El segundo nos permite dibujar en la pantalla seleccionando diferentes colores. https://www. Esta preparado para pantallas más pequeñas.prometec. El primero de ellos tiene una serie de botones con números con el que podréis comprobar que realmente detecta correctamente la pulsación. y lo mismo para los pines del táctil. pero en nuestra librería está ya modificado para el tamaño de esta pantalla. o Modificamos y aprendimos a usar la librería URTocuh. http://www. • Si decidís no hacernos caso y caéis en la tentación. RESUMEN DE LA SESIÓN En esta sesión hemos aprendido varias cosas importantes: • o Hemos aprendido a utilizar una pantalla táctil con nuestro Arduino.net/indice-tutoriales 185 dijo el almirante Ackbar durante la batalla de Endor: “¡Es una trampa!”. Ahora ya estamos en disposición de crear nuestra propia interfaz con la que podamos interactuar de forma táctil. y si seguís sus instrucciones os va a dejar de funcionar. aunque si no lo tenéis del todo claro tranquilos. Por lo demás hay dos ejemplos interesantes.net/curso-kit-inicio/ http://www. Para transformar los archivos de imagen en arrays existen muchas aplicaciones.youtube.c file”. https://www. y en cada uno de ellos contiene el color del que debe pintar ese píxel la pantalla para componer la imagen. CONVERTIR LOS ARCHIVOS DE IMAGEN EN ARRAYS Para poder mostrar imágenes o fotos en la pantalla. http://www. así que ese será el tamaño máximo que podremos mostrar. yo he utilizado un conversor online que he ncontrado en la misma página que desarrolla las librerías que hemos modificado para esta pantalla. MATERIAL REQUERIDO Un Arduino Mega.txt en el que además del array os vendrá especificado el tamaño de la imagen y el tamaño que ocupará en memoria.prometec. o Mostrar las imágenes en la pantalla.net/indice-tutoriales 186 -CARGAR Y MOSTRAR IMÁGENES Convertir imágenes en arrays Home MOSTRAR IMÁGENES OBJETIVOS . Recordad que nuestra pantalla es de 480×320. primero vamos a tener que transformarlas en arrays que pueda entender nuestro Arduino. Cuando lo hagáis os descargaréis un archivo . Un shield TFT LCD 3. Ya hablaremos luego de eso. no tenéis más que seleccionar el archivo que queráis convertir y darle a “Make file”.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www. o Cargarlos en la memoria flash de Arduino. • o Convertir archivos de imagen en arrays. Como veis es muy sencillo de usar. Aquí tenéis el enlace: Conversor de imágenes.prometec.mientras esté seleccionado “Convert to: .5″ táctil. básicamente. aunque también tenemos limitaciones debidas a la memoria del Arduino. tienen una variable por cada píxel que tenga la imágen. Estos arrays. com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . Si os fijáis. el archivo que hemos descargado ya viene preparado para cargar el array en la memoria flash. la librería UTFT que se descarga de esa misma página no carga las imágenes de la memoria flash. Eso sí. así que prácticamente nos lo da todo hecho.h.prometec. que en el caso del Arduino Mega. así que recordad que tenéis que descargar la librería modificada que hemos comentado en las anteriores sesiones: UTFT. Por si no lo habéis hecho nunca. Os pedirá un nombre. Una vez creado copiamos el contenido del archivo . tiene una capacidad de 8kb.prometec. no hay más que pulsar en la flechita que hay arriba a la derecha y seleccionar nueva pestaña. Además tenemos en los comentarios algunos datos que necesitaremos a la hora de cargar la imagen. pero os recomiendo que sea el mismo que el archivo txt pero terminado en . que ni siquiera nos vale para guardar la pequeña imagen que hemos convertido. Por eso vamos a utilizar la memoria flash. Por aquello del orden y la limpieza. que si os fijáis es de 200×47 píxeles y ya ocupa casi 19kb.youtube. para incluir el array en nuestro programa vamos a crear una pestaña a parte del programa principal.net/indice-tutoriales 187 CARGAR LOS ARRAYS EN LA MEMORIA FLASH Como ya hemos comentado alguna vez.http://www. que en el caso del Mega es de 256kb. nosotros usamos normalmente la memoria SRAM de Arduino. por alguna razón. O sea.txt en él. https://www. podéis darle el que queráis. De esta manera ya incluimos la librería y declaramos el array para guardarlo en la memoria flash.net/curso-kit-inicio/ http://www. 40.h" #include "logo.net/curso-kit-inicio/ http://www.prometec.clrScr(). https://www. Además.h" #include "arduino.38.39.http://www. en el setup. inicializamos la pantalla y la limpiamos. #include "UTFT.41). lcd.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 188 PROGRAMA PARA MOSTRAR LAS IMAGENES Una vez hemos incluido todas las imágenes que vamos a querer utilizar en el programa.prometec. por si acaso.InitLCD(). void setup() { lcd.youtube.h" UTFT lcd(ILI9481. vamos a la pestaña en la que construiremos el programa principal. Lo primero que haremos será incluir las librerías que vamos a utilizar y declarar la instancia UTFT de la pantalla. drawBitmap(0.58. void loop() { lcd.http://www. por ejemplo. lcd. 2).75. ocupa 200×47 . lcd. lcd. Por ejemplo. lcd.prometec. arduino).58. Esta función nos permite además escalar la imagen pasándole un parámetro adicional.0. lcd.47.47. vamos a utilizar la función bitmap().com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .fillScr(VGA_WHITE). delay (5000).net/indice-tutoriales 189 } Para mostrar las imágenes que hemos convertido en arrays.200. arduino).prometec. arduino. Como ocupa 75×78.drawBitmap(0. en el centro de la pantalla más o menos.131. nuestro array “logo”.75. aunque evidentemente perderemos calidad en la imagen.youtube. Por ejemplo podemos hacer que se vean el doble de grandes. el tamaño en píxeles X e Y y el nombre del array.200. o sea la que coincidirá con la esquina izquierda de la imagen. Además hacemos que muestre otra imagen con el logo Arduino. Y vamos a querer que empiece a dibujarlo en la esquina izquierda de la pantalla.131.fillScr(VGA_WHITE).drawBitmap(0.102. que hemos convertido previamente.0.net/curso-kit-inicio/ http://www. Podéis verlo en el archivo que hemos descargado.58. o sea en las coordenadas 0.0. en los comentarios del principio.0.131.75. se lo indicamos también en el programa con la función fillScr(). logo). 2). Como parámetros le pasaremos la posición X e Y donde queramos que empiece a mostrarla.drawBitmap(203. que es el logo de Prometec. lcd. logo). Así.drawBitmap(165. delay (5000).47. unos cálculos aproximados nos dirán que tiene que empezar en las coordenadas 203.drawBitmap(203.200. } https://www. lcd. Como queremos mostrarla sobre fondo blanco. logo. hacemos un programa que muestre las imágenes en su tamaño original durante 5 segundos y después lo haga al doble de su tamaño durante otros 5. prometec. o SAbemos utilizar la fuinción bitmap() para visualizar las imágenes en la pantalla. y un pequeño vídeo con el resultado.net/indice-tutoriales 190 Aquí os dejamos un enlace al programa Cargar_Imagen. RESUMEN DE LA SESIÓN En esta sesión hemos aprendido varias cosas importantes: • o Hemos utilizado una aplicación que convierte archivos en formato imagen a arrays.youtube. http://www. o Hemos guardado los arrays en la memoria flash del Arduino. https://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/curso-kit-inicio/ http://www.prometec. net/curso-kit-inicio/ http://www. Si habéis seguido las sesiones anteriores.net/indice-tutoriales 191 CONTROL DE ACCESO CON EL SHIELD TFT 3. MATERIAL REQUERIDO Un Arduino Mega. por si nos equivocamos. La manera de inicializar y hacer funcionar correctamente el display ya lo hemos visto varias veces. Pero de todas formas vamos a cambiarlo para adaptarlo al tamaño de nuestra pantalla y para que incluya las nuevas funcionalidades que queremos. Es decir. En caso de hacerlo cambiaremos de pantalla y mostraremos el mensaje “PUERTA ABIERTA”. y en caso contrario mostraremos la palabra“Incorrecto”y daremos una nueva oportunidad para introducir la clave correcta. INTRODUCCIÓN Nuestra intención con esta sesión es crear una interfaz en la pantalla que simule un control de acceso mediante clave.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .5″ PARA ARDUINO MEGA Interfaz táctil para control de acceso Home Control De Acceso Con El Shield TFT 3.prometec. Además incluiremos una tecla para borrar lo que haya escrito.5″ Para Arduino Mega OBJETIVOS .prometec. y que ya hemos probado. puede servirnos como base. dibujaremos en la pantalla los botones necesarios del 0 al 9 y esperaremos a que se introduzca la clave correcta. pero siempre podéis echar un ojo a las anteriores sesiones https://www. http://www.5″ táctil.youtube. Un shield TFT LCD 3. o Crear un control de acceso mediante clave. • o Dibujar nuestros propios botones en la pantalla.así que no haremos hincapié en ello. o Configurar la pantalla para que detecte las pulsaciones sobre ellos. ya os habréis dado cuenta de que uno de los ejemplos que viene con la librería. 255).setColor(0. 15. Como queremos adaptarla al tamaño de nuestra pantalla. 93). x < 5. 108. x++) { myGLCD.prometec. myGLCD. 255).setColor(0.clrScr(). // Draw the upper row of buttons for (x = 0. } // Draw the center row of buttons for (x = 0.prometec. myGLCD.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . el tamaño de los botones. 93 + (x * 93). myGLCD. 47 + (x * 93). https://www. Teniendo eso en cuenta. para lo que reciclaremos la función drawButtons() del ejemplo del que hablábamos. un poco más o menos. 93 + (x * 93).http://www. Como la pantalla mide 420 pixeles de ancho y queremos que las líneas que muestran los números muestren 5 cada uno. 15. vamos a calcular. x++) { myGLCD.net/indice-tutoriales 192 DIBUJAR LOS BOTONES La primera función con la que vamos a trabajar será la que dibuje el interfaz principal con los botones para introducir la clave. myGLCD. 255). 255.youtube. lo mismo de ancho.printNumI(x + 1.setColor(255. 0.setColor(255.drawRoundRect (15 + (x * 93). x < 5.net/curso-kit-inicio/ http://www. nos sale que. 255). con una separación entre botones de 15 píxeles. 255. la primera parte de la función quedaría así: void drawButtons() { myGLCD. 0.fillRoundRect (15 + (x * 93). 186). myGLCD. cada botón debería medir 78 píxeles de ancho. Y como queremos que sean cuadrados.fillRoundRect (15 + (x * 93). 93 + (x * 93). 47). 93). myGLCD. 0.printNumI(x + 6. 465.net/curso-kit-inicio/ http://www. 260). 255).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . 255. } myGLCD.drawRoundRect (15 + (x * 93). 155. 419.setColor(0.print("Enter". 0. 201. 0). 155.youtube. 255).fillRoundRect (15. 142).setBackColor (0. 222). 201. myGLCD.setColor(255. 255).setColor(0. 260). 186). myGLCD. 222). if (x < 4) myGLCD. myGLCD. // Draw the lower row of buttons myGLCD. 260). myGLCD.fillRoundRect (325.net/indice-tutoriales 193 myGLCD.setColor(255. myGLCD. myGLCD. 47 + (x * 93).print("Clear". 93 + (x * 93). 465.drawRoundRect (325. 45. } Ahora mismo deberíamos tener un interfaz como este: https://www. 255). myGLCD.prometec. 0. 142). myGLCD. 355. 201. 201. myGLCD. 260).drawRoundRect (15. 108.print("0".prometec. 255.http://www. myGLCD. char stCurrent[10] = "". int stauxLen = 0. void updateStr(int val) { if (stCurrentLen < 10) { https://www.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . tendremos que jugar con otra cadena auxiliar que trataremos de forma paralela.prometec. char staux[10] = "". char password[10] = "1234". Así que crearemos las variables necesarias y una función en la que las iremos actualizando y mostrando un ‘*’ por cada tecla pulsada: int x. int stCurrentLen = 0.prometec.net/curso-kit-inicio/ http://www.net/indice-tutoriales 194 DETECTAR Y TRATAR LAS PULSACIONES Ya hemos visto como podemos detectar las pulsaciones y saber en que área de la pantalla se han producido. pero en esta ocasión además de eso tenemos que guardar los valores de las teclas que mostramos en una cadena que luego compararemos con la contraseña que hayamos elegido.youtube.http://www. y. Y como además querremos mostrar un ‘*’ cada vez que se puse una tecla. 255. staux[stauxLen + 1] = '\0'.print(staux. 0. 275). int x2. y2).drawRoundRect (x1.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . https://www.prometec. myGLCD.setColor(0. myGLCD. de forma que nos aseguremos visualmente de la tecla que se haya pulsado: // Draw a red frame while a button is touched void waitForIt(int x1. stCurrentLen++. } } La última función que usaremos para estos propósitos servirá para recuadrar en rojo la tecla que se haya pulsado. x2.net/indice-tutoriales 195 stCurrent[stCurrentLen] = val.youtube.http://www. stauxLen++. 0). myGLCD. CENTER. int y1. int y2) { myGLCD.prometec. 0). y1. stCurrent[stCurrentLen + 1] = '\0'.net/curso-kit-inicio/ http://www. staux[stauxLen] = '*'.setColor(255. 15. myGLCD. 255). 15. x = myTouch. las de los números funcionarán todas iguales: if (myTouch. y1. que funcionarán un poco diferentes a las demás.youtube. 93. y2). x2. Vamos a dejar fuera de momento las teclas para borrar y confirmar la introducción de la contraseña.net/indice-tutoriales 196 while (myTouch. y = myTouch.prometec.setColor(255.http://www. updateStr('2').dataAvailable()) myTouch. myGLCD. 255.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . 186.getY().read().dataAvailable()) { myTouch. 93). por lo demás. updateStr('1').drawRoundRect (x1. } if ((x >= 108) && (x <= 186)) // Button: 2 { waitForIt(108. } En el loop será donde detectemos las pulsaciones y usemos las funciones que hemos creado para manejar las cadenas.prometec.read().getX(). } https://www. 93).net/curso-kit-inicio/ http://www. if ((y >= 15) && (y <= 93)) // Upper row { if ((x >= 15) && (x <= 93)) // Button: 1 { waitForIt(15. 93. 93). 372. updateStr('6'). } if ((x >= 294) && (x <= 372)) // Button: 4 { waitForIt(294. } https://www. } } if ((y >= 108) && (y <= 186)) // Center row { if ((x >= 15) && (x <= 93)) // Button: 6 { waitForIt(15. updateStr('4').prometec. } if ((x >= 387) && (x <= 465)) // Button: 5 { waitForIt(387. 15. updateStr('3'). 15. updateStr('5').http://www. 465. 279. 15. 93). 108.prometec. 93).net/curso-kit-inicio/ http://www. 186).com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .net/indice-tutoriales 197 if ((x >= 201) && (x <= 279)) // Button: 3 { waitForIt(201.youtube. 372. 465. 186). 186. } if ((x >= 201) && (x <= 279)) // Button: 8 { waitForIt(201. A parte de borrar el contenido de las dos cadenas con las https://www. } } BORRAR Y CONFIRMAR LA CONTRASEÑA Ahora vamos con las dos teclas que hemos dejado fuera antes.youtube. updateStr('0'). updateStr('9'). 186). 108. } if ((x >= 294) && (x <= 372)) // Button: 9 { waitForIt(294.net/curso-kit-inicio/ http://www. 279. 186). 108.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .prometec.net/indice-tutoriales 198 if ((x >= 108) && (x <= 186)) // Button: 7 { waitForIt(108.http://www.prometec. Primero la tecla “Clear” que nos servirá para borrar lo que hayamos introducido hasta el momento. updateStr('7'). 186). } if ((x >= 387) && (x <= 465)) // Button: 0 { waitForIt(387. updateStr('8'). 108. 108. password) == 0) { myGLCD. if ((y >= 201) && (y <= 260)) // Last row { if ((x >= 15) && (x <= 155)) // Button: Clear { waitForIt(15. Por el contrario. 0). vamos a utilizar un pequeño truco para borrar los ‘*’. staux[0] = '\0'.print(staux. 155.setColor(0. 255). myGLCD. stCurrent[0] = '\0'. 0. si es correcta.http://www.print("Correcto". así será como si borrásemos los que estaban. https://www.prometec.net/curso-kit-inicio/ http://www. if (strcmp(stCurrent. myGLCD.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . 260). CENTER. CENTER. que haya en la pantalla.youtube.setColor(0. 0. En cuanto a la tecla “Enter” con la que confirmamos la entrada de la contraseña. 0). compararemos el contenido de la cadena de números que hayamos introducido con la que hemos configurado como password. myGLCD. stauxLen = 0. } if ((x >= 325) && (x <= 465)) // Button: Enter { waitForIt(325.net/indice-tutoriales 199 que estamos trabajando. Simplemente haremos que pinte los mismos ‘*’ pero de color negro y sobre fondo negro. mostraremos “Correcto” y llamaremos a la función abierto() de la que hablaremos más adelante. 201. Además mostraremos “Incorrecto” y borraremos todo si está equivocada. 201. myGLCD. 300). stCurrent[0] = '\0'. 465.setBackColor(0.prometec. 260). 275). stCurrentLen = 0. 0. prometec. 275). delay (1000). 0).setColor(0. 0). stauxLen = 0. myGLCD. 0). stCurrent[0] = '\0'. myGLCD. 0. } } } https://www. myGLCD.http://www.net/curso-kit-inicio/ http://www. abierto().com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .youtube. stauxLen = 0. myGLCD.print("Incorrecto". CENTER. 255. 0 . staux[0] = '\0'. myGLCD.setColor(255.setBackColor(0.prometec. drawButtons(). 255). stCurrentLen = 0. staux[0] = '\0'. 300).setBackColor(0. 255). CENTER. CENTER.print(stCurrent. } else { myGLCD. 0. 300). 0. myGLCD. myGLCD.setColor(255.net/indice-tutoriales 200 stCurrentLen = 0.print("Incorrecto". myGLCD.setColor(VGA_GREEN). https://www.fillScr(VGA_WHITE).prometec. porque andar copiando y pegando puede ser un poco difícil en este caso.net/indice-tutoriales 201 En la función abierto(). } Os recomendamos descargar el programa completo Control_acceso para trabajar con él. borraremos la pantalla actual y mostraremos una en la que diga “PUERTA ABIERTA”. myGLCD.clrScr(). 160).prometec.net/curso-kit-inicio/ http://www. myGLCD. y os dejamos un vídeo con el resultado. CENTER.print("PUERTA ABIERTA".http://www. myGLCD. delay (5000). para después volver al inicio: void abierto() { myGLCD.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos .setBackColor(VGA_WHITE).youtube. youtube.com/channel/UC51LheGI2gCZbc2Ocrry49g/videos . o Hemos diseñado un sistema de control de acceso por contraseña mediante una pantalla táctil. o Guardamos los valores en una cadena que comparamos con la contraseña que hemos guardado. https://www. http://www.prometec.net/indice-tutoriales 202 RESUMEN DE LA SESIÓN En esta sesión hemos aprendido varias cosas importantes: • o Hemos dibujado nuestros propios botones adaptados al tamaño de nuestra pantalla.prometec.net/curso-kit-inicio/ http://www. o Hemos creado un proceso para detectar la tecla pulsada.