VGA 叠加图像原理和实现（十字光标）

最新推荐文章于 2024-05-06 15:55:04 发布

原创

最新推荐文章于 2024-05-06 15:55:04 发布 · 427 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#fpga开发

该博客介绍了如何通过 FPGA 接收串口数据，并将 198x198 像素的十字光标图像缓存到 RAM 中，然后在 VGA 显示中进行叠加显示。利用 MATLAB 将 RGB 图像转换为 8 位 256 色数据，接着在 FPGA 中通过 VGA 扫描读取 RAM 数据，将白色像素替换为背景色，实现光标叠加效果。博客还展示了 UART 接收模块、RAM 控制模块以及 VGA 叠加显示模块的 Verilog 代码实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

实验任务：

通过串口助手把 198x198 的十字光标图像二进制数据传递给 FPGA 板卡，FPGA 板卡接收到后存储到 Ram 中用于 VGA 叠加显示。

叠加算法算法：

1．缓冲光标文件到 Ram 中 198*198 点像素数据，每个像素 8bit。

2． VGA 扫描到光标显示区后从 RAM 中读取出光标数据。

3．光标文件是白色为背景，那么判断是否为背景的条件是如果像素等于 255 那么是背景像素否则是光标像素，根据此特性，把 255 的像素用 VGA 的 RGB 背景替换，这样就把光标叠加到显示区域中了。

Matlab 读取图像将 RGB 图像 888bit 的改为 8bit256 色图像，修改方法读取图像后截取 R 的高三位，G 的高三位，B 的高两位，然后将 RGB 合并为 8 位数据{R[2:0],G[2:0],B[1:0]}。 Matlab 处理代码如下

clc;

clear all;

imrgb24=imread('shizi.jpg','jpg');%读取十字光标文件

R=bitshift(imrgb24(1:198,1:198,1),-5);%读取 R 的高 3 位

G=bitshift(imrgb24(1:198,1:198,2),-5);%读取 G 的高 3 位

B=bitshift(imrgb24(1:198,1:198,3),-6);%读取 B 的高 2 位

rgb8=bitshift(R,5)+bitshift(G,2)+B;%拼接{R[2:0],G[2:0],B[1:0]}

fid=fopen('rgb8.txt','w+');%打开文件

fprintf(fid,'%02x ',rgb8');%将字符打印到 txt 文档中

VGA 叠加图像顶层模块设计

VGA 叠加图像顶层模块示意图：

VGA 叠加图像顶层模块代码实现：

module shizi_top(
   input wire clk,
   input wire rst_n,
   input wire rx,
   output wire [7:0] rgb,
   output wire hsync,
   output wire vsync
   );
wire [7:0] pi_data;
wire [7:0] doutb;
wire pi_flag;
wire rd_flag;
uart_rx uart_rx_inst(
   .clk(clk1),
   .rst_n(rst_n),
   .rx(rx),
   .po_data(pi_data),
   .po_flag(pi_flag)
   );
ram_ctrl ram_ctrl_inst(
   .clk(clk2),
   .rst_n(rst_n),
   .wr_en(pi_flag),
   .pi_data(pi_data),
   .doutb(doutb),
   .rd_flag(rd_flag)
   );
vga_move vga_move_inst(
   .clk2(clk2),
   .rst_n(rst_n),
.doutb(doutb),
   .hsync(hsync),
   .vsync(vsync),
   .rgb(rgb),
   .rd_flag(rd_flag)
   );
clk_wiz_0 instance_name
(
// Clock out ports
.clk_out1(clk2), // output clk_out1
.clk_out2(clk1), // output clk_out2
// Clock in ports
.clk_in1(clk));
endmodule