이전 기술 문서인 "Smart Display RS485 Introduction"에서는 RS485와 Modbus 프로토콜의 기본 개념을 소개했습니다. 이번 문서에서는 여러 페이지로 구성된 예제를 통해 Smart Display 개발 시 자주 활용되는 다음과 같은 기능과 구현 방법을 자세히 설명합니다.

• Button widget을 이용한 페이지 전환 방법
• 페이지 전환 후 widget 값 업데이트 방법
• 서로 다른 길이의 부저음을 출력하는 방법
• Graph widget 사용 방법

 

준비물

• RS485 인터페이스를 지원하는 Smart Display. 본 예제에서는 3.5" Smart Display를 사용합니다.
• Arduino (Uno 또는 Mega2560)
• Arduino RS485 확장 보드 (Link to DFRobot)
• 가변 저항(VR)

 

배선

• 가변 저항: Vcc는 5V에, GND는 GND에, 출력 단자는 Arduino A0에 연결합니다.
• RS485 확장 보드의 A 단자를 Smart Display RS485+에 연결합니다.
• RS485 확장 보드의 B 단자를 Smart Display RS485-에 연결합니다.

 

예제 구성

이 프로젝트는 3개의 페이지로 구성되며, Button widget을 이용해 페이지를 전환할 수 있습니다. 각 페이지의 구성과 기능은 다음과 같습니다.

페이지 1:
오른쪽에는 다음 페이지로 이동하는 버튼이 있으며, 그 아래에는 화면 밝기를 조절할 수 있는 Horizontal Slider가 있습니다. 미리보기 화면은 다음과 같습니다.

페이지 2:
왼쪽에는 이전 페이지로 돌아가는 버튼이 있고, 오른쪽에는 다음 페이지로 이동하는 버튼이 있습니다. 하단에는 짧은 음, 중간 길이의 음, 긴 음을 각각 출력할 수 있는 3개의 부저 버튼이 있습니다.

페이지 3:
왼쪽에는 이전 페이지로 돌아가는 버튼이 있습니다. 가변 저항을 사용해 아날로그 입력을 시뮬레이션하고, 그 결과를 Graph widget에 표시합니다.

본 예제에서는 RS485 확장 보드를 사용하므로 프로그래밍을 시작하기 전에 Library Manager에서 필요한 라이브러리를 다운로드해 주세요.

페이지 콘텐츠 만들기

먼저 GUI Builder를 사용하여 페이지 콘텐츠를 구성합니다. 각 페이지의 Text widget에는 텍스트를 직접 입력할 수 있으므로 프로그램에서 별도로 정의할 필요가 없습니다.

각 widget의 세부 구성은 다음 표를 참조해 주세요.

현재 보유하고 있는 장비에 따라 Smart Display 모델을 선택하고, 다양한 widget을 사용하여 원하는 화면을 구성할 수 있습니다. 단, 각 페이지의 widget ID와 type은 프로그램에 정의된 내용과 일치해야 합니다. 구성을 단순화하기 위해 이 표에 제시된 widget ID와 type을 기준으로 페이지 콘텐츠를 만드는 것을 권장합니다.

이제 프로그램 부분을 살펴보겠습니다.

예제 프로그램 설명

(1) Include 파일

ModbusMaster 라이브러리를 다운로드한 후 #include 지시문을 사용하여 해당 라이브러리를 포함합니다.

또한 관리를 편리하게 하기 위해 Smart Display 관련 상수를 SmartDisplayModbus.h에 정리해 두었습니다. 이 파일도 함께 포함해 주세요.

(2) Widget ID와 레지스터 주소 변환

이전 기술 문서에서는 widget ID를 레지스터 주소로 변환하는 방법을 다음과 같이 설명했습니다.

다만 이 표는 페이지당 최대 10개의 widget을 지원하던 초기 사양을 기준으로 작성되었습니다. 현재는 페이지당 최대 64개의 widget을 사용할 수 있습니다. 처음 10개의 widget에는 기존 표를 그대로 적용할 수 있지만, 11번째 widget부터는 새로운 레지스터 영역을 사용해야 합니다. 이를 위해 다음과 같은 매크로를 정의합니다.

사용 편의성을 위해 widget ID를 기준으로 데이터를 읽고 쓸 수 있는 함수를 정의하고, 함수 내부에서 레지스터 주소 변환을 수행합니다.

(3) Widget ID와 GUI 설계

앞서 GUI Builder를 사용하여 페이지 콘텐츠를 구성할 때 widget ID가 서로 일치해야 한다고 설명했습니다. 따라서 프로그램에서는 다음과 같이 widget ID 상수를 정의합니다.

이러한 상수를 정의해 두면 widget의 종류를 쉽게 파악할 수 있으며 실제 페이지 설계와 비교하기도 편리합니다. 이후 GUI 설계를 변경할 경우 오류가 발생하지 않도록 관련 값도 함께 확인해 주세요.

(4) 부저

펌웨어에서는 카운터를 이용해 일정 시간 지연한 후 부저에 0/1 신호를 전송하여 소리를 출력하고, 다른 카운터를 사용해 부저음의 시작 및 종료 시간을 제어합니다. 부저음을 출력하려면 다음 4개의 레지스터에 값을 써야 합니다.

