#2 hướng dẫn lập trình lcd tft 2.0"-các câu lệnh cơ bản

Đào Hùng 09/04/2021
2-huong-dan-lap-trinh-lcd-tft-2-0-cac-cau-lenh-co-ban

Mở đầu

  • Như bài trước thì mình có hướng dẫn mọi người tìm hiểu về Module LCD TFT2.0″ , cách đấu nối và code thử rồi =))
  • bài này mình sẽ hướng dẫn một số câu lệnh cơ bản để có thể giúp mọi người sử dụng thành thạo hơn với Module này =)))

Chuẩn bị

Phần cứng
Arduino Uno x1
LCD TFT 2.0 inch SPI x1
Dây cắm board test đực cái x7
Phần mềm
Arduino IDE  
Thư viện
TFT_22_ILI9225  

Đấu nối LCD TFT 2.0 inch với Arduino Uno

#2 Hướng dẫn lập trình LCD TFT 2.0″-Các câu lệnh cơ bản

LCD TFT SPI 2.0 Inch Arduino Uno R3
VCC 3V
GND GND
RST 8
RS 9
CS 10
SDA 11
CLK 13

Code

Các quy ước cần nhớ

Trục tọa độ

  • Trục tọa độ: (x) trục nằm ngang

(y) trục đứng

  • Gốc tọa độ là điểm có tọa độ(0,0) nằm ở  góc trái trên cùng của màn hình
  • Pixel là điểm ảnh nhỏ nhất cấu thành lên “bức ảnh”.
  • kích thước màn hình là tổng số điểm ảnh mà màn hình có thể hiển thị
  • chiều rộng luôn viết trước, chiều cao viết sau(tương tự như các LCD khác như LCD1602,… )
  • Kích thước của ảnh(hình chữ nhật) chính là số pixel của ảnh đó

Khai báo và sử dụng thư viện

  • Khai báo thư viện
  • Khai báo và thiết lập các chân kết nối
  • bật màn hình
// Khai báo 2 thư viện SPI và TFT LCD
#include "SPI.h"
#include "TFT_22_ILI9225.h"
 
// khai báo các chân kết nối
#define TFT_RST 8    // Chân Reset
#define TFT_RS 9     // Chân RS
#define TFT_CS 10    // Chân SS
#define TFT_SDI 11   // Chân MOSI
#define TFT_CLK 13   // Chân SCK
#define TFT_LED 3    // Nối với chân nào cũng được, không có cũng không sao =)))
 
#define TFT_BRIGHTNESS 200 // định độ sáng của đèn nền
 
// Khai báo thứ tự chân RST --> RS --> CS --> LED --> BRIGHTNESS
TFT_22_ILI9225 tft = TFT_22_ILI9225(TFT_RST, TFT_RS, TFT_CS, TFT_LED, TFT_BRIGHTNESS);
 
void setup() {
  // Khởi tạo màn hình tft
  tft.begin();
}
void loop() {
  // Nội dung muốn hiển thị lên màn hình
}

Xuất kích cỡ của màn hình

// Khai báo 2 thư viện SPI và TFT LCD
#include "SPI.h"
#include "TFT_22_ILI9225.h"
 
// khai báo các chân kết nối
#define TFT_RST 8    // Chân Reset
#define TFT_RS 9     // Chân RS
#define TFT_CS 10    // Chân SS
#define TFT_SDI 11   // Chân MOSI
#define TFT_CLK 13   // Chân SCK
#define TFT_LED 3    // Nối với chân nào cũng được, không có cũng không sao =)))
 
#define TFT_BRIGHTNESS 200 // định độ sáng của đèn nền
 
// Khai báo thứ tự chân RST --> RS --> CS --> LED --> BRIGHTNESS
TFT_22_ILI9225 tft = TFT_22_ILI9225(TFT_RST, TFT_RS, TFT_CS, TFT_LED, TFT_BRIGHTNESS);
 
void setup() {
  // Khởi tạo màn hình tft
  tft.begin();
}
void loop() {
  // Nội dung muốn hiển thị lên màn hình
  Serial.print("Chiều rộng màn hình: ");   // Lấy chiều rộng của màn hình LCD
  Serial.println(tft.maxX());
  Serial.print("Chiều dài màn hình");       // Lấy chiều dài của màn hình LCD
  Serial.println(tft.maxY());
}

Hệ màu

Màn hình LCD TFT 2.0 inch ILI9225 dùng hệ màu RGB565 (16BIT RGB 65K color)

#2 Hướng dẫn lập trình LCD TFT 2.0″-Các câu lệnh cơ bản

Một số hàm thiết lập

+ setDisplay(boolean flag); // bật hoặc tắt màn hình(flag = true: ON| flag = false: OFF)
 
+ setOrientation(uint8_t orientation);// định hướng xoay màn hình
 
       orientation: 0=portrait, 1=right rotated landscape, 2=reverse portrait, 3=left rotated landscape
 
+ setBacklightBrightness(uint8_t brightness); // chỉnh độ sáng đèn nền giá trị trong khoảng 0-225
 
