UNIVERSIDAD NACIONAL MAYOR DE SAN

MARCOS

Universidad del Per, Decana de Amrica

FACULTAD DE INGENIERIA ELECTRICA Y

ELECTRONICA

DISEO DIGITAL

TRABAJO : PROYECTO FINAL

LABORATORIO

PROFESOR : VILLAFUERTE

ALUMNOS : BOZA MONAGO,EDWARD PAUL 10190057

HUALLANCA REMON, ROBINSON 10190070
ROJAS BAUTISTA JOSE ANTONIO 10190222

HORARIO : MARTES 5-7pm

MIERCOLES 7-10pm
 Proyecto: Interfaz grfica en monitor VGA
Objetivos.

Mostrar una interfaz grfica usando un monitor VGA con resolucin de 1366x768.
Manipular la interfaz grfica a travs de un circuito lgico.

Marco Terico.

Conceptos.

1. Monitor VGA(Video Graphics Array)

Sistema grfico de pantalla para pc comercializado por primera vez en 1988 por
IBM (International Business Machines).

Como muchos sabrn, en un ordenador encontramos dispositivos que son

considerados como Perifricos, y que se clasifican en forma general como
Perifricos de Entrada, teniendo la funcionalidad de ingresar datos al ordenador
mediante impulsos elctricos, y otros que son Perifricos de Salida que muestran
esos datos ya ordenados y transformados en Informacin, para que puedan ser
percibidos por nuestros sentidos, teniendo como ejemplos ms comunes a la
Impresora y el Monitor.

En el caso de los Monitores y Pantallas, una de las tecnologas ms utilizadas en el

mundo de los ordenadores es la de los Monitores VGA (siglas en ingls de Video
Graphics Array) de aplicacin universal en todos los ordenadores e incluyndose
inclusive en el mundo de los Dispositivos Porttiles.
Originalmente fue utilizado por la compaa IBM, presentando monitores que
contaban con una resolucin nativa de 640 x 480 pxeles, siendo un estndar de
grficos que se empleabla en su lnea de ordenadores IBM PC, y pasando a ser la
funcionalidad mnima que debe tener el Hardware Grfico del ordenador, inclusive
previo al inicio del sistema operativo.

Esto es visible en el caso de los sistemas operativos de Microsoft por ejemplo

cuando estamos dando inicio al Microsoft Windows, siendo la pantalla de carga
presentada en una resolucin de 640 x 480 pxeles, sin demasiada profundidad de
color y bastante simple, para luego adaptarse a la configuracin de pantalla que ha
elegido el usuario mediante el sistema operativo.

Este estndar de grficos pretendi ser reemplazado en su momento con la

instauracin del Estndar XGA (siglas en ingls de Extended Grphics Array,
reemplazndose la E por la X para no confundir con EGA, Enhanced Graphics
Adapter) aunque en la actualidad contamos con distintas extensiones que
presentan variaciones, que son conocidas bajo el nombre de Super VGA, que cubre
un amplio espectro de estndares.

El conector que utiliza el Estndar VGA cuenta con una conexin de tres hileras de
15 pines, teniendo las variantes de DDC2, DE-9 y una tecnologa de ltima
generacin conocida como Mini-VGA que es utilizada en Dispositivos Porttiles,
siendo en todo caso adoptado universalmente por las Tarjetas Grficas tanto como
las conexiones de los Monitores disponibles en el mercado.

Los cableados de los Conectores VGA cuentan con el transporte de datos

correspondiente a la modalidad Analgica RGBHV (siglas de Rojo, Verde, Azul,
Horizontal y Vertical, siendo estos ltimos destinados a la sincronizacin de la
imagen) adems de seales de video de tipo DDC2 junto a los canales de Datos y
Reloj Digital
2. Pixeles.

El concepto de pxel tiene su origen en el vocablo ingls pixel y surgi como

acrnimo entre los trminos pix (expresin coloquial que refiere
a picture, imagen) y element (traducido al espaol como elemento). La nocin
se utiliza en el mbito informtico para indicar la superficie homognea ms
diminuta que forma parte de una imagen.

El pxel, por lo tanto, puede definirse como la ms pequea de las unidades

