SmartDisplay UART通訊協定 (UART Protocol) 是由華凌光電開發的一種專屬通信協定，旨在幫助客戶輕鬆透過UART介面輕鬆控制其人機介面(HMI)畫面。這個創新的協定結合了華凌光電用戶友好的 GUI Builder，為客戶提供了一個直觀而強大的工具，幫助客戶快速建立符合需求的圖控物件。透過 GUI Builder 客戶可以輕鬆設計各種 HMI 人機介面，從簡單的按鈕 (Button) 、文字 (Text) 到複雜的儀表 (Gauge) 和鍵盤 (Keypad)，滿足各種應用場景的需求。這不僅節省了客戶的時間和成本，還使人機介面設計更加靈活和個性化，再透過華凌光電自定義 UART 協定指令，可以輕鬆與 Smart Display UART互動和控制。我們致力於提供最佳的客戶體驗，並持續改進我們的 GUI Builder，以確保它能滿足客戶不斷演變的需求。無論您是專業設計師還是初學者，我們相信 Smart Display UART協定將成為您打造出色 HMI 人機介面的理想選擇。讓我們一同探索這個令人振奮的創新技術，為您的產品注入更多活力和靈感。

Smart Display GUI Builder – UART Project 設定說明

Smart Display GUI Builder 為您提供了一個直觀且友好的操作環境，讓您輕鬆創建屬於自己的 HMI 項目，您只需要透過 GUI Builder 拖曳各種小工具 (Widget) 到頁面上，在零代碼的情況下您就可以輕鬆的在Smart Display 裝置上顯示圖控物件並與之互動。操作簡單、功能靈活，能滿足您的各種需求，讓您的工作更加高效率。

以下將介紹如何使用 Smart Display GUI Builder 建立UART專案項目，以及如何透過 UART 控制物件的關係。

■ 建立 UART 協定專案項目 (UART Protocol Project)

依據需求, 輸入project 名稱, 選擇 SmartDisplay 機種, 於 protocol 選擇 SmartDisplay protocol (UART), 即可建立UART project。

■ 於主畫面新增一個儀表(Gauge)和水平滑桿小工具(Horizontal Slider Widget)

新增 Widget 後，每個物件都有唯一的索引 ID(Index ID)，每個物件都有其頁面索引(Page Index)和物件ID (Object ID)設定，透過了解這兩個設定，主機端(Host)即可透過指令(Command)來控制此物件。

■ 模擬 UART 與 Widget 之間的互動

點選 icon: “Simulator With GUI” 啟動模擬器

啟動模擬器後，您可以拖曳下方標記為 GAUGE_0 的滑桿，來模擬主機發送 GAUGE_0 的數據, 請觀察模擬器中儀表的變化，也可以從右側的訊息記錄(Message Log)查看UART 指令日誌。 您還可以操作模擬器的水平滑桿(Horizontal Slider), 模擬從設備端(Device)送出數據。

■ 更新Smart Display 裝置設定

經由模擬器驗證功能後，如果沒問題後，就可以連接設備(Device)將專案(Project)設定上傳到 Smart Display 設備。

等待上傳並更新完畢。

■ 驗證設備與小工具之間的互動

再將Project上傳到設備後，您可以進一步驗證 Smart Display 設備端功能。使用 GUI Builder 連接到設備(Device)端後, 點選 "Test Device", 即可測試主機與設備之間的互動。

■ 測試設備視窗

藉由此測試畫面，您可模擬主機端修改物件的值。拖曳下方標示為GAUGE_0的滑桿，模擬主機端送出 Object 0 的值。觀察設備上儀表的變化，您也可以從下方的訊息紀錄看到, 發送指令(Send command)和回應指令(Response command)的變化。此外，也可以操作設備上的水平滑桿(Horizontal Slider)確認從設備端發送的事件指令(Event command)。

透過上述的測試設備視窗(Test Device Window)，您可模擬主機端送出UART指令控制Smart Display。從Smart Display觀察結果畫面，並透過觸控面板操作 Smart Display 來確認主機端接收到事件指令(Event command)資訊。