+ clear(void); // xóa toàn bộ màn hình

Vẽ một một điểm có tọa độ x,y

	
void drawPixel(uint16_t x1, uint16_t y1, uint16_t color);
void loop() {
tft.drawPixel(50,50,COLOR_RED); // vẽ điểm màu đỏ có tọa độ (50,50)
}

Vẽ đoạn thẳng

void drawLine(uint16_t x1, uint16_t y1, uint16_t x2, uint16_t y2, uint16_t color);
  • x1,y1: tọa độ điểm bắt đầu
  • x2,y2: tọa độ điểm kết thúc
void loop() {
 
      tft.drawLine(20, 20, 100, 100, COLOR_WHITE);
}

vẽ đường tròn

void drawCircle(uint16_t   x0, uint16_t   y0, uint16_t  r, uint16_t  color);
  • x0,y0: tọa độ tâm
  • r: bán kính đường tròn
void loop() {
  tft.drawCircle(50,50,50,COLOR_GREEN ); 
}

Vẽ hình tròn tô màu

<span class="pl-k">void</span> <span class="pl-en">fillCircle</span>(<span class="pl-c1">uint8_t</span> x0, <span class="pl-c1">uint8_t</span> y0, <span class="pl-c1">uint8_t</span> radius, <span class="pl-c1">uint16_t</span> color);
void loop() {
  tft.fillCircle(50,50,50,COLOR_GREEN ); 
}
<span style="font-size: 14pt;"><strong>Vẽ hình chữ nhật
</strong><span style="font-size: 12pt;"><span class="pl-k">void</span><span class="pl-en">drawRectangle</span>(<span class="pl-c1">uint16_t</span> x1, <span class="pl-c1">uint16_t</span> y1, <span class="pl-c1">uint16_t</span> x2, <span class="pl-c1">uint16_t</span> y2, <span class="pl-c1">uint16_t</span> color);</span>
</span>
  •  x1,y1: tọa độc góc trái trên cùng
  • x2,y2: tọa độ góc phải dưới cùng
void loop() {
 
  tft.drawRectangle(20,20,80,100,COLOR_BLUE );//vẽ hcn màu xanh dương có tọa độ góc trên bên 
                                             //trái(20,20) và tọa độ góc phải bên dưới(80,100)
}

Tô màu hình chữ nhật

<span class="pl-k">void</span> <span class="pl-en">fillRectangle</span>(<span class="pl-c1">uint16_t</span> x1, <span class="pl-c1">uint16_t</span> y1, <span class="pl-c1">uint16_t</span> x2, <span class="pl-c1">uint16_t</span> y2, <span class="pl-c1">uint16_t</span> color);
void loop() {
    tft.fillRectangle(20, 20, 80, 100, COLOR_GREEN );
}

Vẽ hình tam giác

<span class="pl-k">void</span> <span class="pl-en">drawTriangle</span>(<span class="pl-c1">uint16_t</span> x1, <span class="pl-c1">uint16_t</span> y1, <span class="pl-c1">uint16_t</span> x2, <span class="pl-c1">uint16_t</span> y2, <span class="pl-c1">uint16_t</span> x3, <span class="pl-c1">uint16_t</span> y3, <span class="pl-c1">uint16_t</span> color);
  • vẽ tam giác có 3 đỉnh A(x1,y1); B(x2,y2); C(x3,y3)
void loop() {
      tft.drawTriangle(20, 20, 100,10,10,100, COLOR_WHITE);
}

#2 Hướng dẫn lập trình LCD TFT 2.0″-Các câu lệnh cơ bản

Tô màu tam giác

void fillTriangle(uint16_t x1, uint16_t y1, uint16_t x2, uint16_t y2, uint16_t x3, uint16_t y3, uint16_t color);
void loop() {
tft.fillTriangle(20, 20, 100,10,10,100, COLOR_WHITE);
}

Viết dòng text: Note: trong thư viện của module Lcd này khi muốn viết được một dòng text lên trên màn hình thì phải khai báo font chữ sử dụng trước sau mới đến hàm hiển thị đoạn text ra hàm set font

<span class="pl-k">void</span> <span class="pl-en">setFont</span>(<span class="pl-c1">uint8_t</span>* font);
  • font là font chữ cơ bản được lưu trong thư viện
    Font Name Width (pixels) Height (pixels) Offset (start char) Number of chars
    Terminal6x8 6 8 32 96
    Terminal11x16 11 16 32 96
    Terminal12x16 12 16 32 96
    Trebuchet_MS16x21 16 21 46 13

Viết dòng text với  một font ở trên

void drawText(uint16_t x, uint16_t y, String s, uint16_t color = COLOR_WHITE);
  • x,y : tọa độ bắt đầu ký tự đầu tiên của đoạn text
  • s: đoạn text cần xuất lên màn hình
void loop() {
  tft.setFont(Terminal6x8);
  tft.drawText(40,40, "lamchucongnghe.com",COLOR_RED);
}

