8.7 Interfaz con el usuario
8.7.3 Salida avanzada Interfaz gr ´afica
Se ha decidido desde un principio que este proyecto permita visualizar en una pantalla a color de manera r ´apida y eficaz el estado en el que se encuentra la planta.
Para este cometido ser ´a necesario dise ˜nar tres m ´odulos:
Un controlador de pantalla.
Un m ´odulo de memoria y generaci ´on de gr ´aficos.
Un m ´odulo de interconexi ´on.
8.7.3.1. Protocolo utilizado y conector
Este m ´odulo permitir ´a controlar una pantalla que funcione mediante el protocolo VGA y representar im ´agenes generadas digitalmente.
Una pantalla est ´a formada por una matriz de p´ıxeles que se activan individualmente durante peque ˜nas fracciones de tiempo, refresc ´andose continuamente.
La placa de desarrollo Nexys 4 cuenta con un conector VGA, cuyas se ˜nales y control se definieron pensando en los monitores de tubo de rayos cat ´odicos, no obstante, los conectores VGA se encuentran en la pr ´actica totalidad de los monitores sin importar su tecnolog´ıa para evitar problemas de compatibilidad.
Un conector VGA es completamente anal ´ogico, por lo que la Nexys 4 dispone de un sencillo convertidor D/A de resistencias ponderadas cuyo esquema y pinout se hallan en la Figura
Figura 8.7.3.1 –Esquema del convertidor D/A del conector VGA y supinout.
El convertidor de la Figura8.7.3.1tiene 12 bits, lo que quiere decir que permite representar 4096 colores.
8.7.3.2. El controlador de pantalla VGA
Para controlar el monitor, la informaci ´on de cada p´ıxel (rojo, verde y azul) se va enviando fila a fila, empezando por el p´ıxel (0,0), de izquierda a derecha, y de arriba a abajo.
Para una resoluci ´on y una frecuencia de refresco dada hay que calcular los tiempos de cada p´ıxel, cada l´ınea horizontal y el tiempo de retrazado en vertical. Para ello se generan las se ˜nales de sincronismo:
Hs:Sincronismo horizontal, marca el final de una fila y el comienzo de una nueva.
Figura 8.7.3.2 –Pulsos de sincronismo vertical y horizontal.
Se va a utilizar una resoluci ´on de 640x480, con una frecuencia de refresco de 60 Hz por ser compatible con la totalidad de monitores VGA del mercado. Se presentan los tiempos para generar los pulsos y las cuentas necesarias para un reloj de p´ıxel de 25 MHz en la Figura
8.7.3.3
Para generar el m ´odulo que implemente la interfaz VGA se ha creado el c ´odigo que se encuentra en el Anexo11.9.1
Desde un enfoque bastante simplista, esta interfaz se basa b ´asicamente en 2 contadores: un contadorcuentahque se encarga de hacer las cuentas de la columnaClocksdeHorizontal Sync de la Figura8.7.3.3; ycuentavque cuenta en qu ´e l´ınea del monitor se est ´a haciendo el barrido (campoLinesdeVertical Syncen la misma Figura).
Es necesario definir las se ˜nalespixelvisibleylineavisiblepara indicar al controlador que se encuentra dentro del intervalo visualizable de la pantalla, es decir, cuentah entre 0 y 639, ycuentaventre 0 y 479.
Dentro de este m ´odulo de interfaz y antes de pasar al m ´odulo de gr ´aficos hay que definir una serie de se ˜nales que activar ´an la visualizaci ´on de los diferentes gr ´aficos en su posici ´on correcta. Se han decidido mostrar los siguientes elementos:
Figura 8.7.3.3 –Tiempos necesarios para generar los pulsos de sincronismo de la interfaz VGA.
Rejilla: Consistir ´a en una rejilla que permitir ´a estimar de manera r ´apida el valor de la
variable de proceso.
Barra de variable de proceso: Consistir ´a en una barra vertical cuya longitud variar ´a
entre 0 y 200 p´ıxeles dependiendo del valor de la variable de proceso.
Valor de la variable de proceso: Indicar ´a num ´ericamente el valor de la variable de
proceso.
Cartel de la variable de proceso: Indicar ´a que el valor mostrado corresponde con la
variable de proceso.
Indicador de consigna seleccionada:Ser ´a una flecha donde la altura de su pico variar ´a
entre 0 y 200 p´ıxeles dependiendo del valor de la consigna seleccionada.
Valor de la consigna:Indicar ´a num ´ericamente el valor de la consigna seleccionada.
Cartel de la consigna:Indicar ´a que el valor mostrado corresponde con la consigna.
La posici ´on en la que se activa cada uno de estos gr ´aficos se define con un sistema de “cajas” tal y como se pretende mostrar en la Figura8.7.3.4.
Figura 8.7.3.4 –Cada gr ´afico a visualizar se inscribe dentro de una caja.
As´ı, en funci ´on de lo mostrado en la Figura 8.7.3.4, si las cuentascuentah y cuentavde la interfaz se encuentran dentro del intervalo definido por las coordenadas de las esquinas superior izquierda o inferior derecha de la caja negra correspondiente al gr ´afico que se quiere mostrar en esa posici ´on, se activa su se ˜nal de habilitaci ´on.
Se definen las siguientes se ˜nales de habilitaci ´on:
Se ˜nal Visualiza Lim. inf. Lim. sup.
vonbarra Barra Fija V. de proceso
vonrejilla Rejilla Fija Fija
vonflecha Flecha Consigna-7 Consigna+7
vonsetpoint Valor de la consigna Fija Fija
vonprocessvalue Valor de la v. de proceso Fija Fija
vonspriteconsigna Cartel de la consigna Fija Fija
vonspriteprocessvalue Cartel de la v. de proceso Fija Fija
Tabla 8.7.3.1 –Se ˜nales de habilitaci ´on de los gr ´aficos a mostrar
8.7.3.3. M ´odulo de generaci ´on de gr ´aficos
Se va a describir ahora el m ´odulo que se encargar ´a de generar los gr ´aficos. Estos gr ´aficos estar ´an basados en patrones almacenados en memoria llamadossprites.
Lossprites que se han creado para la representaci ´on gr ´afica son archivos binarios donde se dibuja el patr ´on a representar como una matriz rectangular de ceros y unos, representando
los unos los p´ıxeles encendidos dentro de la “caja” y los ceros, los apagados. As´ı, se han creado los siguientessprites:
Sprites de los caracteres:Se han dise ˜nado los patrones de los caracteres num ´ericos del 0 al 9 y el punto decimal como matrices de 8x8 p´ıxeles. Los caracteres se generan mediante una memoria ROM de bloque basada en el fichero de texto contenido en el Anexo11.9.2.1. Considerando que son 11 caracteres, se crea una matriz de 88 filas y 8 columnas cuyo contenido se resume en la Tabla8.7.3.2.
Posici ´on de memoria Contenido
0-7 Filas del 0 8-15 Filas del 1 16-23 Filas del 2 24-31 Filas del 3 32-39 Filas del 4 40-47 Filas del 5 48-55 Filas del 6 56-63 Filas del 7 64-71 Filas del 8 72-79 Filas del 9 80-87 Filas del punto
Tabla 8.7.3.2 –Contenido de la tabla de caracteres por posiciones de memoria.
Para mostrar tanto el valor num ´erico de la consigna como el de la variable de proceso, se aprovechar ´an las conversiones a BCD descritas en el Apartado8.7.2.3aplic ´andoles la siguiente transformaci ´on:
1. Se toma toda la conversi ´on en BCD.
2. Se separan los tres d´ıgitos de la parte entera de los 4 d´ıgitos de la parte fraccionaria. 3. Se introduce el valor hexadecimal 0xA entre la parte entera y la parte fraccionaria
para representar el punto decimal.
4. Se concatenan de nuevo las tres partes, quedando un n ´umero con el formato 0xXX- XAYYYY. Donde XXX corresponde al valor de 3 d´ıgitos de la parte entera, A al punto decimal, y YYYY al valor de 4 d´ıgitos de la parte fraccionaria.
Figura 8.7.3.5 –Estructura seguida por los contadorescuentacaracter,cuentahycuentav.
A la vista de la Tabla8.7.3.2y de la figura 8.7.3.5, y tomando el formato 0xXXXAYYYY, se puede acceder a la primera fila de cada uno de losspritesde los d´ıgitos multiplicando cada d´ıgito en BCD por 8, por lo que para usar esta memoria para mostrar los valores en pantalla ser ´a necesario direccionarla seg ´un la f ´ormula:
f ila= 8∗valor+cuentav (8.7.3.1)
Por otro lado, una vez que se obtiene en la salida de la memoria la fila correspondiente, hay que seleccionar el p´ıxel que corresponde seg ´un el valor decuentah
Siendo necesario seguir los siguientes pasos:
1. Saber si se est ´a en la posici ´on correcta de la pantalla con las se ˜nales de la Tabla
8.7.3.1vonsetpointovonprocessvalue.
2. En caso de estar en la posici ´on correcta ser ´a necesario ir accediendo d´ıgito a d´ıgito al valor a mostrar, por lo que se har ´a una cuenta del d´ıgito en el que se est ´a. En este caso, dado el formato 0xXXXAYYYY, se har ´a unacuentacaracterde 0 a 7.
3. Una vez que se sabe en en qu ´e caracter se est ´a, y dado que las posiciones de memoria contienen filas completas, es necesario saber qu ´e posici ´on de la fila se debe mostrar. Para ello se creacuentah, que dado que losspritesde los caracteres son de 8 columnas, contar ´a de 0 a 7.
4. Cuando se ha llegado a la ´ultima columna del ´ultimo caracter del n ´umero a mostrar, es necesario pasar a la siguiente fila, para lo que se utiliza una se ˜nal denominada
cuentav.
Los pasos seguidos para mostrar correctamente los caracteres se plasman con mayor claridad en el diagrama de flujo de la Figura8.7.3.6.
Espera ¿Se está en posición? Comenzar cuentah y cuentacaracter ¿cuentav=7? Contar columna Contar caracter ¿cuencaracter =7? Resetear cuentacaracter y cuentah ¿Era el V. Proceso o la consigna? Contar cuentav ¿cuentav=7? Resetear cuentav NO SÍ NO SÍ NO SÍ V. Proceso Consigna NO SÍ
Figura 8.7.3.6 –Diagrama de flujo seguido para mostrar correctamente los caracteres.
Para el resto despritesel procedimiento es similar, siendo necesarias tan solo una cuenta de filas y otra cuenta de columnas al no haber m ´ultiples caracteres.
Sprite de la flecha: Se crea un patr ´on en forma de flecha como una matriz de 15x15 p´ıxeles. Como va a estar en movimiento, cada vez que la posici ´on vertical var´ıe, se re- iniciar ´an los contadores para que no se produzcan errores de dibujado. El c ´odigo que genera la memoria ROM se encuentra en el Anexo11.9.2.2.
Spritede la rejilla:Este sprite crear ´a una matriz de 220 filas y 80 columnas que formar ´a la rejilla que permitir ´a la estimaci ´on visual r ´apida del valor de la variable de proceso. Se genera con el fichero contenido en el Anexo11.9.2.3.
Sprites de los carteles de Consigna y Variable de Proceso: Se crean dos matrices 11x51 que contendr ´an los indicadores de cu ´al n ´umero es la Consigna o la Variable de Proceso, se generan con los ficheros de texto de los Anexos11.9.2.4y11.9.2.5.
Las memorias se han generado con elBlock ROM Generator de Xilinx. El c ´odigo que sirve para generar este m ´odulo se encuentra en el Anexo11.9.2.
8.7.3.4. M ´odulo de interconexi ´on
Se ha creado un m ´odulo que interconectar ´a la interfaz para el protocolo VGA descrito en el Apartado 8.7.3.2 as´ı como el m ´odulo de generaci ´on de gr ´aficos del Apartado8.7.3.3. Las entradas y salidas del m ´odulo se muestran en la Figura 8.7.3.7 y se describen en la tabla
8.7.3.3.
Se ˜nal Modo Funci ´on
consigna Entrada Define la altura de la flecha.
consignabcd Entrada Valor num ´erico de la consigna.
processvalue Entrada Define la altura de la barra
processvaluebcd Entrada Valor num ´erico de la V. de Proceso.
vgaBlue Salida Valor de azul para VGA.
vgaGreen Salida Valor de verde para VGA.
vgaRed Salida Valor de rojo para VGA.
HS Salida Se ˜nal de sincronismo horizontal.
VS Salida Se ˜nal de sincronismo vertical.
Tabla 8.7.3.3 –Entradas y salidas de la controladora VGA.
Como comentario a la Tabla 8.7.3.3 cabe destacar que consigna es el valor de 12 bits generado por el bloqueContadorConstantes del m ´odulo de entrada de datos descrito en el Apartado8.7.1; y queprocessvaluees el valor de 12 bits generado por el convertidor A/D.
Como tanto la barra que representar ´a el valor de la variable de proceso como la flecha que representar ´a la consigna variar ´an su altura en 200 unidades, en este m ´odulo se har ´a sobre
consignayprocessvaluela siguiente operaci ´on para escalarlos:
escalado= valor∗200
212 (8.7.3.2)
Generando las se ˜nalesconsigna0200yprocessvalue0200, que contendr ´an los valores de
consignayprocessvalueentre 0 y 4095 multiplicados por 200.
La divisi ´on entre212se lleva a cabo despreciando los 12 bits de la derecha de las se ˜nales
consigna0200y processvalue0200 tal y como se define en el c ´odigo contenido en el Anexo
11.9.3.
Tambi ´en como caracter´ıstica destacada se define una se ˜nal llamadar v acomo un vector de 3 enteros (valor de rojo, de verde y de azul) que servir ´a para decidir el color a mostrar en pantalla seg ´un la Tabla8.7.3.4.
Valoresr v a Elemento Color Condici ´on
(15,0,0) Barra Rojo V.de proceso alejada de Consigna. (14,10,0) Barra Ambar´ V.de proceso aproxim ´andose a Consigna.
(0,14,3) Barra Verde V.de proceso en torno a Consigna.
(0,10,14) Flecha Azul Mostrando la flecha.
(15,15,15) Letras o Rejilla Blanco Resto de elementos. (0,0,0) Fondo Negro No se muestra ning ´un elemento.
Tabla 8.7.3.4 –Colores (rojo, verde, azul) a mostrar en la pantalla VGA.
Con todos los m ´odulos anteriormente descritos se genera la interfaz gr ´afica de la manera mostrada en la Figura8.7.3.8.
Figura 8.7.3.8 –Interfaz gr ´afica mostrada a trav ´es del puerto VGA.
Se puede observar en la Figura8.7.3.8la disposici ´on que toman en pantalla los elementos generados en el m ´odulo. Salvo la barra, cuyo tama ˜no y color son variables, el resto de elemen- tos se han generado con las memorias que contienen los patrones antes mencionados.
Figura 8.7.3.9 –Cuando la variable de proceso se encuentra pr ´oxima a la consigna, la barra cambia a color amarillo.
Figura 8.7.3.10 –Cuando la variable de proceso se encuentra en el entorno de la consigna, la barra cambia a color verde.
Si se comparan las figuras 8.7.3.8, 8.7.3.9 y 8.7.3.10 se puede observar c ´omo ocurre el cambio de color de la barra que representa la variable de proceso, as´ı como el cambio en los valores de la variable de proceso y de la consigna, con la correspondiente variaci ´on de altura
de la flecha que representa a la consigna y de la barra que representa a la variable de proceso.