Arduino MCUFRIEND 2.4Inch TFT LCD 텍스트 출력
MCU FRIEND의 2.4Inch TFT LCD에 텍스트를 출력하는 기초적인 방법을 설명
합니다.사전 참고 사항
이 포스트에서는 MCUFRIEND의 2.4Inch TFT LCD를 사용하였습니다. MCUFRIEND의 장치 설정을 위해 MCUFRIEND_kbv 라이브러리를 사용합니다. MCUFRIEND_kbv의 디자인 기능은 Adafruit_GFX 라이브러리를 참조하여 사용합니다. 특별한 경우가 아니면, 다른 제조사의 TFT LCD를 사용하는 경우 드라이버 초기화하는 라이브러리만 다르고, 디자인 기능은 아래 코드와 동일하게 사용할 수 있을 것이라 예상됩니다. MCUFIREND의 초기 설정 관련 코드 설정은 이전 포스트를 참조해주세요.
MCUFRIEND 2.4inch TFT LCD 초기화 설정 및 Hello World 출력
아두이노 #56 2.4inch TFT LCD 초기화 설정 및 시작하기
Arduino TFT LCD 초기화 설정 및 Hello World! 출력 이번 포스트에서는 TFT LCD를 사용하기 위한 초기화 코드에 대해 알아보고, 간단하게 Hello World! 문자를 출력하는 법 을 소개합니다. MCU FRIEND 2.4inch TF..
juahnpop.tistory.com
개요
아래 항목은 TFT LCD에 문자열을 출력하기 위해 기본적으로 필요한 항목입니다. TFT LCD가 아니고, 다른 디스플레이장치이더라도 아래 항목의 기능 구현 방법만 정리되어 있으면 쉽게 코드 작성을 할 수 있을 것이라 생각됩니다.
- 텍스트 출력
- 커서 설정
- 텍스트 크기
- 텍스트 색상
- 폰트 선택
텍스트 출력 함수
구문
텍스트 출력 함수는 아두이노의 Serial에 사용되는 print(), println(), write() 사용법과 동일합니다. 텍스트를 출력하는 경우 커서는 문자열 길이에 따라 자동적으로 이동합니다.
시리얼 송신 관련 자세한 설명은 아래의 링크를 참조해주세요.
아두이노 강좌 #5 시리얼 통신 2. UART 초기화 및 송신 프로그래밍
아두이노 시리얼(UART) 통신 출력 지난 포스트에서는 아두이노의 시리얼 통신이 무엇인지 알아보고, 간단히 아두이노 -> PC 로 문자열을 출력 하는 방법에 대해 알아보았습니다. 본 포스트에서는
juahnpop.tistory.com
예시
아래와 같이 문자열 출력 비교, 소수점 출력, 진수표현, print()/write() 차이를 위한 테스트 코드를 작성하였습니다.
#include "Adafruit_GFX.h"
#include "MCUFRIEND_kbv.h"
//MCUFRIEND_kbv tft(A3, A2, A1, A0, A4);
MCUFRIEND_kbv tft;
void setup()
{
uint16_t ID = tft.readID();
tft.reset();
tft.begin(ID);
tft.setRotation(0);
}
void loop()
{
int iNum = 64;
float fNum = 3.141592;
tft.fillScreen(TFT_BLACK);
tft.setTextColor(TFT_WHITE);
tft.setTextSize(1);
tft.print("Hello world!\n");
tft.println("Hello world!");
tft.write("Hello world!\n");
tft.println("");tft.println("");
tft.println("print(3.141592, Option); Float..");
tft.print("- Option : None -> ");
tft.println(fNum, 2); // 소수점 2자리
tft.print("- Option : 4 -> ");
tft.println(fNum, 4); // 소수점 4자리
tft.println("");tft.println("");
tft.println("print(16, Option); Number Notation..");
tft.print("- Option : None -> ");
tft.println(iNum); // 10진수 출력
tft.print("- Option : BIN -> ");
tft.print("0b");
tft.println(iNum, BIN); // 2진수로 출력
tft.print("- Option : HEX -> ");
tft.print("0x");
tft.println(iNum, HEX); // 16진수로 출력
tft.println("");tft.println("");
tft.println("String Output Compare");
tft.print("print(64) : ");
tft.print(64); // print() : 64를 문자열 "64" 로 출력
tft.println();
tft.print("write(64) : ");
tft.write(64); // wrtie() : ascii '64'번 값을 출력 -> A
tft.println();
while(1);
}위 코드를 실행하면 아래와 같이 TFT LCD 창에 출력됩니다.
커서 지정 / 현재 커서 읽기
구문
아래는 커서를 설정하는 함수입니다. int16_t 데이터형의 좌표를 x, y에 입력하면 됩니다.
예시
커서 지정 및 현재 커서 불러오기를 테스트하기 위한 코드입니다.
#include "Adafruit_GFX.h"
#include "MCUFRIEND_kbv.h"
//MCUFRIEND_kbv tft(A3, A2, A1, A0, A4);
MCUFRIEND_kbv tft;
void setup()
{
uint16_t ID = tft.readID();
tft.reset();
tft.begin(ID);
tft.setRotation(0);
}
void loop()
{
int16_t x;
int16_t y;
tft.fillScreen(TFT_BLACK);
tft.setTextColor(TFT_WHITE);
tft.setTextSize(2);
for(int i = 0 ; i < 320 ; i += 50){
tft.setCursor(0, i);
tft.println("Hello World!");
x = tft.getCursorX();
y = tft.getCursorY();
tft.print(x);
tft.print(",");
tft.println(y);
}
while(1);
}위 코드 실행화면은 아래와 같습니다. 아래 결과로 부터 Default 폰트 사이즈 높이는 8 Pixel인 것을 확인할 수 있습니다. 위 코드에서 txt.setTextSize(2)는 글자 크기를 2배로 설정하는 메소드입니다.
텍스트 크기
구문
텍스트 크기는 아래의 setTextSize() 메소드를 사용하면 쉽게 설정 가능합니다.
예시
아래 코드는 텍스트 사이즈 테스트를 위한 코드입니다.
#include "Adafruit_GFX.h"
#include "MCUFRIEND_kbv.h"
MCUFRIEND_kbv tft;
void setup()
{
uint16_t ID = tft.readID();
tft.reset();
tft.begin(ID);
tft.setRotation(0);
}
void loop()
{
int16_t x;
int16_t y;
tft.fillScreen(TFT_BLACK);
tft.setTextColor(TFT_WHITE);
for(int i = 1 ; i < 6 ; i++){
tft.setTextSize(i);
tft.println("Hello");
x = tft.getCursorX();
y = tft.getCursorY();
tft.setCursor(x,y+10);
}
while(1);
}아래 사진의 위 코드 실행 결과입니다.
아래의 코드는 문장과 문장 사이 간격을 10 pixel로 설정하는 코드입니다.
x = tft.getCursorX();
y = tft.getCursorY();
tft.setCursor(x,y+10);
텍스트 색상
색상 포맷
색상은 RGB565 포맷을 사용합니다. RGB565는 Red 5Bit, Green 6Bit, Blue 5Bit으로 색을 표현합니다. 아래 링크는 일반적인 RGB 컬러를 RGB565로 변환해주는 링크입니다. 이곳뿐만이 아니라 구글에 검색하면 다양한 방법 또는 웹 계산기들이 있습니다. (※ Adafruit_GFX.h 코드 내부를 보니 RGB565 로 입력받아 RGB555로 변환해서 사용하네요.)
👉 RGB -> RGB565 변환 : www.rinkydinkelectronics.com/calc_rgb565.php
MCUFRIEND_kbv 라이브러리를 사용하는 경우 MCUFRIEND_kbv.h 파일 내에 자주 사용하는 컬러들이 매크로로 정의되어 있습니다. 코드 작성 시 매크로로 지정된 이름을 보기 위해 MCUFRIEND_kbv.h 파일에 들어갈 수 없으니 코드 상단 선언부에 선언 후 사용하면 편리하게 사용할 수 있습니다.
#define TFT_BLACK 0x0000 /* 0, 0, 0 */
#define TFT_NAVY 0x000F /* 0, 0, 128 */
#define TFT_DARKGREEN 0x03E0 /* 0, 128, 0 */
#define TFT_DARKCYAN 0x03EF /* 0, 128, 128 */
#define TFT_MAROON 0x7800 /* 128, 0, 0 */
#define TFT_PURPLE 0x780F /* 128, 0, 128 */
#define TFT_OLIVE 0x7BE0 /* 128, 128, 0 */
#define TFT_LIGHTGREY 0xC618 /* 192, 192, 192 */
#define TFT_DARKGREY 0x7BEF /* 128, 128, 128 */
#define TFT_BLUE 0x001F /* 0, 0, 255 */
#define TFT_GREEN 0x07E0 /* 0, 255, 0 */
#define TFT_CYAN 0x07FF /* 0, 255, 255 */
#define TFT_RED 0xF800 /* 255, 0, 0 */
#define TFT_MAGENTA 0xF81F /* 255, 0, 255 */
#define TFT_YELLOW 0xFFE0 /* 255, 255, 0 */
#define TFT_WHITE 0xFFFF /* 255, 255, 255 */
#define TFT_ORANGE 0xFDA0 /* 255, 180, 0 */
#define TFT_GREENYELLOW 0xB7E0 /* 180, 255, 0 */
#define TFT_PINK 0xFC9F구문
텍스트 컬러 설정은 RGB565 포맷을 사용하여 쉽게 적용 가능합니다.
예시
아래 코드는 텍스트 컬러를 테스트하기 위한 코드입니다.
#include "Adafruit_GFX.h"
#include "MCUFRIEND_kbv.h"
#define BLACK 0x0000 /* 0, 0, 0 */
#define NAVY 0x000F /* 0, 0, 128 */
#define DARKGREEN 0x03E0 /* 0, 128, 0 */
#define DARKCYAN 0x03EF /* 0, 128, 128 */
#define MAROON 0x7800 /* 128, 0, 0 */
#define PURPLE 0x780F /* 128, 0, 128 */
#define OLIVE 0x7BE0 /* 128, 128, 0 */
#define LIGHTGREY 0xC618 /* 192, 192, 192 */
#define DARKGREY 0x7BEF /* 128, 128, 128 */
#define BLUE 0x001F /* 0, 0, 255 */
#define GREEN 0x07E0 /* 0, 255, 0 */
#define CYAN 0x07FF /* 0, 255, 255 */
#define RED 0xF800 /* 255, 0, 0 */
#define MAGENTA 0xF81F /* 255, 0, 255 */
#define YELLOW 0xFFE0 /* 255, 255, 0 */
#define WHITE 0xFFFF /* 255, 255, 255 */
#define ORANGE 0xFDA0 /* 255, 180, 0 */
#define GREENYELLOW 0xB7E0 /* 180, 255, 0 */
#define PINK 0xFC9F
MCUFRIEND_kbv tft;
void setup()
{
uint16_t ID = tft.readID();
tft.reset();
tft.begin(ID);
tft.setRotation(0);
}
void loop()
{
tft.fillScreen(BLACK);
tft.setTextSize(2);
tft.setTextColor(WHITE);
tft.println("Hello");
moveCursor(0,10);
tft.setTextColor(PURPLE);
tft.println("Hello");
moveCursor(0,10);
tft.setTextColor(CYAN);
tft.println("Hello");
moveCursor(0,10);
tft.setTextColor(ORANGE);
tft.println("Hello");
while(1);
}
void moveCursor(int16_t xAxis, int16_t yAxis){
int16_t x;
int16_t y;
x = tft.getCursorX();
y = tft.getCursorY();
tft.setCursor(x+xAxis,y+yAxis);
}아래 사진은 위 코드의 출력 화면입니다.
폰트
폰트 종류
기본 폰트 이외의 폰트를 사용하고 싶은 경우 폰트 데이터가 저장된 .h 파일을 선언부에 추가해야 합니다.
MCUFRIEND_kgv.h 라이브러리가 설치된 경로의 FreeDefaultFonts.h 파일에 3개의 폰트를 제공하고 있습니다.
- FreeSmallFont : 기본 폰트
- FreeBigFont : 큰 글자 폰트
- FreeSevenSegNumFont : 7-SEGMENT 모양의 폰트로 0 ~ 9까지의 숫자만 지원
해당 파일의 경로를 알고 싶으신 분은 Everything 프로그램을 사용하면 파일명으로 쉽게 경로를 찾을 수 있습니다.
빠른 파일 검색 프로그램 : Everything 사용법 및 유용한 설정
(무료) Everything 빠른 파일 검색 프로그램 : 네트워크 드라이브 추가, 유용한 옵션, 검색 안될 때
윈도우 필수 추천 프로그램 : Everything 윈도우에서 별도의 검색 프로그램을 사용하지 않거나, Everything 을 사용해 보지 않으신 분이라면 강력하게 추천하는 프로그램입니다. 본 포스트에서는 Everht
juahnpop.tistory.com
Ardafruit_GFX.h 라이브러리가 설치된 경로의 Font 폴더에 가면 아래와 같이 총 48개의 폰트가 있습니다. 적용하고 싶은 폰트의 파일명으로 폰트 적용 가능합니다.
구문
텍스트를 출력하기 전에 아래의 tft.setFont() 메서드를 사용하여 폰트 지정이 가능합니다.
예시
아래 코드는 폰트 적용을 테스트하기 위한 코드입니다.
#include "Adafruit_GFX.h"
#include "MCUFRIEND_kbv.h"
#include "FreeDefaultFonts.h"
#include "Fonts/FreeSans9pt7b.h"
#include "Fonts/FreeSans12pt7b.h"
MCUFRIEND_kbv tft;
void setup()
{
uint16_t ID = tft.readID();
tft.reset();
tft.begin(ID);
tft.setRotation(0);
}
void loop()
{
tft.fillScreen(TFT_BLACK);
tft.setTextSize(1);
moveCursor(0,10);
tft.setFont(&FreeSmallFont);
tft.println("Hello!");
moveCursor(0,10);
tft.setFont(&FreeBigFont);
tft.println("Hello!");
moveCursor(0,10);
tft.setFont(&FreeSans9pt7b);
tft.println("Hello!");
moveCursor(0,10);
tft.setFont(&FreeSans12pt7b);
tft.println("Hello!");
moveCursor(0,30);
tft.setFont(&FreeSevenSegNumFont);
tft.println("0123456");
while(1);
}
void moveCursor(int16_t xAxis, int16_t yAxis){
int16_t x;
int16_t y;
x = tft.getCursorX();
y = tft.getCursorY();
tft.setCursor(x+xAxis,y+yAxis);
}아래 사진은 위 코드를 실행한 결과입니다.
끝까지 읽어 주셔서 감사합니다^^
'Embedded > Arduino' 카테고리의 다른 글
| 아두이노 #56 2.4inch TFT LCD 초기화 설정 및 시작하기 (0) | 2020.12.15 |
|---|---|
| 아두이노 #55-1 32x8 LED Matrix 시리얼 통신으로 텍스트 스크롤하기 - 라이브러리 없이 (6) | 2020.12.04 |
| 아두이노 #55 MAX7219 32x8 LED 매트릭스 스크롤 원리와 라이브러리 없이 구현 예시 (0) | 2020.12.03 |
| 아두이노 #54 32x8 LED Matrix Font 데이터 참조로 문자 표시 및 메모리 문제 해결 (0) | 2020.12.02 |
| 아두이노 #53 MAX7219 32x8 LED Matrix 문자 표시하기 기초 - 라이브러리 없이 코드 작성 (0) | 2020.12.02 |