这篇是写给从事或学习电子科技的人参考用的.

里面主要介绍如何在萤幕模组上印字/改变字体/改变颜色/画点/画线...等.

较为学术类的内容.可能会有些枯燥乏味,有兴趣的在往下看吧.^_^|||

 

本篇所采用的萤幕,与我的另二两篇章

Arduino GPS时速表

Arduino 程式库 (Library)

里面用的萤幕皆为同一个.

让各位在学习完萤幕的用法后,可以顺便看看应用的方式.

这篇算是第一篇专门写给从事或学习电子科技的人看的,所以我会尽量地写的比较底层.

就从...硬体开始吧!

 

硬体

准备材料

1. Arduino Mega2560  

Mega2560.jpg

2. FTF萤幕 (在 Arduino 程式库 (Library)  这篇文章里面有较详细关于此萤幕的资讯)

arduino的萤幕众多,注意不要买错.若真的买错了,也别生气,因为萤幕的用法大同小异,参考我的写的内容.

控制起其他不同种类的萤幕也可以比较容易上手.

 

TFT正.jpgTFT反.jpg

 

硬体就这样,然后将他们插在一起.结束.

就这么简单吗?对,就这么简单!

这也是我喜欢用Arduino模组的关系,尽量去简单化硬体,这样学习起软体,也比较事半功倍.

 

软体

好.接下来就要玩硬的了.哈!

对了!不会写程式的不用怕,你不用太去理解我里面的程式是怎么写出来的,

你只要会用我的程式码,去做出你想要的画面就好,不用急著一步到位,用久了,

再去学习软体,也可以更快进入状况.

 

1. 首先先开启Arduino IDE, 不知道的可以参考我的另一篇章 Arduino IDE

2. 安装萤幕的Library,  不知道的可以参考我的另一篇章 Arduino 程式库 (Library) 

    这边使用的是 Adafruit的程式库(Library),  Adafruit Industries是一家位于纽约市的开源硬件公司 .

3. Arduino IDE 的程式架构, 刚学习的可以参考我的另一篇章 Arduino Blink 

 

执行画面如下

萤幕字体.jpg

 

TFT画面的使用.

C语言的部分用"浅蓝底黑色字"处理

Setp1,载入LIB的前置处理

#include <Adafruit_TFTLCD.h> // Hardware-specific library
 

Step2,先宣告一个TFT

#define LCD_CS A3         // TFT 使用的接脚定义
#define LCD_CD A2        // TFT 使用的接脚定义
#define LCD_WR A1       // TFT 使用的接脚定义
#define LCD_RD A0        // TFT 使用的接脚定义
#define LCD_RESET A4   // TFT 使用的接脚定义
Adafruit_TFTLCD Touchtft(LCD_CS, LCD_CD, LCD_WR, LCD_RD, LCD_RESET);  // 这边使用的是Adafruit的程式库(Library)                                                                                                                     

以上.为硬体设定,所以将其放在最上方的前置处理,或全域变数中.

 

Step3,初始化萤幕.

    Touchtft.reset();
    Touchtft.begin(0x7575);       // 0x7575, TFT萤幕的控制器ID
    Touchtft.setRotation(1);        // 设定旋转角度
    Touchtft.fillScreen(BLACK);   // 萤幕全部变黑

 

在开始Step4之前先解释一下,萤幕像素,及Touchtft的函式.

萤幕像素. 

这片萤幕为320x240像素的萤幕.

何谓像素? 简单说为影像显示的基本单位.

pixels-22x20.jpg

以上图为例,就是一个22x20像素的图,你可以改变每个小格子(像素)的颜色,来构成一附图,或一个字.

每个小格子(像素),可以显示三种原色,就是红/绿/蓝.这片萤幕解析度是16位元的.

前5个Bit是蓝0x0000~0x001F

中5个Bit是绿0x0020~0x03E0

第11个Bit无作用

最后5个Bit是红0x0800~0xF800

0x0000不显色,就是黑.

0xFFFF蓝绿红全亮,就是白.

所以上面有一行

 Touchtft.fillScreen(BLACK);   // 萤幕全部变黑

里面的BLACK,就可以用

#define BLACK 0x0000 

来表示.

 

下面是RGB显示的范例

#include <Adafruit_TFTLCD.h> // Hardware-specific library

#define YP A1  
#define XM A2  
#define YM 7   
#define XP 6   

#define LCD_CS A3
#define LCD_CD A2
#define LCD_WR A1
#define LCD_RD A0
#define LCD_RESET A4

#define BLACK   0x0000

#define RED       0xF800
#define GREEN   0x07E0
#define BLUE      0x001F
#define YELLOW 0xFFE0
#define WHITE    0xFFFF
 

