[디스플레이/터치스크린] 2.4인치TFT Touchscreen LCD 쉴드(ST7781 or ILI9325)

2.4" TFT Touchscreen LCD쉴드를 가지고 다양한 그래픽/문자를 출력하며 터치센서를 활용한다

 

▶ 이 가이드를 따라하면

- ST7781 or ILI9325/ILI9328방식의 컨트롤러를 쓰는 TFT LCD를 제어한다

- 터치 스크린 센서를 통해 값을 입력받아 활용한다.

 

▶ 먼저 읽으면 좋은 글

- 라이브러리 설치 방법 : http://bbangpan.tistory.com/1

 

▶ 부품 설명 및 회로 구성

2.4" TFT 터치스크린 LCD의 중국산은 $5 라는 놀라운 가격으로 공급된다. 240x320해상도를 지원하는 이 LCD 거기다가 터치센서까지 지원한다. 다만 압력방식이라서 우리가 스마트폰에 쓰는 센서의 품질과는 좀 떨어진다. 밝기도 밝은 곳에서 보기에는 좀 약하지만 여하튼 가격대 성능비는 꽤 괜찮다.

<2.4" TFT Touch LCD 앞면>

<2.4" TFT Touch LCD 뒷면>

<UNO에 장착한 화면>

관련 하여 추천 강좌는 http://www.smokeandwires.co.nz/blog/a-2-4-tft-touchscreen-shield-for-arduino/ 과 http://misc.ws/2013/11/08/touch-screen-shield-for-arduino-uno/ 두개이다. 소스의 출처이기도 한데, 더 궁금해지면 확인하자.

참조로 프로그램 업로드 시, 업로드 실패하면(업로드시 멈춤현상), 쉴드를 제거하고 보드만 USB에 연결 후 프로그램 업로드 하고, 다시 쉴드를 장착 및 구동하기 바란다.(소비 전력이슈가 간혹 발생하는 것으로 추정된다)

▶ 라이브러리 설치

TFT LCD와 터치스크린 센서 모두 사용해 보기 위해서는 3개의 라이브러리 설치가 필요하다. 각각 버전 호환성이 중요하므로 최신 버전을 받아 설치하자.

https://github.com/adafruit/Touch-Screen-Library

https://github.com/adafruit/Adafruit-GFX-Library

https://github.com/Smoke-And-Wires/TFT-Shield-Example-Code

를 모두 다운받아 라이브러리 폴더에 반영하자. Adafruit-GFX-Library는 그래픽을 구현하기 위한 라이브러리이고, Touch-Screen-Library는 터치스크린 센서를 위한 것이다. 맨 마지막의 TFT-Shield-Example-Code는 구동 예제로서, 설치 후 Sketch의 메인메뉴 파일->예제->SWTFT-Shield에 보면 예제를 구동할 수 있다.(TFT LCD의 경우에는 Adafruit TFT-LCD등 많은 예제들을 그대로 사용하여 구동가능 하나 터치스크린은 다소 까다롭다.)

 

▶ 소스 코드 입력 및 구동

Arduino Sketch 1.6.1버전에 UNO상에서 구동하였다. Arduino Mega에서 사용할 경우에는 핀 변환이 필요하다고 알려져 있으니 별도 확인이 필요하다.

첫번째로 SWTFT-Shield 라이브러리 예제인 graphictest를 구동해보자. 텍스트 표기와 몇가지 도형 및 선들을 표기하는 예제이고, 소스코드 내부를 보면 어떤 형태로 응용가능한지 파악하는 것이 크게 어렵지 않다.

<SWTFT-Shield의 graphictest선택>

<graphictest 구동예제/다양한 텍스트와 그래픽 출력이 가능하다>

두번째로는 터치스크린을 통한 그림 그리기 앱이다. tftpaint 예제를 골라 구동해보자. 구동이 되면 색을 몇가지 선택해 화면상에 그림을 그릴 수 있다. 다만 그림의 선은 이어지지 않고 점이 찍히는 형태이다. 부드럽게 이어지기 위해서는 별도 처리가 필요하다.

<graphictest바로 아래 위치한 라이브러리 예제로 tftpaint를 선택하여 구동>

tftpaint의 경우는 좌표가 조금 맞지 않아서 어긋남을 조절해줄 필요가 있는데, 소스상의 아래 값이 X,Y의 최저/최대 좌표이다.

 

#define TS_MINX 150

#define TS_MINY 120

#define TS_MAXX 920

#define TS_MAXY 940

 

이 실제 좌표를 알아내기 위해서는 해당 소스 중간에 아래 좌표출력 코드 주석을 풀자. 다시 업로드 후 시리얼 모니터상에서 터치 스크린의 터치시 좌표와 압력 등을 확인할 수 있다.

 

Serial.print("X = "); Serial.print(p.x);

Serial.print("\tY = "); Serial.print(p.y);

Serial.print("\tPressure = "); Serial.println(p.z);

 

<시리얼 모니터로 좌표/압력 확인 화면>

터치스크린을 누를 시 해당 좌표와 압력이 전달되는 형태이다. 실제로 구동하면 LCD의 배치상 좌표가 맞지 않을 수 있다. 필자의 경우에는 아래와 같이 빨간색 코드를 추가하여 좌표 변환을 통하여 X/Y좌표계가 뒤바뀐 것을 바로잡았다.

 

TSPoint p = ts.getPoint();

digitalWrite(13, LOW);

 

int tmp;

tmp = TS_MAXX - p.x + TS_MINX;

p.x = TS_MAXY - p.y + TS_MINY;

p.y = tmp;

 

// if sharing pins, you'll need to fix the directions of the touchscreen pins

//pinMode(XP, OUTPUT);

pinMode(XM, OUTPUT);

pinMode(YP, OUTPUT);

//pinMode(YM, OUTPUT);

 

상기 예제를 활용하면 다양하게 디스플레이를 활용하고 터치센서도 이용이 가능하다.

 

▶ 구매 가이드

2.4" TFT Touchscreen LCD : http://www.aliexpress.com/wholesale?catId=0&initiative_id=SB_20150418090356&SearchText=2.4+touchscreen+lcd+arduino

 

▶ 강의 키워드

2.4 inch TFT touch LCD screen shield, 2.4인치 터치 스크린 TFT LCD, 터치 스크린, touchscreen, TFT LCD, ST7781, ILI9325