아두이노 스마트 미러 만들기 #3

진짜를 만들어보자 - 3. LCD 연결 및 Wi-Fi를 통한 날씨 정보 가져오기

우선 지난 포스팅에 언급한 waveshare사의 LCD 라이브러리에서 똑바로 선 형태의 폰트를 출력할 수
있도록 수정한 함수를 올린다.

//display a char at the specified position on lcd.
void TFT::lcd_display_char2(uint16_t hwXpos, //specify x position.
 uint16_t hwYpos, //specify y position.
 uint8_t chChr,   //a char is display.
 uint8_t chSize,  //specify the size of the char
 uint16_t hwColor) //specify the color of the char
{      	
	uint8_t i, j, chTemp;
	uint16_t hwXpos0 = hwXpos, hwColorVal = 0;

	if (hwXpos >= LCD_WIDTH || hwYpos >= LCD_HEIGHT) {
		return;
	}

	int width = 8;  // 폰트의 가로 폭
	if (SEGMENT18_XXL == chSize) { 
		width = 16;
	} else if (DOTMATRIX_M_SLASH == chSize) {
		width = 8;
	}

	hwColorVal = hwColor;
   
	for (i = 0; i < chSize; i ++) {     	
		if (SEGMENT18_XXL == chSize) { 
			chTemp = pgm_read_byte(&segment18_XXL[chChr - 0x20][i]);

			if (i != 0 && (i % 4) == 0) {
				hwYpos ++;
			}
		} else if (DOTMATRIX_M_SLASH == chSize) { 
			chTemp = pgm_read_byte(&DotMatrix_M_Slash[chChr - 0x20][i]);

			if (i != 0 && (i % 2) == 0) {
				hwYpos ++;
			}
		}

		for (j = 0; j < width; j ++) {
			if (chTemp & 0x80) {
				lcd_draw_point(hwXpos, hwYpos, hwColorVal);
			}
			chTemp <<= 1;
			hwXpos ++;

			if (hwXpos > hwXpos0 + (width * 2 - 1)) {
				hwXpos = hwXpos0;
			}
		}  	 
	} 
}

특별히 수정할 내용은 없으나 폰트의 크기에 따라 width를 조정해야 한다.

---

LCD와 Wi-Fi 센서 연결

일단 지난 번 waveshare LCD에 UTFT 폰트를 쓸수 있도록 손을 써뒀지만 두 가지 문제가 있었다.
첫 번째는 화면 크기가 작다는 것. 2.8인치의 크기인데 내가 가진 하프 미러의 가장 작은 사이즈가
A4지 절반 크기라서 2.8인치로는 폰트 크기를 크게할 경우 보여줄 수 있는 정보가 얼마 없었다.
다음은 정말 중요한 이유로 이 LCD가 쉴드 형태로 LCD를 장착할 경우 아두이노에서 사용 가능한
포트가 남지 않는다는 것이다. 뭐 아두이노 메가를 사용하면 되겠지만 이 제품은 호환 기종에 메가가
빠져있어서 메가에서는 장착해서 바로 사용을 못한다. 아마도 라이브러리에서 설정을 조금 변경하면
될 것 같지만 이게 아니더라도 할일이 태산인데…-.-

그래서 화면 크기도 좀 키우고 할 겸 이번엔 ITEAD STUDIO라는 곳에서 나온 4.3인치와 3.2인치
LCD를 구매했다. UTFT 라이브러리를 사용하는 놈이라 폰트 사용도 쉬운 장점이 있었다.

그런데 이놈도 제대로 사용을 하기 위해서는 별도의 쉴드를 사용해야 했다. 더군다나 이놈이 사용하는
쉴드는 아두이노 메가에서도 여분의 포트를 남기지 않고 모두 덮어버린다…ㅠ.ㅠ (포장은 모두 깔끔해서
좋다~)