Adafruit_TFTLCD Touchtft(LCD_CS, LCD_CD, LCD_WR, LCD_RD, LCD_RESET);

void setup(void)
{
    // TFT init 
    Touchtft.reset();
    Touchtft.begin(0x7575);     // for HX8347G
    Touchtft.setRotation(1);    
    Touchtft.fillScreen(BLACK);

    int iTempR = 0;
    int iTempG = 0;
    int iTempB = 0;
    for (size_t i = 0; i < 0x0020; i++)
    {
        iTempB = i;           // 蓝色范围 0x0000~0x001F
        Touchtft.fillRect(10, 20, 50, 50, iTempB);

        iTempG = i << 5;  // 绿色范围 0x001F~0x03E0
        Touchtft.fillRect(70, 20, 50, 50, iTempG);

        iTempR = i << 11; // 绿色范围 0x07FF~0xF800
        Touchtft.fillRect(130, 20, 50, 50, iTempR);

        Touchtft.fillRect(10, 80, 50, 20, BLACK); // 清除数字i的显示范围
        Touchtft.setTextSize(2);                         // 设定数字i的大小
        Touchtft.setCursor(10, 80);                    // 设定数字i的显示位置
        Touchtft.print(i);                                    // 印出数字i
        delay(500);
    }
}

void loop()
{

}
 

 

范例影片如下

 

由上述范例,可以得知几个常用关于显示的函式.

1. Touchtft.fillRect(x1, y1, x2, y2, RGB); // 区块填色

                                                             // 在x1,y1的位置到x2,y2间,填入颜色

2. Touchtft.setTextSize(int);                   // 设定字体大小

3. Touchtft.setCursor(x, y);                    // 设定游标位置

4. Touchtft.print(str);                             // 印出字串  

备注: x / y / x1 / y1 / x2 /y2 都是座标,范围是320x240

就是萤幕的解析度,画素.

好!接下来,就用这些函式来显示萤幕画面.

 

Step4,显示字串

显示日期

    Touchtft.fillRect(0, 0, 120, 16, BLACK);
    Touchtft.setTextSize(2);
    Touchtft.setTextColor(WHITE);
    Touchtft.setCursor(0, 0);
    sprintf(cBuf80, "%04d-%02d-%02d", 2017, 11, 9);  // 将字串2017-11-09放入cBuf80. 

                                                                                    // 日期是随意设的, 之后会抓GPS日期来显示                                                                                  
    Touchtft.println(cBuf80);                                         // 印出cBuf80

 

显示时间

    Touchtft.fillRect(220, 0, 90, 22, BLACK);
    Touchtft.setTextSize(3);
    Touchtft.setTextColor(WHITE);
    Touchtft.setCursor(220, 0);
    sprintf(cBuf80, "%02d:%02d", 21, 10); // 将字串21:10放入cBuf80

                                                                // 时间是随意设的, 之后会抓GPS时间来显示 
    Touchtft.println(cBuf80);                     // 印出cBuf80

 

显示卫星数量
    Touchtft.fillRect(132, 20, 48, 16, BLUE);
    Touchtft.setTextSize(2);
    Touchtft.setTextColor(WHITE);
    Touchtft.setCursor(0, 20);
    sprintf(cBuf80, "satellites: %d", 6); // 将satellites: 6放入cBuf80

                                                           // 卫星数量是随意设的, 之后会抓GPS接收卫星数量来显示 
    Touchtft.println(cBuf80);                // 印出cBuf80

 

显示km/h单位
    Touchtft.fillRect(269, 180, 50, 20, BLACK);
    Touchtft.setTextColor(WHITE);
    Touchtft.setTextSize(2);
    Touchtft.setCursor(269, 180);
    Touchtft.println("km/h");

 

时速显示

    Touchtft.fillRect(213, 60, 90, 120, BLACK);
    Touchtft.setTextSize(17);
    Touchtft.setCursor(213, 60);
    Touchtft.println("0");  // 直接印出0

 

显示30sec studio, 哈!这是不要脸的置入,就不多做解释啦.

    Touchtft.fillRect(165, 215, 155, 25, RED);
    Touchtft.setCursor(170, 220);
    Touchtft.setTextColor(WHITE);
    Touchtft.setTextSize(2);
    sprintf(cBuf80, "30sec studio");
    Touchtft.println(cBuf80);
 

以上.皆为一次性的设定,所以将其放在Setup()的式里就可以.

loop()里面放空就好.

 

好,静态显示的部分结束啦,下次再聊聊动态部分.

 

创用 CC 授权条款
Arduino GPS时速表-萤幕分析 - 静态显示由Peng Yi Hsing制作，以创用CC 姓名标示-非商业性-禁止改作 3.0 台湾 授权条款释出。

查看原文 >>
相关文章