【正点原子FPGA连载】 第十九章 RGB LCD字符和图片显示实验 -摘自【正点原子】领航者ZYNQ之FPGA开发指南_V2.0

1）实验平台：正点原子领航者ZYNQ开发板 2）平台购买地址：https://item.taobao.com/item.htm?&id=606160108761 3）全套实验源码+手册+视频下载地址：http://www.openedv.com/thread-301505-1-1.html 4）对正点原子FPGA感兴趣的同学可以加群讨论：994244016 5）关注正点原子公众号，获取最新资料更新

第十九章 RGB LCD字符和图片显示实验

我们在“RGB LCD彩条显示实验”中成功的在正点原子的RGB LCD液晶屏模块上显示出了彩条。本章我们在此基础上稍作修改，在LCD上完成“正点原子logo图片”和汉字“正点原子”的显示。 本章包括以下几个部分： 19.1 简介 19.2 实验任务 19.3 硬件设计 19.4 程序设计 19.5 下载验证   19.1 简介 我们在“RGB LCD彩条显示实验”中对正点原子的RGB LCD液晶屏模块作了详细的介绍，包括数据输入时序、同步方式、以及分辨率等。如果大家对这部分内容不是很熟悉的话，请参考“RGB LCD彩条显示实验”中的简介部分。 19.2 实验任务 本节的实验任务是通过领航者开发板上的RGB TFT-LCD接口，在正点原子的RGB LCD液晶屏的左上角位置显示图片以及4个汉字“正点原子”。其中每个汉字的大小为3232，图片的大小为100100。 19.3 硬件设计 RGB TFT-LCD接口部分的硬件设计原理及本实验中各端口信号的管脚分配与“RGB LCD彩条显示实验”完全相同，请参考“RGB LCD彩条显示实验”中的硬件设计部分。 19.4 程序设计 图 7.5.13.1是根据本章实验任务画出的系统框图。可以看出，其中本次实验的系统框图与“RGB LCD彩条显示实验”基本一致，我们只需要修改LCD显示模块就可以实现在LCD液晶屏上显示字符和图片的功能。另外，由于图片的像素数据较多，因此我们在LCD显示模块中例化了一个ROM，用来存储图片数据。

图 7.5.13.1 RGB LCD字符和图片显示实验系统框图 字符（包括汉字、字母和符号等）的本质都是点阵，在LCD屏幕上体现为字符显示区域内像素点的集合。字符的大小决定了字符显示区域内像素点的数目，而字符的样式（字体、颜色等）则决定了各像素点的颜色值。因此，在显示字符之前，我们需要先指定字符的大小、样式，然后获取该字符的点阵，这个过程我们称之为“提取字模”，或简称“取模”。 我们一般使用0和1的组合来描述字符的点阵排列：点阵中每个像素点用一位（1 bit）数据来表示，其中用于表征字符的像素点用数字1来表示，其他的像素点作为背景用数字0来表示，如图 7.5.13.2所示。采用这种方式描述的字符是不含有颜色特征的，只能区分点阵中的字符和背景。 在这里插入图片描述

图 7.5.13.2 汉字“正”及其点阵描述 字模的提取可通过字符取模软件来实现，在这里我们使用取模软件“PCtoLCD2002”来获取汉字“正点原子”的字模。首先在开发板所随附的资料盘（A盘）中“6_软件资料/1_软件/PCtoLCD2002完美版”目录下找到“PCtoLCD2002”并双击打开，如下图所示：

图 7.5.13.3 取模软件PCtoLCD2002 打开之后会发现软件中的字体、字宽和字高都是无法设置的，这个时候点击菜单栏的“模式”，选择“字符模式”，如下图所示。

图 7.5.13.4 切换到字符模式 切换到字符模式后，就可以设置字体、字宽和字高了。字宽和字高的值越高，显示在LCD屏上的字符就越大，但是代码也需要做相应的修改。这里将字体选择默认的“宋体”，字宽和字高设置成“32”，然后在下方文本框中输入汉字“正点原子”，如下图所示：

图 7.5.13.5 字符设置 由于PCtoLCD2002会给每个字符生成一个独立的字模，如果此时点击文本框右侧的“生成字模”按钮，我们将会得到四个32*32的字模。然而为了方便在LCD上显示，我们将四个汉字看作一个整体，从而获得一个字宽为128，字高为32的“大字模”。为了达到这个目的，我们首先将图 7.5.13.5中四个汉字的点阵保存为.BMP格式的图片。在菜单栏中点击“文件”并选择“另存为”，在保存界面中指定文件存储路径，并选择保存类型为“BMP图像文件”，然后输入文件名“正点原子_bmp”，最后点击“保存”。本次我们在工程路径下新建一个“doc”文件夹，将生成的BMP图片保存在doc文件夹下。如图 7.5.13.6和图 7.5.13.7所示。

