【小梅哥FPGA进阶教程】第十四章 TFT屏显示图片

十四、TFT屏显示图片

本文由杭电网友曾凯峰贡献，特此感谢

学习了小梅哥的TFT显示屏驱动设计后，想着在此基础上通过TFT屏显示一张图片，有了这个想法就开始动工了。首先想到是利用FPGA内部ROM存储图片数据，然后通过控制读取数据地址将图片数据传给TFT驱动模块，从而将每个图片数据显示在对应的像素点上。整个设计的框图如下：

主要是在小梅哥TFT驱动设计基础上增加了图片数据发送控制模块Imgdata_send，该模块包括存储图片数据的rom，和一些简单的逻辑控制。具体的rom IP核的建立我这里就不说了，不懂的可以参看小梅哥的相关内容的视频，我这里主要讲如何将图片转换成mif文件。这里有两种方法，可以作为参考，主要用到如下软件：

步骤1：利用Img2Lcd将图片转化为BMP格式的（当然图片本身为BMP格式就不需要转了，直接进入步骤2）；

步骤2：利用BMP2Mif可将图片转化为mif文件。

具体实现如下：

步骤1：先打开Img2Lcd打开一张图片，选择输出格式为BMP格式，输出灰度选择24位真彩色（由于BMP2Mif软件只能载入24位或8位的，所以这里就没有直接选16位的真彩色），最大宽度和高度根据图片实际的大小进行选择的，由于内部rom能存储的数据量有限，我选择了一张像素为160*120的图片如果想显示大的图片，如480*272图片，用这种方法就不能实现（看到这里有人想，如果想显示大点的图片那应该怎么解决，后面我会有其他方法来实现TFT屏保显示）。

步骤2：打开BMP2Mif软件，加载刚转换输出的24位BMP格式图片，选择输出图像格式和文件类型，点击一键转换便将图片转换为了mif文件了，可以将mif文件名更改下以区别不同图片mif文件。

可以用Notepad++将转化的mif文件打开看看，截取部分图如下：

rom IP核设置完成后就是数据发送控制模块Imgdata_send中控制逻辑的编写，主要是让图片显示在屏幕指定的地方，这就需要根据TFT_CTRL模块的TFT行和场扫描计数器输出信号来控制rom的数据地址，从而控制TFT_CTRL的待显示数据data_in。具体代码如下：

   module Imgdata_send(
       clk50M,
       rst_n,
       tft_de,
       hcount,
       vcount,
       data_in
   );

      input clk50M;           //系统时钟，默认50M
      input rst_n;            //复位信号，低电平有效
      input tft_de;           //TFT数据使能
      input [:]hcount;     //TFT行扫描计数器
      input [:]vcount;     //TFT场扫描计数器
      output [:]data_in; //待显示图片数据

      wire img_ack;              //图片数据使能

      localparam IMG_H = ,  //图片行像素点个数
                   IMG_V = ;  //图片场像素点个数

      localparam TFT_H = ,  //TFT屏行像素点个数
                   TFT_V = ;  //TFT屏场像素点个数

      localparam IMG_HM = TFT_H - IMG_H,  //图片行方向可移动像素点个数
                 IMG_VM = TFT_V - IMG_V;    //图片场方向可移动像素点个数

      reg [:]img_hbegin = ;   //图片左上角第一个像素点在TFT屏的行向坐标
      reg [:]img_vbegin = ;   //图片左上角第一个像素点在TFT屏的场向坐标

      reg [:]addr;             //读图片数据rom地址
      wire [:]img_data;       //读出图片数据

      rom u4_rom(
          .address(addr),
          .clock(clk50M),
          .q(img_data)
      );

      assign img_ack = tft_de && (hcount >= img_hbegin && hcount < img_hbegin + IMG_H) &&
                            (vcount >= img_vbegin && vcount < img_vbegin + IMG_V)?'b1:1'b0;

      always@(posedge clk50M or negedge rst_n)
      begin
          if(!rst_n)
              addr <= 'd0;
          else if(img_ack)
              addr <= (hcount - img_hbegin) + (vcount - img_vbegin)*IMG_H;
          else
              addr <= 'd0;
      end

      assign data_in = img_ack ? img_data : 'h0;

  endmodule 

接下来就是仿真验证，利用已有的TFT_CTRL模块的hcount、vcount、tft_de作为Imgdata_send模块的输出进行仿真验证，代码如下：

   `timescale 1ns/1ns
   `define PERIOD_CLK 

   module Imgdata_send_tb;

       reg clk50M;
       reg rst_n;
       wire tft_de;
       wire [:]hcount;
      wire [:]vcount;
      wire [:]data_in;

      wire clk9M;

      Imgdata_send u0_Imgdata_send(
          .clk50M(clk50M),
          .rst_n(rst_n),
          .tft_de(tft_de),
          .hcount(hcount),
          .vcount(vcount),
          .data_in(data_in)
      );

      pll u1_pll(
          .areset(!rst_n),
          .inclk0(clk50M),
          .c0(clk9M)
      );

      TFT_CTRL u2_TFT_CTRL(
          .clk9M(clk9M),
          .rst_n(rst_n),
          .data_in(),
          .hcount(hcount),
          .vcount(vcount),
          .tft_rgb(),
          .tft_hs(),
          .tft_vs(),
          .tft_clk(),
          .tft_de(tft_de),
          .tft_pwm()
      );

      initial clk50M = 'b1;
      always #(`PERIOD_CLK/) clk50M = ~clk50M;

      initial
      begin
          rst_n = 'b0;
          #(`PERIOD_CLK*+)
          rst_n = 'b1;
      end

  endmodule 

