前言
图像显示设备在日常生活中随处可见，例如家庭电视机、计算机显示屏幕等，这些设备之所以能够显示我们需要的数据图像信息，归功于视频传输接口。常见的视频传输接口有三种：VGA接口、DVI接口和HDMI接口，目前的显示设备都配有这三种视频传输接口。
三类视频接口的发展历程为VGA→DVI→HDMI。其中VGA接口出现最早，只能传输模拟图像信号； 随后出现的DVI接口又分为三类：DVI-A、DVI-D、DVI-I，分别可传输纯模拟图像信号、纯数字图像信号和兼容模拟、数字图像信号；最后的HDMI在传输数字图像信号的基础上又可以传输音频信号。
VGA，英文全称“Video Graphics Array”，译为视频图形阵列，是一种使用模拟信号进行视频传输的标准协议，由IBM公司于1987年推出，因其分辨率高、显示速度快、颜色丰富等优点，广泛应用于彩色显示器领域。由于VGA接口体积较大，与追求小巧便携的笔记本电脑背道而驰，在笔记本电脑领域，VGA接口已被逐渐淘汰，但对于体积较大的台式机，这种情况并未发生，虽然VGA标准在当前个人电脑市场中已经过时，但因其在显示标准中的重要性和良好的兼容性，VGA仍然是最多制造商所共同支持的一个标准，个人电脑在加载自己独特驱动程序之前，都必须支持VGA的标准。
VGA接口及引脚定义
在最初的应用中，VGA接口常用于计算机与VGA显示器之间的图像传输，在台式计算机、旧式笔记本电脑和VGA显示器上一般会有标准的VGA接口。
表格 28‑1 VGA引脚定义
| 引脚 | 定义 | 引脚 | 定义 |
| 1 | 红基色(RED) | 9 | 保留(各厂家定义不同) |
| 2 | 绿基色(GREEN) | 10 | 数字地(GND) |
| 3 | 蓝基色(BLUE) | 11 | 地址码0(ID BIT0) |
| 4 | 地址码2(ID BIT2) | 12 | 地址码1(ID BIT1) |
| 5 | 自测试(各厂家定义不同) | 13 | 行同步(HSYNC) |
| 6 | 红色地(RGND) | 14 | 场同步(VSYNC) |
| 7 | 绿色地(GGND) | 15 | 地址码3(ID BIT3) |
| 8 | 蓝色地(BGND) |
|
|
VGA使用工业界通用的RGB色彩模式作为色彩显示标准，这种色彩显示标准是根据三原色中红色、绿色、蓝色所占比例多少及三原色之间的相互叠加得到各式各样的颜色。引脚1红基色(RED)、引脚2绿基色(GREEN)、引脚3蓝基色(BLUE)就是VGA接口中负责传输三原色的传输通道。要注意的是，这3个引脚传输的是模拟信号。
VGA显示原理
VGA显示器显示图像，并不是直接让图像在显示器上显示出来，而是采用扫描的方式，将构成图像的像素点，在行同步信号和场同步信号的同步下，按照从上到下、由左到右的顺序扫描到显示屏上。
结合VGA显示器扫描方式示意图，我们简要说明一下VGA显示器的扫描规律。
- 在行、场同步信号的同步作用下，扫描坐标定位到左上角第一个像素点坐标；
- 自左上角(第一行)第一个像素点坐标，逐个像素点向右扫描(图中第一个水平方向箭头)；
- 扫描到第一行最后一个数据，一行图像扫描完成，进行图像消隐，扫描坐标自第一行行尾转移到第二行行首(图中第一条虚线)；
- 重复若干次扫描至最后一行行尾，一帧图像扫描完成，进行图像消隐，扫描坐标跳转回到左上角第一行行首(图中对角线箭头)，开始下一帧图像的扫描。
在扫描的过程中会对每一个像素点进行单独赋值，使每个像素点显示对应色彩信息，当一帧图像扫描结束后，开始下一帧图像的扫描，循环往复，当扫描速度足够快，加之人眼的视觉暂留特性，我们会看到一幅完整的图片，而不是一个个闪烁的像素点。这就是VGA显示的原理。
VGA时序标准
为了适应匹配不同厂家的VGA显示器，VGA视频传输接口有自己的一套VGA时序标准，只有遵循VGA的时序标准，才能正确的进行图像信息的显示。
VGA时序标准图
行同步时序图
图中Video代表传输的图像信息，HSync表示行同步信号。HSync自上升沿起到下一个上升沿止为一个完整周期，我们称之为行扫描周期。
一个完整的行扫描周期，包含6部分：Sync（同步）、Back Porch（后沿）、Left Border（左边框）、“Addressable” Video（有效图像）、Right Border（右边框）、Front Porch（前沿），这6部分的基本单位是pixel（像素），即一个像素时钟周期。
在一个完整的行扫描周期中，Video图像信息在HSync行同步信号的同步下完成一行图像的扫描显示，Video图像信息只有在“Addressable” Video（有效图像）阶段，图像信息有效，其他阶段图像信息无效。
HSync行同步信号在Sync（同步）阶段，维持高电平，其他阶段均保持低电平，在下一个行扫描周期的Sync（同步）阶段，HSync行扫描信号会再次拉高，其他阶段拉低，周而复始。
场同步时序图
理解了行同步时序，场同步时序就更容易理解了，两者相类似，如上图所示，图中Video代表传输的图像信息，VSync表示场同步信号，VSync自上升沿起到下一个上升沿止为一个完整周期，我们称之为场扫描周期。
一个完整的场扫描周期，也包含6部分：Sync（同步）、Back Porch（后沿）、Top Border（上边框）、“Addressable” Video（有效图像）、Bottom Border（底边框）、Front Porch（前沿），与行同步信号不同的是，这6部分的基本单位是line（行），即一个完整的行扫描周期。
综上所述，将行同步时序图与场同步时序图结合起来就构成了VGA时序图
图中的红色区域表示在一个完整的行扫描周期中，Video图像信息只在此区域有效，黄色区域表示在一个完整的场扫描周期中，Video图像信息只在此区域有效，两者相交的橙色区域，就是VGA图像的最终显示区域。
VGA显示模式及相关参数
行同步时序可分为6个阶段，对于这6个阶段的参数是有严格定义的，参数配置不正确，VGA不能正常显示。VGA显示器可支持多种分辨率，不同分辨率对应个阶段的参数是不同的，常用VGA分辨率时序参数如下
行扫描周期 * 场扫描周期 * 刷新频率 = 时钟频率
一个简单的VGA显示电路如下：
一个简单的彩条显示如下:
上代码
顶层：
module vga_colorbar
(input wire sys_clk , //输入工作时钟,频率50MHzinput wire sys_rst_n , //输入复位信号,低电平有效output wire hsync , //输出行同步信号output wire vsync , //输出场同步信号output wire [15:0] rgb //输出像素信息
);//********************************************************************//
//****************** Parameter and Internal Signal *******************//
//********************************************************************//
//wire define
wire vga_clk ; //VGA工作时钟,频率25MHz
wire locked ; //PLL locked信号
wire rst_n ; //VGA模块复位信号
wire [9:0] pix_x ; //VGA有效显示区域X轴坐标
wire [9:0] pix_y ; //VGA有效显示区域Y轴坐标
wire [15:0] pix_data; //VGA像素点色彩信息//rst_n:VGA模块复位信号
assign rst_n = (sys_rst_n & locked);//********************************************************************//
//*************************** Instantiation **************************//
//********************************************************************////------------- clk_gen_inst -------------
clk_gen clk_gen_inst
(.RESET (~sys_rst_n ), //输入复位信号,高电平有效,1bit.CLK_IN1 (sys_clk ), //输入50MHz晶振时钟,1bit.CLK_OUT1 (vga_clk ), //输出VGA工作时钟,频率25Mhz,1bit.LOCKED (locked ) //输出pll locked信号,1bit
);//------------- vga_ctrl_inst -------------
vga_ctrl vga_ctrl_inst
(.vga_clk (vga_clk ), //输入工作时钟,频率25MHz,1bit.sys_rst_n (rst_n ), //输入复位信号,低电平有效,1bit.pix_data (pix_data ), //输入像素点色彩信息,16bit.pix_x (pix_x ), //输出VGA有效显示区域像素点X轴坐标,10bit.pix_y (pix_y ), //输出VGA有效显示区域像素点Y轴坐标,10bit.hsync (hsync ), //输出行同步信号,1bit.vsync (vsync ), //输出场同步信号,1bit.rgb (rgb ) //输出像素点色彩信息,16bit
);//------------- vga_pic_inst -------------
vga_pic vga_pic_inst
(.vga_clk (vga_clk ), //输入工作时钟,频率25MHz,1bit.sys_rst_n (rst_n ), //输入复位信号,低电平有效,1bit.pix_x (pix_x ), //输入VGA有效显示区域像素点X轴坐标,10bit.pix_y (pix_y ), //输入VGA有效显示区域像素点Y轴坐标,10bit.pix_data (pix_data ) //输出像素点色彩信息,16bit);endmoduleVGA控制器：
module vga_ctrl
(input wire vga_clk , //输入工作时钟,频率25MHzinput wire sys_rst_n , //输入复位信号,低电平有效input wire [15:0] pix_data , //输入像素点色彩信息output wire [9:0] pix_x , //输出VGA有效显示区域像素点X轴坐标output wire [9:0] pix_y , //输出VGA有效显示区域像素点Y轴坐标output wire hsync , //输出行同步信号output wire vsync , //输出场同步信号output wire [15:0] rgb //输出像素点色彩信息
);//********************************************************************//
//****************** Parameter and Internal Signal *******************//
//********************************************************************//
//parameter define
parameter H_SYNC = 10'd96 , //行同步H_BACK = 10'd40 , //行时序后沿H_LEFT = 10'd8 , //行时序左边框H_VALID = 10'd640 , //行有效数据H_RIGHT = 10'd8 , //行时序右边框H_FRONT = 10'd8 , //行时序前沿H_TOTAL = 10'd800 ; //行扫描周期
parameter V_SYNC = 10'd2 , //场同步V_BACK = 10'd25 , //场时序后沿V_TOP = 10'd8 , //场时序上边框V_VALID = 10'd480 , //场有效数据V_BOTTOM = 10'd8 , //场时序下边框V_FRONT = 10'd2 , //场时序前沿V_TOTAL = 10'd525 ; //场扫描周期//wire define
wire rgb_valid ; //VGA有效显示区域
wire pix_data_req ; //像素点色彩信息请求信号//reg define
reg [9:0] cnt_h ; //行同步信号计数器
reg [9:0] cnt_v ; //场同步信号计数器//********************************************************************//
//***************************** Main Code ****************************//
//********************************************************************////cnt_h:行同步信号计数器
always@(posedge vga_clk or negedge sys_rst_n)if(sys_rst_n == 1'b0)cnt_h <= 10'd0 ;else if(cnt_h == H_TOTAL - 1'd1)cnt_h <= 10'd0 ;elsecnt_h <= cnt_h + 1'd1 ;//hsync:行同步信号
assign hsync = (cnt_h <= H_SYNC - 1'd1) ? 1'b1 : 1'b0 ;//cnt_v:场同步信号计数器
always@(posedge vga_clk or negedge sys_rst_n)if(sys_rst_n == 1'b0)cnt_v <= 10'd0 ;else if((cnt_v == V_TOTAL - 1'd1) && (cnt_h == H_TOTAL-1'd1))cnt_v <= 10'd0 ;else if(cnt_h == H_TOTAL - 1'd1)cnt_v <= cnt_v + 1'd1 ;elsecnt_v <= cnt_v ;//vsync:场同步信号
assign vsync = (cnt_v <= V_SYNC - 1'd1) ? 1'b1 : 1'b0 ;//rgb_valid:VGA有效显示区域
assign rgb_valid = (((cnt_h >= H_SYNC + H_BACK + H_LEFT)&& (cnt_h < H_SYNC + H_BACK + H_LEFT + H_VALID))&&((cnt_v >= V_SYNC + V_BACK + V_TOP)&& (cnt_v < V_SYNC + V_BACK + V_TOP + V_VALID)))? 1'b1 : 1'b0;//pix_data_req:像素点色彩信息请求信号,超前rgb_valid信号一个时钟周期
assign pix_data_req = (((cnt_h >= H_SYNC + H_BACK + H_LEFT - 1'b1)&& (cnt_h < H_SYNC + H_BACK + H_LEFT + H_VALID - 1'b1))&&((cnt_v >= V_SYNC + V_BACK + V_TOP)&& (cnt_v < V_SYNC + V_BACK + V_TOP + V_VALID)))? 1'b1 : 1'b0;//pix_x,pix_y:VGA有效显示区域像素点坐标
assign pix_x = (pix_data_req == 1'b1)? (cnt_h - (H_SYNC + H_BACK + H_LEFT - 1'b1)) : 10'h3ff;
assign pix_y = (pix_data_req == 1'b1)? (cnt_v - (V_SYNC + V_BACK + V_TOP)) : 10'h3ff;//rgb:输出像素点色彩信息
assign rgb = (rgb_valid == 1'b1) ? pix_data : 16'b0 ;endmodule彩条图像生成：
module vga_pic
(input wire vga_clk , //输入工作时钟,频率25MHzinput wire sys_rst_n , //输入复位信号,低电平有效input wire [9:0] pix_x , //输入VGA有效显示区域像素点X轴坐标input wire [9:0] pix_y , //输入VGA有效显示区域像素点Y轴坐标output reg [15:0] pix_data //输出像素点色彩信息
);//********************************************************************//
//****************** Parameter and Internal Signal *******************//
//********************************************************************//
//parameter define
parameter H_VALID = 10'd640 , //行有效数据V_VALID = 10'd480 ; //场有效数据parameter RED = 16'hF800, //红色ORANGE = 16'hFC00, //橙色YELLOW = 16'hFFE0, //黄色GREEN = 16'h07E0, //绿色CYAN = 16'h07FF, //青色BLUE = 16'h001F, //蓝色PURPPLE = 16'hF81F, //紫色BLACK = 16'h0000, //黑色WHITE = 16'hFFFF, //白色GRAY = 16'hD69A; //灰色//********************************************************************//
//***************************** Main Code ****************************//
//********************************************************************////pix_data:输出像素点色彩信息,根据当前像素点坐标指定当前像素点颜色数据
always@(posedge vga_clk or negedge sys_rst_n)if(sys_rst_n == 1'b0)pix_data <= 16'd0;else if((pix_x >= 0) && (pix_x < (H_VALID/10)*1))pix_data <= RED;else if((pix_x >= (H_VALID/10)*1) && (pix_x < (H_VALID/10)*2))pix_data <= ORANGE;else if((pix_x >= (H_VALID/10)*2) && (pix_x < (H_VALID/10)*3))pix_data <= YELLOW;else if((pix_x >= (H_VALID/10)*3) && (pix_x < (H_VALID/10)*4))pix_data <= GREEN;else if((pix_x >= (H_VALID/10)*4) && (pix_x < (H_VALID/10)*5))pix_data <= CYAN;else if((pix_x >= (H_VALID/10)*5) && (pix_x < (H_VALID/10)*6))pix_data <= BLUE;else if((pix_x >= (H_VALID/10)*6) && (pix_x < (H_VALID/10)*7))pix_data <= PURPPLE;else if((pix_x >= (H_VALID/10)*7) && (pix_x < (H_VALID/10)*8))pix_data <= BLACK;else if((pix_x >= (H_VALID/10)*8) && (pix_x < (H_VALID/10)*9))pix_data <= WHITE;else if((pix_x >= (H_VALID/10)*9) && (pix_x < H_VALID))pix_data <= GRAY;elsepix_data <= BLACK;endmodule显示结果：