图 7.5.13.6 点击“文件”并另存为图像

图 7.5.13.7 BMP格式图片保存界面 我们在“画图”中打开刚刚保存的BMP格式的图片如下所示：

图 7.5.13.8 保存的BMP格式图片 接下来我们将取模软件PCtoLCD2002切换至图形模式，在菜单栏中点击“模式”，选择“图形模式”。

图 7.5.13.9 切换至图形模式 然后在菜单栏中点击“文件”并选择“打开”，指定图 7.5.13.7中存放BMP格式图片的路径并打开图片“正点原子_bmp”，图片打开后如下所示。

图 7.5.13.10 PCtoLCD2002图形模式 请大家注意比较图 7.5.13.10与图 7. 5.13.5的差异，在上图中，四个汉字“正点原子”被看作一个整体，而不再是四个独立的字符。实际上，这四个汉字也确实是作为一个整体以BMP图片的形式导入到取模软件中的。 在生成字模之前，我们需要先设置字模的格式。在菜单栏中点击“选项”，并在弹出的配置界面中按照下图进行配置，配置完成后点击确定。

图 7.5.13.11 字模格式配置界面 在配置界面中，当鼠标悬浮在各配置选项上时，软件会自动提示当前配置的含义。需要注意的是图 7.5.13.11左下角“每行显示数据”是以字节（Byte）为单位的，而一个字节的数据为8个bit，即可以表示一行点阵中的8个像素点。由于图 7.5.13.10中的点阵每行为128个像素点，所以需要16个Byte的数据来表示一行，因此将“每行显示数据—点阵”处设置为16。 配置字模选项完成后，点击“生成字模”，即可得到汉字“正点原子”所对应的点阵数据，如下图所示：

图 7.5.13.12 生成字模 最后点击保存字模，命名成“正点原子_字模”，可将生成的点阵数据保存在txt格式的文本文档中，如图 7.5.13.13所示。数据以十六进制显示 ，每行有16个Byte，对应每行四个汉字共128个像素点；共有32行，对应每个汉字的高度为32。

图 7.5.13.13 “正点原子”字模 提取字模完成后，我们需要在LCD显示模块中将获取的点阵数据映射到液晶屏中心32128个的像素点的字符显示区域，从而实现字符的显示。 到这里提取字模的过程就已经完成了，接下来我们介绍图片像素数据的获取方法。 LCD显示模块中的ROM是通过例化IP核来实现的只读存储器，它使用FPGA的片上存储资源，即BRAM。由于FPGA的片上存储资源有限，所以ROM中存储的图片大小也受到限制，本次实验采用的图片分辨率为100100。领航者ZYNQ开发板上的RGB TFT-LCD接口采用RGB888数据格式，即每个像素点的颜色用24bit的数据来表示，因此大小为10010024bit = 240000bit=234.375Kbit≈0.23Mbit。XC7Z020芯片的BRAM存储容量为4.9Mbit，XC7Z010芯片的BRAM存储容量为2.1Mbit，都能够满足本次实验中的图片存储需求。 ROM作为只读存储器，在调用IP核时需要指定初始化文件，在这里就是写入存储器中的图片数据，各种格式的图片（bmp、jpg等）在Xilinx开发软件中都是以COE文件或者HEX文件的形式导入到ROM中的。COE文件格式较为简单，因此本次实验选取COE的文件格式。COE是一种Xilinx工具能识别的文件格式，在文件的开头定义了存储数据的进制和初始化的数据，存储的数据最后一行以“;”结束，其余的以“,”结束。例如一个存储数据为16进制，深度为5的COE文件内容如下图所示：

图 7.5.13.14 COE文件格式 图中第一行定义存储的数据为16进制，第二行初始化的数值向量，分别对应不同存储单元的数据，存储地址从0开始，依次累加，最后一个存储地址的数据以“;”结束。 当需要存储的数据量较小时，如果我们知道数据的内容，那么就可以仿照图 7.5.13.14的格式手动编写COE文件。但是由于图片的数据量较大，并且我们无法直接看出各个像素点对应的颜色数据，因此需要借助工具来实现图片到COE文件的转换。在这里我们使用正点原子提供的工具“PicToLCD”来实现这一转换过程，该工具位于开发板所随附的资料中“6_软件资料/1_软件/PicToLCD”目录下。 我们在Windows自带的“画图”工具中将正点原子的LOGO图片大小调整100100，并利用工具PicToLCD转换得到COE文件“ZDYZ.coe”。 双击运行“PicToLCD.exe”，点击“加载图片”并在弹出的界面中选择需要转换的图片(注意：待转换图片分辨率的大小必须是100100，否则代码中访问ROM的最大地址需要修改)。图片加载成功后工具会在图片属性中指示出图片的文件名和大小；接下来选择图片转换的数据格式为RGB888；文件类型选择“COE”；最后点击“一键转换” 按钮，在弹出的界面中选择COE文件的存放路径并输入文件名。PicToLCD转换过程中的软件界面如图 7.5.13.15所示：