homogneas en color que componen una imagen de tipo digital. Al ampliar una de
estas imgenes a travs de un zoom, es posible observar los pxeles que permiten
la creacin de la imagen. Ante la vista se presentan como pequeos cuadrados o
rectngulos en blanco, negro o matices de gris.

Los mapas de bits incluyen pxeles que son codificados por medio de un grupo de
bits de longitud determinada. La codificacin del pxel determinar el nmero de
variaciones de color que puede exhibir la imagen.

Se conoce como imgenes de color verdadero a aquellas que se valen de tres

bytes para establecer un color y que, en total, brindan 16.777.216 opciones de
color.

La transformacin de los datos numricos que almacena un pxel en un color exige

el conocimiento de la profundidad y el brillo, pero tambin del modelo de color a
utilizar. El modelo ms habitual es RGB (Red-Green-Blue), que crea los colores a
partir de la combinacin del rojo, el verde y el azul. Los monitores y los escneres
de las computadoras suelen utilizar el modelo RGB.
 Adems de todo lo expuesto no podemos pasar por alto el hecho de que el trmino
que estamos analizando tambin forma parte de una expresin muy concreta
llamada pxel muerto. Con ella lo que se viene es a describir o definir a todo aquel
pxel que no funciona como debera en lo que es, por ejemplo, una pantalla de tipo
LCD.

De la misma forma hay que dejar patente que tambin existe el llamado pxel
atascado que es aquel que se caracteriza porque cuenta con lo que es un color de
tipo slido, ya sea rojo o azul o verde. Y todo ello sin olvidar tampoco el pxel
caliente que es aquel de color blanco que se encuentra siempre encendido.

Es importante subrayar el papel fundamental o especial que los pxeles estn

ejerciendo en el mundo de la animacin. Tanto es as que se ha producido la
creacin de un nuevo tipo de arte que se conoce por el nombre de Pixel Art. Lo que
viene a definir a esta disciplina es que consiste en la edicin de imgenes a partir
de ordenador, y ms concretamente haciendo uso de una serie de programas
informticos muy especficos.

Adems en este tipo de arte nos encontramos con dos elementos o pilares
fundamentales: el estilo isomtrico, que es aquel con el que se consiguen efectos
tridimensionales, y el estilo no isomtrico que es aquel que se define por ser todo
aquel que no se enmarca dentro de la categora anterior.

Cabe resaltar que un megapxel equivale a un milln de pxeles. Esta es la unidad

que se emplea para indicar la resolucin que posee una cmara digital para las
imgenes.

3. Paleta de colores

El sistema de color VGA es compatible con los adaptadores EGA y CGA, y aade
otro nivel de configuracin en la parte superior. CGA fue capaz de mostrar hasta 16
colores, y EGA ampli este permitiendo cada uno de los 16 colores que se elijan de
una paleta de colores de 64 (estos 64 colores se componen de dos bits para el rojo,
verde y azul: dos bits tres canales = seis bits = 64 valores diferentes). VGA
extiende todava ms las posibilidades de este sistema mediante el aumento de la
 paleta EGA de 64 entradas a 256 entradas. Dos bloques de ms de 64 colores con
tonos ms oscuros progresivamente se aadieron, a lo largo de 8 entradas "en
blanco" que se fijaron a negro. Adems de la ampliacin de la paleta, a cada una de
las 256 entradas se poda asignar un valor arbitrario de color a travs de la DAC
VGA. La BIOS EGA solamente permiti 2 bits por canal para representar a cada
entrada, mientras que VGA permita 6 bits para representar la intensidad de cada
uno de los tres primarios (rojo, azul y verde). Esto proporcion un total de 63
diferentes niveles de intensidad de rojo, verde y azul, resultando 262144 posibles
colores, cualquiera 256 podran ser asignado a la paleta (y, a su vez, de los 256,
cualquiera 16 de ellos podran ser mostradas en modos de vdeo CGA). Este
mtodo permiti nuevos colores que se utilizarn en los modos grficos EGA y
CGA, proporcionando un recordatorio de cmo los diferentes sistemas de paleta se
establecen juntos. Para definir el texto de color a rojo muy oscuro en el modo de
texto, por ejemplo, tendr que ser fijado a uno de los colores CGA (por ejemplo, el
color por defecto, n 7: gris claro.) Este color luego se mapea a uno la paleta EGA -
en el caso del color 7 de CGA, se mapea a la entrada 42 de EGA. El DAC VGA debe
ser configurado para cambiar de color 42 a rojo oscuro, y luego de inmediato
cualquier cosa que aparece en la pantalla a la luz de gris (color CGA 7) pasar a ser
de color rojo oscuro. Esta funcin se utiliza a menudo en juegos DOS de 256
colores. Mientras que los modos CGA y EGA compatibles permitan 16 colores para
ser mostrados de una vez, otros modos VGA, como el ampliamente utilizado modo
13h, permita que las 256 entradas de la paleta se mostraran en la pantalla al
mismo tiempo, y as en estos modos cualquier 256 colores podran ser vistos de los
262144 colores disponibles.