이렇게 되면 큰 문제가 생긴다. 라즈베리파이의 경우 Wi-Fi, 이더넷, USB 등등 그 자체로 하나의 PC
와 같기 때문에 별도로 연결시켜줄 것이 없으나 아두이노는 본체가 달랑 컨트롤러 하나이기에 Wi-Fi
모듈도 붙여줘야 하고, 시계를 표현하기 위해 시계 모듈도 따로 붙여줘야 하고 그밖에 기능을 추가
하고자 할 때마다 센서 모듈을 별도로 연결해야 하기에 포트가 모자라면 심각한 제약이 발생하는 것이다.

그렇기 때문에 일단 쉴드를 사용하지 않고 LCD를 직접 아두이노 메가에 연결할 수 있는 방법을 찾아야 했다.
데이터 시트를 자세히 보면 아마도 방법이 있겠지만 문돌이 지식이야 뻔한 것이고 게다가 데이터 시트가 

모두 영어로 되어있는지라 일단은 구글에서 검색을 해야 했다. 그리고 다행히 아래 링크된 사이트를 찾아

무사히 연결을 할 수있었다. 물론 연결을 하고 난 뒤의 모양새는 조금 심란하다…ㅠ.ㅠ

LCD 연결 참고 사이트 : https://forum.arduino.cc/index.php?topic=101029.0

일단 위 이미지에서 보듯이 총 40개의 핀이 있고 이 중에 사용하지 않는 핀을 7개정도 빼면 33개 그리고
SD카드나 터치스크린 기능을 사용하지 않을 것이면 여기서 또 10개정도는 더 포트를 절약할 수 있다.
나는 SD카드를 제외한 나머지 핀들을 모두 연결하였다.

그리고 다행히도 정상적으로 작동을 하였다.

다음은 출력에 필요한 정보를 가져오기 위해 Wi-Fi 센서를 연결하였다. 이 부분은 워낙 자료가 많으니
생략을 한다. LCD와 Wi-Fi 모두 아두이노로부터 전기를 공급받아야 하기에 3.3V포트와 GND 포트는
빵판을 이용하여 공유하였다(LCD와 Wi-Fi 모두 3.3V를 필요로 한다).

Wi-Fi 모듈 역시 정상 작동 확인 완료!!!

openweathermap API 호출

하드웨어 준비는 마무리 되었으니 이제 인터넷에서 정보를 가져와서 LCD에 출력해주면 된다.
말은 참 쉽다…-.- 일단 Wi-Fi 센서의 경우 일전에 인터넷을 통해 LED 점등 테스트를 하다가 실패한
적이 있다. 아마도 스케치 코드라든가 센서 연결등의 문제라기보다는 공유기를 통해 Wi-Fi 센서로
연결하는데 문제가 있었던 듯하다. 하지만 이번에는 공유기를 통해 외부 웹사이트를 호출하는 것이므로
아마도 쉽게 될 것이라고 생각했다.

우선은 AT 명령어를 이용하여 외부 인터넷에 접속하고 응답을 확인하는 것은 무난히 성공을 하였다.
하지만 AT 명령어를 직접 사용하는 것보다는 뭔가 쉽게 접근 가능한 라이브러리가 있을 것으로 생각
되었다. 그런데 검색을 해봐도 대부분이 Wi-Fi 쉴드 사용을 기준으로 SoftwareSerial을 이용하는
라이브러리밖에 없었다. 나는 아두이노 메가를 사용 중이었고 Wi-Fi 센서는 Serial3에 연결을 해서
이 상태로 사용할 수 있는 라이브러리가 필요했다. 검색 끝에 드디어 아래의 라이브러리를 찾았다.

ESP8266 라이브러리 : https://github.com/itead/ITEADLIB_Arduino_WeeESP8266

사용법도 그리 어렵지 않아 쉽게 코드를 짜고 인터넷 접속 확인을 할 수 있었다.

다음은 어디서 어떤 정보를 가져올 것인가를 선택해야 했다. 우선은 가장 만만한 날씨 정보를 가져오기로
했다. 처음에는 기상청의 오픈 API를 이용하려고 생각했으나 가입이 필요하고 가입하는 과정에서 내가
사용하는 MAC에서는 뭔가 제대로 진행되지 않는 부분이 있었다. 도대체 언제까지 윈도우와 IE에 발목을
잡혀있어야 하는 것인지…-.-