부저음의 지속 시간을 조절하기 위해 SMARTDISPLAY_BUZZER_HIGH를 파라미터로 전달받아 부저음을 출력하는 함수를 작성합니다. 예제 함수는 다음과 같습니다.

SMARTDISPLAY_BUZZER_ACTIVE는 이전에 기록한 값과 다른 값이 입력될 때만 부저음이 출력됩니다. 따라서 이 값을 함수 내부의 static 변수로 유지하고, 함수를 호출할 때마다 값을 반전시킵니다.

마지막으로 페이지 처리 함수에서 버튼 상태에 따라 서로 다른 길이의 부저음을 출력할 수 있습니다.

(5) 페이지 전환

페이지를 전환하기 전에 먼저 CONFIG_MODE로 진입해야 합니다. 새 페이지를 설정한 후 DISPLAY_MODE로 전환합니다. 페이지가 전환되면 Smart Display는 새 페이지의 모든 widget을 다시 로드합니다. Smart Display의 로딩이 완료되기 전에 읽기/쓰기 동작이 수행되지 않도록 일반적으로 일정 시간의 지연을 추가합니다. 필요한 지연 시간은 페이지의 복잡도에 따라 달라질 수 있습니다. 페이지 전환 후 비정상적인 동작이 발생하는 경우 지연 시간을 늘려 문제가 해결되는지 확인해 볼 수 있습니다.

페이지를 전환하면 새 페이지의 widget 값은 기본값으로 설정됩니다. 따라서 페이지 전환과 함께 widget 값을 저장하고 다시 복원할 수 있도록 처리 절차를 구성합니다.

먼저 페이지 테이블을 구성하고 각 페이지에 처리 함수를 지정할 수 있도록 페이지 처리용 함수 포인터를 정의합니다.

다음으로 페이지 테이블을 생성합니다.

상수 MAX_WIDGETS_PER_PAGE는 각 페이지에서 값을 저장할 widget의 수를 정의합니다. 이후 widget을 추가하는 경우 이 값도 함께 업데이트해야 합니다.

마지막으로 loop() 함수에서 페이지 전환과 widget 처리를 수행합니다.

현재 페이지 _curPage와 다음 페이지 _nextPage가 서로 다르면 페이지 전환 플래그 newPage를 true로 설정합니다. 이를 통해 페이지 처리 함수에서 초기화가 필요하다는 것을 확인할 수 있습니다. 다음은 Page0을 예로 들어 설명합니다.

init 파라미터가 true이면 해당 페이지로 전환된 직후임을 의미합니다. 이 경우 WIDGET_P0_BUTTON_NEXT의 값을 0으로 설정합니다. 새 페이지로 전환했을 때 버튼의 기본값은 0이며, 버튼을 눌러 값이 0에서 1로 변경될 때만 특정 명령(이 예제에서는 PAGE_1로 전환)을 실행하도록 하기 위해서입니다. 이전 동작에서 해당 값이 이미 1로 변경되었을 수 있으므로 다시 0으로 설정해야 합니다.

Slider widget 역시 페이지 로드 시 초기값은 0입니다. 하지만 이전에 밝기 값이 변경되었을 수 있으므로 현재 밝기 값인 _brightness로 복원해야 합니다.

그 외의 경우(init이 false인 경우)에는 widget 값의 변경 여부에 따라 해당 처리를 수행합니다. 마지막으로 모든 widget 값을 저장하여 다음 처리 시 참조할 수 있도록 합니다.

다음 페이지 _nextPage를 설정할 때는 다음 함수를 사용합니다.

페이지 처리 함수에서는 첫 실행 이후 매번 widget의 내용을 확인합니다. 버튼 값이 0에서 1로 변경된 것을 감지하면 다음과 같이 함수를 호출하여 페이지 전환을 요청합니다.

(6) Graph Widget

Graph widget은 입력된 값을 그래프 형태로 표시할 수 있습니다. 본 예제에서는 A0에 연결된 가변 저항을 사용해 아날로그 입력을 시뮬레이션하고, 데이터의 변화를 Graph widget에 표시합니다. Arduino의 아날로그 입력 범위는 0~1023인 반면 Graph widget에서 사용할 수 있는 값의 범위는 0~100이므로, map() 함수를 사용하여 값의 범위를 변환해야 합니다.

Graph widget은 값이 변경될 때만 화면이 업데이트되도록 설계되어 있습니다. 일정한 주기로 업데이트되는 효과를 구현하려면 값을 주기적으로 확인하고, 새로 읽은 값이 이전 값과 동일한 경우 값을 약간 변경합니다(1을 더하거나 뺍니다). 이렇게 하면 일정한 주기로 그래프가 업데이트되는 동적인 표시 효과를 구현할 수 있습니다.

마무리

이상으로 본 예제 프로그램에 대한 설명을 마칩니다. 이 내용을 통해 Smart Display 개발 방법을 보다 쉽게 이해하는 데 도움이 되기를 바랍니다. 또한 본 예제는 향후 프로젝트 개발을 위한 기본 프레임워크로 활용할 수 있어 개발 시간을 단축하는 데 도움이 됩니다. 전체 프로그램은 다음 링크에서 다운로드할 수 있습니다: Modbus-MultiPageOperation on GitHub.

RS485 / Modbus가 익숙하지 않은 경우에는 다음의 이전 기술 문서도 함께 참고해 주세요: Smart Display RS485 Introduction.