仿真验证的波形图如下：

从仿真结果可以看出，图片数据是在我们指定的区域输出的。该模块仿真验证正确后，进行顶层电路文件的设计。顶层文件编写如下：

   module rom_tft_img(

       clk50M,
       rst_n,  

       tft_rgb,
       tft_hs,
       tft_vs,
       tft_clk,
      tft_de,
      tft_pwm
  );

      input clk50M;
      input rst_n;    

      output [:]tft_rgb;
      output tft_hs;
      output tft_vs;
      output tft_clk;
      output tft_de;
      output tft_pwm;

      wire [:]data_in;
      wire [:]hcount;
      wire [:]vcount;
      wire clk9M;

      Imgdata_send u0_Imgdata_send(
          .clk50M(clk50M),
          .rst_n(rst_n),
          .tft_de(tft_de),
          .hcount(hcount),
          .vcount(vcount),
          .data_in(data_in)
      );

      pll u1_pll(
          .areset(!rst_n),
          .inclk0(clk50M),
          .c0(clk9M)
      );

      TFT_CTRL u2_TFT_CTRL(
          .clk9M(clk9M),
          .rst_n(rst_n),
          .data_in(data_in),
          .hcount(hcount),
          .vcount(vcount),
          .tft_rgb(tft_rgb),
          .tft_hs(tft_hs),
          .tft_vs(tft_vs),
          .tft_clk(tft_clk),
          .tft_de(tft_de),
          .tft_pwm(tft_pwm)
      );

  endmodule 

生成的顶层电路图如下：

接下来就是仿真验证，仿真验证程序如下：

   `timescale 1ns/1ps
   `define PERIOD_CLK 

   module rom_tft_img_tb;
       //模块输入端口
       reg clk50M;
       reg rst_n;

       //模块输出端口
      wire [:]tft_rgb;
      wire tft_hs;
      wire tft_vs;
      wire tft_clk;
      wire tft_de;
      wire tft_pwm;

      reg [:]v_cnt = ; //扫描帧数统计计数器

      rom_tft_img rom_tft_img( 

          .clk50M(clk50M),
          .rst_n(rst_n),  

          .tft_rgb(tft_rgb),
          .tft_hs(tft_hs),
          .tft_vs(tft_vs),
          .tft_clk(tft_clk),
          .tft_de(tft_de),
          .tft_pwm(tft_pwm)
      );

      initial clk50M = 'b1;
      always #(`PERIOD_CLK/) clk50M = ~clk50M;

      initial
      begin
          rst_n = 'b0;
          #(`PERIOD_CLK* + );
          rst_n = 'b1;
      end

      initial
      begin
          wait(v_cnt == );  //等待扫描2帧后结束仿真
          $stop;
      end

      always@(posedge tft_vs)   //统计总扫描帧数
          v_cnt = v_cnt + 'b1;

  endmodule 

仿真波形如下：

从波形可以看出，图片数据在指定区域显示。接下来就是板级验证，引脚分配参照芯航线FPGA学习套件引脚分配表进行分配，然后布局布线，板级程序下载最后实现的效果图如下:

我们设置的是显示在屏幕的左上角，与预期效果是一致的，想要改变图片的位置，可以更改Imgdata_send模块的28、29行代码：

      reg [:]img_hbegin = ;   //图片左上角第一个像素点在TFT屏的行向坐标
      reg [:]img_vbegin = ;   //图片左上角第一个像素点在TFT屏的场向坐标

将上面的（0、0）更改为其他的数，图片位置就会改变，如果想让图片在屏幕上自动的移动，可以自己设置一种路径让img_hbegin、img_vbegin的值按你的路径变化就可实现图片的自动移动，读者可以自己改进学习。

如有更多问题，欢迎加入芯航线 FPGA 技术支持群交流学习：472607506

小梅哥

芯航线电子工作室

关于学习资料，小梅哥系列所有能够开放的资料和更新（包括视频教程，程序代码，教程文档，工具软件，开发板资料）都会发布在我的云分享。（记得订阅）链接：http://yun.baidu.com/share/home?uk=402885837&view=share#category/type=0

赠送芯航线AC6102型开发板配套资料预览版下载链接：链接：http://pan.baidu.com/s/1slW2Ojj 密码：9fn3

赠送SOPC公开课链接和FPGA进阶视频教程。链接：http://pan.baidu.com/s/1bEzaFW 密码：rsyh