4. Resolucin de Pantalla

La resolucin de pantalla es el nmero de pxeles que puede ser mostrado en

la pantalla. Viene dada por el producto del ancho por el alto, medidos ambos en
pxeles, con lo que se obtiene una relacin, llamada relacin de aspecto. En esta
relacin de aspecto, se puede encontrar una variacin, est de acuerdo a la forma
 del monitor y de la tarjeta grfica. Se pueden diferenciar dos tamaos de pantalla
diferentes:

Tamao absoluto: la anchura y altura de la ventana del monitor, medido

generalmente en pulgadas. Depende del monitor.
Resolucin o tamao relativo: viene determinada por el nmero de pxeles que
se muestran en la ventana del monitor, siendo el pxel la unidad mnima de
informacin que se puede presentar en pantalla, de forma generalmente
rectangular. Depende de la tarjeta grfica.

5. Seales y temporizacin de la VGA.

Si visualizamos un punto en color en un monitor, no proporciona mucha

informacin para visualizar, sin embargo una lnea horizontal de pixeles
proporciona ms informacin, pero quiz todava no sea suficiente. Un frame
compuesto por multitud de lneas puede representar una imagen en una pantalla.
Un frame de VGA posee normalmente 480 lneas y cada una de ellas 680 pixeles,
para conseguir pintar un frame, los circuitos deflectores se encargan de desviar el
haz de electrones desde la izquierda a la derecha y de arriba abajo a travs de toda
la pantalla. Los circuitos de deflexin necesitan dos seales de sincronizacin para
conseguir controlar el inicio y la parada de dichos circuitos en el momento
adecuado, y de esta manera permitir que los pixeles se vayan dibujando en la
pantalla del monitor. En la Fig. 2 se observa el cronograma de las seales
que intervienen en la VGA.
El pulso negativo de la seal sincronismo horizontal (hsync), marca el inicio y el
final de una lnea y asegura que el monitor muestre los pixeles entre los bodes
izquierdo y derecho de la parte visible del monitor. Los pixeles reales se envan al
monitor en una ventana de 25,17s.
La seal de sincronismo horizontal (hsync) se pone a cero como mnimo 0,94s
despus del ltimo pixel y se mantiene a cero 3,77s. Una nueva lnea de pixeles se
puede iniciar 1,89s despus de que la seal (hsync) ha terminado, es decir, se ha
puesto a uno.
Como una lnea ocupa 25,17s de los 31,77s que dura la lnea de video, esto
significa que en los restantes 6,6s la pantalla est oscura, siendo este tiempo el
que se conoce como horizontal blanking interval.
El pulso negativo de la seal sincronismo vertical (vsync), marca el inicio y el final
de un frame y asegura que se visualice entre el borde superior e inferior y dentro
del marco visible del monitor, todas las lneas que lo componen. Las lneas se
envan al monitor en una ventana de 15,25ms.
 La seal de sincronismo vertical (vsync)se pone a cero como mnimo 0,45ms
despus de la ltima lnea y se mantiene a cero 64s. La primera lnea del siguiente
framese puede iniciar 1,02ms despus de que la seal vsync ha terminado, es decir,
se ha puesto a uno. Como un frame ocupa 15,25ms de los 16,784ms, esto hace que
durante 1,534ms la pantalla est oscura, siendo este tiempo el que se conoce
como vertical blanking interval.