그래서 가입과 사용에 별다른 제약이 없는 openweathermap이라는 서비스를 이용하기로 하였다.
아직은 제작 진행 중이니 이정도면 테스트하기에는 충분하다고 판단되었다. 가입하고 APP ID를 받아
API 호출을 테스트 해보았다. 아래와 같이 날씨 정보를 잘 받아왔다^^

{{“coord":{"lon":126.98,"lat":37.57},"weather":[{"id":721,"main":"Haze","description":"haze","icon":"50d"},{"id":701,"main":"Mist","description":"mist","icon":"50d"}],"base":"stations","main":{"temp":2.43,"pressure":1012,"humidity":74,"temp_min":1,"temp_max":3},"visibility":10000,"wind":{"speed":2.1,"deg":250},"clouds":{"all":90},"dt":1486282800,"sys":{"type":1,"id":8519,"message":0.0111,"country":"KR","sunrise":1486247522,"sunset":1486285237},"id":1835848,"name":"Seoul","cod":200}

다음은 이렇게 JSON으로 받아온 정보를 보기 좋게 LCD에 출력을 하는 일이 남았다.
JAVA라면 순식간에 해치울텐데…이거 스케치에서는 어떻게 해야 하나…ㅠ.ㅠ
하지만 역시 세상에는 많은 천사들이 있다. 열심히 구글을 검색한 결과 역시 아래와 같은 라이브러리를
찾아냈고 아주 쉽게 처리할 수 있었다.

ArduinoJson 라이브러리 : https://github.com/bblanchon/ArduinoJson

그리고 비록 아직은 뭔가 모자라지만 아래와 같이 정보를 출력할 수 있게 되었다.

첩첩 산중…

사실 처음 아두이노로 스마트 미러를 만들어보고자 생각했을 때는 라즈베리파이로 만든 스마트 미러 정도는
만들어보려고 시작을 했다. 심지어는 음성 인식까지…하지만 아두이노가 얼마나 low level의 하드웨어인지
제대로 인식을 못하고 있었던 듯하다. 하드웨어 연결, 인터넷 연결, 입력과 출력…하나 하나가 모두 엄청나게
손이 많이 가는 작업들이었다. 개발자 입장에서 말하자면 java로 짤 코드를 어셈블리로 짜고 있는 느낌이랄까
…-.- 게다가 아직은 폰트를 영문폰트밖에 구하지 못해서 한글 표현이 또 걱정이다.

그래도 우여곡절 끝에 인터넷에서 날씨 정보를 가져와서 LCD에 출력하는 기능까지 구현을 했다. 아직도 
갈 길이 멀지만 일단 칼을 뽑았으니 무라도 잘라보련다.

전체적인 계획은 아두이노 메가 2대를 이용하여 한 대에는 날씨와 날짜 및 시간 정보를 보여주고 다른
한 대를 통해서는 뉴스라든지 현재 내가 개발중이 ToDo 서비스로부터 할 일 정보를 가져와서 보여줄
예정이다. 물론 각각의 아두이노에서 별도로 Wi-Fi를 통해 정보를 가져오는 것은 뭔가 비효율적이라
생각되어 첫 번째 아두이노에서 모든 정보를 가져오고 아두이노간의 시리얼 통신을 통해 다른 한 대로
정보를 넘겨 처리할 생각이다. 과연 얼마나 잘 진행될 수 있을지 자못 궁금하다…-.-

다음 시간에는 시계 모듈을 이용하여 오늘 보여준 날씨 정보 하단에 날짜와 시간을 출력해보고자 한다.
또 얼마나 시간이 걸릴지… 진행되는 내용의 소스코드는 아래 링크에 공유한다. 나는 나쁜 개발자라
주석같은 거 없당~^^

소스코드 : https://github.com/mazdah/ArduinoSamples