图 7.5.13.15 PicToLCD转换界面 最终转换得到的COE文件部分截图如下所示： 在这里插入图片描述

图 7.5.13.16 转换得到的COE文件 在Vivado软件中，RAM和ROM都是由BMG IP核（Block Memory Generator）配置生成的，ROM的配置过程和RAM类似，在BGM IP核配置过程的“Basic”选项卡中，要选择“Single Port ROM”选项，如下图所示：

图 7.5.13.17 “Single Port ROM”选项 在“Port A Options”选项卡中，设置ROM读端口的位宽和深度，因为我们的像素数据是“RGB888”格式，所以端口位宽要设置成24位；使用“Notepad++”编辑器打开.coe初始化文件，可以看到存储的数据共有10000个数据，所以端口深度设置成10000。与RAM IP核一样，我们同样不使用流水线寄存器。“Port A Options”选项卡的设置如下图所示：

图 7.5.13.18 “Port A Options”选项卡 接下来是最重要的一步，在“Other Options”选项卡中，加载我们刚刚使用“PicToLCD”软件生成的“.coe” 文件，如下图所示：

图 7.5.13.19 加载“.coe” 文件 最后点击OK，完成对ROM的配置。 程序中各模块端口及信号连接如下图所示：

图 7.5.13.20 顶层模块原理图 图 7.5.13.20中的顶层模块中的ID读取模块（rd_id）、时钟分频模块（clk_div）以及LCD驱动模块（lcd _driver）均与“RGB LCD彩条显示实验”完全相同，本次实验只对LCD显示模块（lcd_display）作了修改。因此，这里我们重点讲解lcd_display模块，其他部分大家可以参考“RGB LCD彩条显示实验”。 LCD显示模块的代码如下：

1   module lcd_display(
2       input             lcd_pclk,     //时钟
3       input             rst_n,        //复位![
，低电平有效
4                                       
5       input      [10:0] pixel_xpos,   //像素点横坐标
6       input      [10:0] pixel_ypos,   //像素点纵坐标    
7       output reg [23:0] pixel_data    //像素点数据,
8   );                                   
9                                        
10  //parameter define                   
11  localparam PIC_X_START = 11'd1;      //图片起始点横坐标
12  localparam PIC_Y_START = 11'd1;      //图片起始点纵坐标
13  localparam PIC_WIDTH   = 11'd100;    //图片宽度
14  localparam PIC_HEIGHT  = 11'd100;    //图片高度
15                         
16  localparam CHAR_X_START= 11'd1;      //字符起始点横坐标
17  localparam CHAR_Y_START= 11'd110;    //字符起始点纵坐标
18  localparam CHAR_WIDTH  = 11'd128;    //字符宽度,4个字符:32*4
19  localparam CHAR_HEIGHT = 11'd32;     //字符高度
20                         
21  localparam BACK_COLOR  = 24'hE0FFFF; //背景色，浅蓝色
22  localparam CHAR_COLOR  = 24'hff0000; //字符颜色，红色
23  
24  //reg define
25  reg   [127:0] char[31:0];  //字符数组
26  reg   [13:0]  rom_addr  ;  //ROM地址
27  
28  //wire define   
29  wire  [10:0]  x_cnt;       //横坐标计数器
30  wire  [10:0]  y_cnt;       //纵坐标计数器
31  wire          rom_rd_en ;  //ROM读使能信号
32  wire  [23:0]  rom_rd_data ;//ROM数据
33  
34  //*****************************************************
35  //**                    main code
36  //*****************************************************
37  
38  assign  x_cnt = pixel_xpos - CHAR_X_START; //像素点相对于字符区域起始点水平坐标
39  assign  y_cnt = pixel_ypos - CHAR_Y_START; //像素点相对于字符区域起始点垂直坐标
40  assign  rom_rd_en = 1'b1;                  //读使能拉高，即一直读ROM数据
41  
42  //给字符数组赋值，显示汉字“正点原子”，每个汉字大小为32*32
43  always @(posedge lcd_pclk) begin
44      char[0 ]