SmartDisplay GUI Builder – 自訂小工具

當SmartDisplay的預設小工具(Widget)無法滿足設計需求時，客戶可自行設計自定義小工具(Widget)的圖示。透過更新相對應的圖片後，即可達到自定義的小工具畫面。一般的按鈕(Button)或切換按鈕(Toggle Button)，一般更換 On/Off 圖片即可達到自定義的功能。然而，對於有些較複雜的小工具(Widget)，除了更換圖片，可能還需要進一步的參數設定，以確保Widget能正常顯示效果。

■ 自定義儀表(Gauge)說明與範例

您可以依序更改圖片與儀表參數後即可達到自定義小工具(Widget)畫面。

■ 多國語言顯示

SmartDisplay Text Widget 支援Unicode，可顯示多國語言文字，客戶可依下列步驟，設定想要顯示的多國語言文字。

1. 新增 Custom Font，依序選擇想要顯示的字型與大小，並選擇要顯示的Unicode 文字範圍(可參閱網站 https://unicode-table.com/en/blocks/ 確認要顯示文字的Unicode 範圍為何)，如要顯示的文字範圍太大(如中文漢字)，導致Flash 空間不足，可透過設定Custom Characters 部分，設定只要納入那些文字而已，降低字型的Flash 空間。

2. 設定Text Widget 顯示字型: 選擇要修改哪個 Text Widget 設定

3. 新增 Text Widget 並在模擬器中確認文字顯示是否正常

Custom CAN Command 說明

接下來將說明UART所使用的command protocol。透過這些指令，主機端可輕鬆控制Smart Display，包括換頁、調整背光亮度，或者使Buzzer發出聲音。

下列為預設的 UART 設定:
Default baud rate: 115200 (可透過 GUI Builder 修改)
Parity Bit: None
Data Bit: 8
Stop Bit: 1

UART 主要的Data format 格式如下:

Header Byte(1 Byte)	Length(1 Byte)	Payload(N Byte)	CRC(2 Byte)
Command Header	Value: 4 + Payload length Payload max size: 250	Payload data max size: 250	Modbus CRC16 (Calculate Modbus CRC16 https://www.modbustools.com/modbus_crc16.html)

UART protocol 主要有三大類Command: Send command, Response command 和 Event Command 依序格式如下:

(1) Send Command 格式
Send command 主要用於主機端向 SmartDisplay 端發送指令。

Header Byte(1 Byte)	Length(1 Byte)	Payload(N byte)	CRC(2 Byte)
Start with 0x53 (S)	Value: 4 + Payload length Payload max size: 250	Command code: 1 byte Command parameter: 0 ~ N bytes	Modbus CRC16

(2) Response Command 格式
Response command 主要用於 SmartDisplay 端回覆主機端 Send command 的結果。

Header Byte(1 Byte)	Length(1 Byte)	Payload(N byte)	CRC(2 Byte)
Start with 0x52 (R)	Value: 4 + Payload length Payload max size: 250	Command Code: 1 byte Error Code: 1 byte Response Data: 0 ~ N bytes	Modbus CRC16

(3) Event Command
當 SmartDisplay 端需要主動報告數據時，會使用此命令，例如在按鈕被觸發時。

Header Byte(1 Byte)	Length(1 Byte)	Payload(N byte)	CRC(2 Byte)
Start with 0x45 (E)	Value: 4 + Payload length Payload max size: 250	Event Command Code: 1 byte Event Data: 0 ~ N bytes	Modbus CRC16

*有關詳細的 Send Command 代碼和 Event Command 代碼，請參考 Smart Display UART 使用者指南文件。

■ Send / Response Command 協定說明與範例

以下將依序概述每個命令（Command）有效載荷（Payload）的數據格式和範例。

● Set Object Value: 0x3

發送命令(Send Command)

Command Code	1 Byte	0x3
Parameter data	8 Byte	uint16 PageIndex; uint16 ObjectId; int32 value;

回應命令(Response Command)

Command Code	1 Byte	0x3
Error Code	1 Byte	0: Success 1: Failed

範例: 設定 Object value

● Set Object Buffer Data: 0x5

發送命令(Send Command)

Command Code	1 Byte	0x5
Parameter data	N Byte	uint16 PageIndex; uint16 ObjectId; uint8 [] data (max 100 bytes) // Unicode String for Text // Clock setting for Digital Clock

回應命令(Response Command)

Command Code	1 Byte	0x5
Error Code	1 Byte	0: Success 1: Failed

範例: 設定 Object Text: test

範例: 設定 Clock Widget 日期時間: 2024/09/01 04:05:06

● Set Brightness: 0x6

發送命令(Send Command)

Command Code	1 Byte	0x6
Brightness	1 Byte	Brightness value

回應命令(Response Command)

Command Code	1 Byte	0x6
Error Code	1 Byte	0: Success 1: Failed

範例: 設定亮度為 90

● Set Buzzer: 0x7

發送命令(Send Command)

Command Code	1 Byte	0x7
Cycle	1 Byte	Cycle value
High	1 Byte	High value (Unit: 10 ms)
Low	1 Byte	Low value (Unit: 10 ms)

回應命令(Response Command)

Command Code	1 Byte	0x7
Error Code	1 Byte	0: Success 1: Failed

範例: 發出聲音: Cycle:1, High: 200 ms, Low: 0 ms

● Set Page Index: 0x8

發送命令(Send Command)

Command Code	1 Byte	0x8
Page Index	1 Byte	Page Index value

回應命令(Response Command)

Command Code	1 Byte	0x8
Error Code	1 Byte	0: Success 1: Failed

範例: 切換Page Index 為 1
切換Page 時, 需要先設定Device State 為ConfigMode, 之後在下換頁命令, 結束換頁命令後, 就再設定Device State Mode 為Display Mode, 即可完成換頁的命令, 相關命令順序如下:

● Set Device State: 0x20

發送命令(Send Command)

Command Code	1 Byte	0x20
Device State	1 Byte	0: ConfigMode 1: DisplayMode

回應命令(Response Command)

Command Code	1 Byte	0x20
Error Code	1 Byte	0: Success 1: Failed

範例: 可參考切換Page 範例

■ Event Command protocol說明與範例

● Page change event: 0x1

事件指令（Event Command）

Event Code	1 Byte	0x01
Parameter data	2 Byte	Uint16 PageIndex

範例: SmartDisplay 切換 Page 1.

● Object Text change event: 0x2

事件指令（Event Command）

Event Code	1 Byte	0x02
Parameter data	N +2 Byte	Uint16 ObjectId N byte Unicode Text

 

範例: Keypad widget 送出文字 1234

● Object Value change event: 0x3

事件指令（Event Command）

Event Code	1 Byte	0x03
Parameter data	6 Byte	Uint16 ObjectId int32 value

範例: Object value change event.

客戶可透過 GUI Builder 以拖放Widget的方式設計 UI，達成 WYSIWYG（所見即所得）的效果，讓 UI 設計變得直觀且高效。同時，客戶可利用模擬器預覽設計結果，即時查看 UI 的呈現，提前了解最終效果，從而節省時間和精力。最終，通過 WINSTAR自定義的 UART 協定，客戶可以輕鬆控制設備。這種端對端的設計流程使客戶能夠在設計和控制上實現無縫整合，提高操作的便捷性和準確性。Smart Display UART 協定的應用為客戶帶來了更多的操作可能性和便利性，擴展了產品開發和應用的範圍。這種綜合解決方案不僅提升了客戶的工作效率，還增強了產品的創造力和競爭力。心動了嗎？快與華凌光電聯繫索取 Smart Display GUI Builder！在購買 Smart Display 之前，您可以先試用模擬器，確認其是否滿足您的需求！