như ở trên đã thấy chúng ta có quá ít font mặc định(4 font) thật may mắn là nhưng người tạo ra thư viện này đã cho phép chúng ta sử dụng thêm những font khác đó là các font GFX đặc điểm là rất đa dạng và phong phú

Các hàm được sử dụng:

<span class="pl-k">void</span> <span class="pl-en">setGFXFont</span>(<span class="pl-k">const</span> GFXfont *f = <span class="pl-c1">NULL</span>); 
đặt font GFX sử dụng
<span class="pl-k">void</span> <span class="pl-en">drawGFXText</span>(<span class="pl-c1">int16_t</span> x, <span class="pl-c1">int16_t</span> y, String s, <span class="pl-c1">uint16_t</span> color);
xuất ra màn hình dòng text với font GFX
  • x,y: tọa độ góc bên trái phía dưới của đoạn text

Muốn sử dụng font GFX thì việc đầu tiên chúng ta phải khai báo vị trí của font, ở đây các bạn lưu ý ở trong thư viện của module Lcd mình đã nêu ở đầu bài sẽ có 1 thư mục fonts, đó chính là các fonts GFX có trong thư viện, chúng ta có thể lấy luôn các font có trong thư viện

 

VD Code: mình muốn sử dụng font FreeSans9pt7b.h đặc điểm của font này là có size chữ là 9pt

#include "SPI.h"
#include "TFT_22_ILI9225.h"
 
#define TFT_RST 8
#define TFT_RS 9
#define TFT_CS 10 // SS
#define TFT_SDI 11 // MOSI
#define TFT_CLK 13 // SCK
#define TFT_LED 3 // 0 if wired to +5V directly
 
#define TFT_BRIGHTNESS 200 
 
 #include <../fonts/FreeSans9pt7b.h>  // khai báo font chữ có trong thư múc fonts
 
TFT_22_ILI9225 tft = TFT_22_ILI9225(TFT_RST, TFT_RS, TFT_CS, TFT_LED, TFT_BRIGHTNESS);
 
void setup() {
  tft.begin();
 
}
 
void loop() {
    tft.setGFXFont(&FreeSans9pt7b); // đặt font sử dụng
    tft.drawGFXText(0, 100, "lamchucongnghe", COLOR_RED);// in ra dòng chữ lamchucongnghe
 
}

Hạn chế: tại vì độ cao của chữ trong dòng text được đặt mặc định theo font chúng ta sử dụng(độ cao của font được tính từ góc dưới cùng bên trái kí tự đầu tiên của đoạn text) nên sẽ có vài trường hợp chàn chữ ra ngoài mép của màn

Ở đây mình in ra dòng chữ VN tại một vị trí bất kì nhưng lại bị chàn mất phần trên ra ngài màn hình để khắc phục tình trạng này, chúng ta sẽ cần đến câu lệnh:

void getGFXTextExtent(String str, int16_t x, int16_t y, int16_t *w, int16_t *h);
  • dùng để nhận chiều rộng và chiều cao của chuỗi văn bản với phông chữ GFX hiện tại
    vậy ta có thể lấy được chiều cao h của chuỗi văn bản
    từ đó ta sẽ chỉnh sửa code như sau
  • str: chuỗi chúng ta cần nhập
  • x,y tọa độ của Text chúng ta cần đặt
  • w,h là chiều rộng chiều dài của font chữ tác dụng lên đoạn văn bản

như vậy chúng ta code như sau:

#include "SPI.h"
#include "TFT_22_ILI9225.h"
 
#define TFT_RST 8
#define TFT_RS 9
#define TFT_CS 10 // SS
#define TFT_SDI 11 // MOSI
#define TFT_CLK 13 // SCK
#define TFT_LED 3 // 0 if wired to +5V directly
 
#define TFT_BRIGHTNESS 200 // Initial brightness of TFT backlight (optional)
 
TFT_22_ILI9225 tft = TFT_22_ILI9225(TFT_RST, TFT_RS, TFT_CS, TFT_LED, TFT_BRIGHTNESS);
 
#include <../fonts/FreeSans24pt7b.h>
int x = 0, y = 0, w, h; // khai báo vị trí ddwatj chuổi trên LCD
 
void setup() {
  // put your setup code here, to run once:
 
  tft.begin();
 
}
 
void loop() {
  tft.setGFXFont(&FreeSans24pt7b); // cài đặt font sẽ sử dụng
  tft.getGFXTextExtent("ABCD", x, y, &w, &h); // lấy chiều dài và chiều rộng của đoạn text sau khi sử dụng font
  y = h; // Đặt vị trí y thành chiều cao chuỗi
  tft.drawGFXText(x, y, "ABCD", COLOR_RED); // in chuỗi
 
}

kết luận

Vậy mình đã hướng dẫn các bạn các thao tác cơ bản với màn hình lcd TFT , chúc các bạn thành công

 

Bình luận
Nội dung này chưa có bình luận, hãy gửi cho chúng tôi bình luận đầu tiên của bạn.
VIẾT BÌNH LUẬN