Para realizar el control de una VGA, necesitamos generar, hsync, es decir el tiempo
necesario para generar todos los pixeles de una lnea horizontal entera y vsync, que
es el tiempo necesario para generar todas las lneas de una pantalla entera (frame).
Por lo tanto se debe tener en cuenta que los valores se debern calcular en funcin
de la pantalla (640x480) y la frecuencia (25MHz), lo que significa que 25 Mpixeles
se procesan en un segundo.

Sincronismo Horizontal
Un periodo de una lnea horizontal contiene 800 pixeles que se pueden dividir en
cuatro regiones:
Display: regin en la que se visualizan los pixeles, su longitud es de 640 pixeles.
Retrazado: cuando el pixel vuelve al borde izquierdo, de manera que la seal de
video est deshabilitada (96 pixeles)
Borde derecho: Final de la zona de visualizacin, la seal de video debe ser
deshabilitada(16 pixeles), se suele conocer como front porch
Borde izquierdo: Inicio de la regin de visualizacin, la seal de video debe estar
deshabilitada (48pixeles), se suele conocer como back porch.

De la figura hay que tener en cuenta que los bordes derecho e izquierdo
pueden variar para cada marca de monitor.
La seal hsync se puede obtener con un contador mdulo 800, empezar la
cuenta en el inicio de la regin de visualizacin, lo que nos va a permitir utilizar
el contador como coordenada x, de manera que as conseguiremos la salida
pixel_x .
La seal hsync se pone a cero entre los pixel 656 y 751. Igualmente se observa
en la que se utiliza la seal h_video_on para indicar que se est en la regin
visible (display)

Sincronismo Vertical
Durante el recorrido vertical se va pasando de una lnea a otra y de arriba abajo
toda la pantalla, esto se corresponde con el tiempo necesario para refrescar la
pantalla entera. Un periodo completo contiene 525 lneas, que se pueden
dividir en cuatro regiones:
 Display: Zona en la que las lneas horizontales se ven, suelen tener 480 lineas.
Retrazado: Zona en la cual el pixel debe regresar al inicio de la pantalla, la seal de
video debe ser deshabilitada (2 lineas)
Borde superior: Regin superior de la pantalla, conocida como back porch, la seal
de video debe estar deshabilitada y debe tener 33 lineas
Borde inferior: Regin inferior de la pantalla, conocida como front porch, la seal
de video debe estar deshabilitada y debe tener 10 lineas

6. Controlador de VGA
El esquema ms elementa de un controlador de VGA

El bloque llamado sync se encarga de generar los tiempos y seales de sincronizacin,

las seales hsync y vsync se conectan van al conector de salida VGA, las seales pixelx y
pixely indican la posicin relativa en la que se debe pintar el pixel actual, la seal video
on habilita la visualizacin.
 IMPLEMENTACION DEL CODIGO VHDL DEL PROYECTO

Programa principal:

VGA.vhdl
library ieee;
use ieee.std_logic_1164.all;
use ieee.numeric_std.all;

Entity VGA is

port(clock_50: in std_logic;
vga_hs,vga_vs: out std_logic;
vga_r,vga_g,vga_b: out std_logic_vector(3 downto 0);
key: in std_logic_vector(2 downto 0);
sw: in std_logic_vector(1 downto 0));

end VGA;

architecture main of VGA is

component SYNC is
port(clk: in std_logic;
hsync: out std_logic;
vsync: out std_logic;
r,g,b: out std_logic_vector(3 downto 0);
keys: in std_logic_vector(2 downto 0);
s: in std_logic_vector(1 downto 0));

end component SYNC;

begin

C1: SYNC port map (clock_50,vga_hs,vga_vs,vga_r,vga_g,vga_b,key,sw);

end main;

--Sync.vhdl

library ieee;
use ieee.std_logic_1164.all;
use ieee.numeric_std.all;
use work.my.all;

entity SYNC is
port(clk: in std_logic;
hsync,vsync: out std_logic;
r,g,b: out std_logic_vector(3 downto 0);
keys: in std_logic_vector(2 downto 0);
s: in std_logic_vector(1 downto 0));

end SYNC;

architecture MAIN of SYNC is

signal rgb: std_logic_vector(3 downto 0);
signal draw1,draw2: std_logic;
signal sq_x1,sq_y1:integer range 0 to 1366:=600;
signal sq_x2,sq_y2:integer range 0 to 1366:=500;
signal hpos: integer range 0 to 1366:= 0; --1366
signal vpos: integer range 0 to 768:=0; --768

begin
SQ(hpos,vpos,sq_x1,sq_y1,rgb,draw1);
SQ(hpos,vpos,sq_x2,sq_y2,rgb,draw2);

process(clk)
begin
if(clk' event and clk='1') then

if draw1='1' then
if s(0)='1' then
r<= (others=>'1');
g<= (others=>'0');
b<= (others=>'0');

else
r<= (others=>'1');
 g<= (others=>'1');
b<= (others=>'1');
end if;
end if;

if draw2='1' then
if s(1)='1' then
r<= (others=>'1');
g<= (others=>'0');
b<= (others=>'0');

else
r<= (others=>'1');
g<= (others=>'1');
b<= (others=>'1');
end if;
end if;

if draw1='0' and draw2='0' then

r<= (others=>'0');
g<= (others=>'0');
b<= (others=>'0');
end if;

if hpos<1366 then --hpos<1366

hpos<= hpos+1;
else
hpos<=0;
if vpos<768 then --vpos<768
vpos<=vpos+1;
else

if s(0)='1' then
if keys(2)= '0' and keys(1)='0' then
sq_y1<=sq_y1+5;
elsif keys(2)= '0' and keys(0)='0' then
sq_y1<=sq_y1-5;
elsif keys(0)= '0' then
sq_x1<=sq_x1+5;
elsif keys(1)= '0' then
sq_x1<=sq_x1-5;
end if;
end if;

if s(1)='1' then
 if keys(2)= '0' and keys(1)='0' then
sq_y2<=sq_y2+5;
elsif keys(2)= '0' and keys(0)='0' then
sq_y2<=sq_y2-5;
elsif keys(0)= '0' then
sq_x2<=sq_x2+5;
elsif keys(1)= '0' then
sq_x2<=sq_x2-5;
end if;
end if;

vpos<=0;
end if;
end if;

if hpos>48 and hpos<160 then --hpos>48 and hpos<160

hsync<= '0';
else
hsync<= '1';
end if;

if vpos>1 and vpos<4 then --vpos>1 and vpos<4

vsync<= '0';
else
vsync<= '1';
end if;

if ((hpos>0 and hpos<408) or (vpos>0 and vpos <42)) then --((hpos>0 and
hpos<408) or (vpos>0 and vpos <42))
r<= (others=>'0');
g<= (others=>'0');
b<= (others=>'0');
end if;
end if;

end process;
end MAIN;

--My.vhdl
library ieee;
use ieee.std_logic_1164.all;
use ieee.numeric_std.all;

package MY is
procedure SQ(signal Xcur,Ycur,Xpos,Ypos: in integer; signal RGB: out
std_logic_vector(3 downto 0); signal DRAW: out std_logic);
END MY;
package body My is
procedure SQ(signal Xcur,Ycur,Xpos,Ypos: in integer; signal RGB: out
std_logic_vector(3 downto 0); signal DRAW: out std_logic) is
begin

if Xcur>Xpos and Xcur<(Xpos+100) and Ycur>Ypos and Ycur<(Ypos+100) then

RGB<= "1111";
DRAW<='1';
else
DRAW<='0';
end if;
end SQ;
end MY;

DESARROLLO DEL CDIGO

Para el siguiente programa se requiere una pantallaTFT de 1280x1024. Tambin se
puede usar otras resoluciones cambiando los parmetros del archivo VGA.
La interfaz VGA consta de cinco seales: tres canales de color de 4 bits y dos seales
para la sincronizacin vertical y horizontal.

Cada lnea comienza con el estado "BAJA" en hsync. Cada marco con la seal de "bajo"
en la vsync.

Antes y despus de cada sincronizacin. Las seales RGB tambin deben ir bajo para
un nmero especfico de ciclos de reloj Estos perodos se denominan porche delantero
y trasero.Es muy importante, o de lo contrario su monitor no reconoce la seal de
vdeo.

Para desarrollar este proyecto usaremos una frecuencia de clk de 50MHZ

Eso es suficiente para que el principal "ENTIDAD". El controlador de vdeo principal se

escribir como componente separado.

La lnea horizontal se compone de 1280 pixles visibles, 48 pxeles para FP y 248 pxeles
para BP. 112 pxeles para impulso de sincronizacin.

Todos junto hace que la lnea horizontal por 1688 pxeles de largo. La lnea vertical
tiene 1024 pxeles visibles, FP: 1 pxel, BP: 38 pxeles, y 3 pxeles para sincronizacin.
Suma: 1066 pxeles.

La posicin actual en la pantalla se define por dos seales: HPOS de posicin

horizontal, y VPOS para la vertical.
Con cada ciclo de reloj aumentamos la PosH por I, y una vez que llega al final de una
lnea, restablecerlo a cero y aumentar la VPOS por I. toda la pantalla ser escaneada
lnea por lnea

Como se mencion anteriormente, la sincronizacin horizontal pasa a baja entre FP y

BP. Esto significa que si HPOS es mayor que 48 (final de la FP) y menos de 160 (48 +
112 FP sincronizacin). SINC-H se mantiene alta.

La misma idea est detrs de la sincronizacin vertical.

Entre 0 y 4 lneas de VSYNC pasa a BAJO, de lo contrario es ALTA.

Desde el principio de la FP hasta el final de la BP la seal RGB debe sostener el estado

BAJO.

Eso significa que mientras HPOS est entre 0 y 408 (48 FP + 112 + 248 de
sincronizacin BP), los tres canales de color estn sosteniendo el valor cero.

Lo mismo sucede si VPOS es de entre 0 y 42 (1 FP + 3 + sincronizacin 38 BP).

Para mostrar lo cuadrados nos limitaremos a dibujar una horizontal y una lnea vertical
que pasa por el centro de la pantalla.

Dibujaremos un cuadrado para lo cual declaramos un paquete separado abrimos

nueva VHD-archivo e incluyen bibliotecas.

El procedimiento es muy simple. que recibe la posicin actual en la pantalla (Xcur y

Ycur) y tambin un punto de referencia (Xpos, yPos) a partir del cual se debe dibujar un
cuadrado.

Para desarrollar el cuadrado, el Xcur est entre Xpos y Xpos + 100, y lo mismo es cierto
para Y, fijamos la salida RGB a blanco, y "dibujar" -signal a '1'.

Esto nos dar un cuadrado con una longitud de lado de 100 pixeles.

Incluimos el paquete en el componente SYNC.

Ahora necesitamos seales adicionales para la posicin de referencia (SQ_X1, SQ_Y1),

la seal RGB y el indicador "dibujar".

A continuacin, llamar al procedimiento, HPOS se asigna a Xcur, y VPOS a la Ycur.

Si el "Draw" seal es alta, se asignara a la salida VGA de la seal el color blanco.

El punto de referencia para nuestra plaza es el centro de la pantalla.

Ahora vamos desarrollar el cdigo vhdl de tal forma que las dos plazas controladas, se
puede cambiar entre ellos y moverlos por la pantalla, la plaza seleccionada debe ser de
color rojo.

Necesitamos que el punto de referencia adicional para la segunda plaza y el indicador

de "dibujar" separada para cada procedimiento.

Para el control de la plaza usamos tres teclas y dos interruptores en tablero de Altera
DE1.

En primer lugar tengo que aadir que el componente SYNC y luego a la entidad
principal.

Si se selecciona la primera casilla S (0) = '1' dan el color rojo, de lo contrario la dibujan
en blanco.

Ocurre lo mismo con la segunda plaza

Si no hay ningn dibujo est en marcha de nuevo la salida VGA a negro. es por eso que
es muy conveniente tener indicador separado "dibujar" para cada procedimiento, por
lo que puede detectar qu figura se est generando actualmente.

Finalmente vamos a actualizar la posicin cuadrado con cada nueva trama. Esto
significa que si VPOS se resetea a 0, tambin cambiamos la posicin cuadrada de
acuerdo con el estado de "claves".

RESULTADOS:

ASIGNACION DE PINES
 FOTOS DE LA IMPLEMENTACION: