華凌光電電子報

華凌電子報第163期

本期內容: 1) WF0200BTYAJDNG10 – 2吋IPS TFT搭載PCAP觸控面板顯示器模組; 2) WF22GN5AB2DNN0 – 2.13吋LPRD低功耗反射式Mono TFT顯示器模組; 3) WF101JSYFHLHBV – 10.1吋支援HDMI訊號連接器搭載PCAP觸控面板TFT顯示器模組; 4) WL0F00050000FGAAASA01 – 5吋電容觸控 CAN Bus 高亮TFT智慧型顯示器; 5) SmartDisplay RS485入門

WF0200BTYAJDNG10 – 2吋IPS TFT搭載PCAP觸控面板顯示器模組

WF0200BTYAJDNG10是一款2吋電容式觸控 IPS TFT LCD 顯示器模組，解析度為240x320像素。模組內建ST7789VI驅動IC，支援MCU 和SPI介面傳輸，觸控面板內建 GT911 IC 可支援I2C介面。WF0200B系列另有無觸控面板模組，如果客戶不需觸控面板可以選擇我們的高亮WF0200BSYAJDNN0型號。

此款模組採用IPS面板，具有更寬廣視角的優勢，視角左:80/右:80/上:80/下:80度(典型值)，對比度 800:1(典型值)，亮度400 nits(典型值)，長寬比3:4，供電電壓為2.4V~3.6V，典型值為3.3V。此模組可在-20℃~+70℃溫度範圍下作業;儲存溫度範圍-30℃~+80℃。

WF0200BTYAJDNG10	規格	單位
顯示尺寸(對角線)	2	吋
點陣(解析度)	240 x RGB x 320(TFT)	dots
模組尺寸	38.8(W) x 52.3(H) x3.8(D)	mm
有效區域	30.60 x 40.80	mm
像素間距	0.1275 x 0.1275	mm
LCD 類型	TFT全透
TFT介面	MCU / SPI
TFT驅動 IC	ST7789VI 或相容IC
視角	80/80/80/80 (IPS)
長寬比	3：4
背光類型	LED, 白色
PCAP驅動IC	GT911或相容IC
PCAP介面	I2C
FW版本	V92
PCAP解析度	240 * 320
觸控面板類型	PCAP電容式觸控面板
表面	亮面

WF0200BTYAJDNG10

► 前往WF0200BTYAJDNG10網頁介紹

WF22GN5AB2DNN0 – 2.13吋LPRD低功耗反射式Mono TFT顯示器模組

WF22GN5AB2DNN0是一款2.13吋低功耗反射式Mono TFT顯示器模組，解析度122x250像素，內建ST7306 IC，支援8-bit MCU、4線SPI、3線SPI介面。WF22G Mono TFT系列採用LPRD反射式LCD (Low Power Reflective LCD)，有以下的優點：

陽光下可視，適合有戶外需求的產品應用
鮮豔色彩，在陰天或清晨下可視，反射式顯示器可提升視覺品質
抗紫外線 (液晶玻璃基板)
低耗電，輕薄型
Mono TFT；外型接近電子紙
高更新率，適合顯示動態資訊
護眼，無藍光，有效降低對眼睛的傷害

此款低功耗反射式Mono TFT顯示器模組，視角左: 65/右: 65/上: 65/下: 65度(典型值) ，供電電壓(VDDA)為2.55V~3.6V，典型值為3.3V。長寬比18:9，模組採防眩光玻璃表面。此模組可在-20℃~+70℃溫度範圍下作業;儲存溫度範圍-30℃~+80℃。

此款低功耗反射式LCD可用於智慧型零售商品如貨架標籤，運動型商品如自行車記錄儀、釣竿、捲線器、手持設備，交通運輸型商品如電動汽車充電樁，其他可穿戴或便攜式設備等。

WF22GN5AB2DNN0	規格	單位
顯示尺寸(對角線)	2.13	吋
點陣(解析度)	122 x 250	dots
模組尺寸	27.07(W) x 56.2 (H) x 1.09 (D)	mm
有效區域	23.668 x 48.50	mm
像素間距	0.194 x 0.194	mm
LCD 類型	TFT, Mono (反射式)
視角	65/65/65/65
長寬比	18:9
驅動IC	ST7306或相容IC
介面	8bit MCU/4-SPI/3-SPI
觸控面板類型	無觸控面板
表面	防眩光 (Anti-Glare)

WF22GN5AB2DNN0

► 前往WF22GN5AB2DNN0網頁介紹

WF101JSYFHLHBV – 10.1吋支援HDMI訊號連接器搭載PCAP觸控面板TFT顯示器模組

WF101JSYFHLHBV型號是一款10.1吋高亮IPS TFT LCD模組，解析度為1024x600像素。模組上帶有PCB板支援HDMI信號(僅用於DVI)介面和40-pin GPIO連接器，此設計讓樹莓派(Raspberry Pi)在使用上更方便。這款TFT顯示器模組採用IPS面板，具有廣視角優點左:85度/右:85度/上:85度/下:85度(典型值)，使用EK79001HN和EK73215BCGA驅動IC。亮度為850 cd/㎡，觸控面板內建 ILI2511 IC，可支援USB介面和單點或5點觸控功能。

此款模組的LCM(VDD)電源電壓為4.7V~5.3V，典型值為5V。使用防眩光玻璃表面，長寬比為16:9，對比度為800:1 (典型值)。此模組可在-20℃~+70℃溫度範圍下作業;儲存溫度範圍-30℃~+80℃。

WF101JSYFHLHBV	規格	單位
顯示尺寸(對角線)	10.1	吋
點陣(解析度)	1024 RGB X 600	dots
模組尺寸	235(W) x143(H) x 27.96(MAX)(D)	mm
有效區域	222.72 (H) x 125.28(V)	mm
點間距	0.2175(W) x 0.2088(H)	mm
LCD 類型	TFT全透
視角	85/85/85/85
像素排列	RGB-STRIPE
長寬比	16:9
驅動IC	EK79001HN + EK73215BCGA 或相容IC
背光類型	LED, 白
介面	支援HDMI連接器(僅DVI信號)
PCAP IC	ILI2511 或相容IC
PCAP 介面	USB
PCAP FW 版本	V6.0.0.0.62.90.1.2
觸控面板類型	PCAP投射電容式觸控面板
表面	亮面

WF101JSYFHLHBV

► 前往WF101JSYFHLHBV網頁介紹

WL0F00050000FGAAASA01 – 5吋電容觸控 CAN Bus 高亮TFT智慧型顯示器

WL0F00050000FGAAASA01是一款5吋高亮CAN系列TFT智能顯示器，智能顯示器CAN系列定義為從裝置(Slave Device)，受控於主機(Master Device)的指令顯示畫面及回報觸控螢幕狀態。此款模組是由高亮TFT模組WF50FSWAGDNG0搭配研發團隊開發的的4-layers FR4 PCBA硬體組成的智能顯示器。這款5吋智能顯示器CAN系列TFT是款很容易上手的產品，可節省客戶自行開發時間，讓您快速完成專案項目，以節省開發成本加速成品上市。

華凌透過 Windows應用軟體GUI & GUI Builder，設計智能顯示器圖形使用者介面(GUI) 。我們的Smart Display套件可使用於多種主機(HOST)平台。如:電腦 (結合USB2CAN Dongle) 、MCU 如Arduino、樹莓派(結合PiCAN2)。使用拖曳小工具(Widgets)預覽功能進行畫面設計，透過「所見即所得」來降低使用者設計畫面的時間。用戶不需程式設計背景，即可透過Winstar GUI Builder進行使用介面設計。

5吋 Can TFT 智能顯示器特色:

傳輸距離長
支援CANopen通訊協定，起始通訊速率為250KB
電容式觸控面板模組WF50FSWAGDNG0
內建16MB快閃記憶體(FLASH)，儲存字型及圖控物件(Object Dictionary)
直流5V工作電壓
內建蜂鳴器
開機自我測試並開啟螢幕
可使用於多種主機(HOST)平台。如:電腦 (結合USB2RS-485 Dongle) 、MCU、單板電腦(Linux OS)、樹梅派(PiCAN2)等裝置
不需程式設計背景，即可透過Winstar GUI Builder進行使用介面設計！ (►前往GUI Builder介紹)

現在更新過後的GUI軟體為三合一APP，提供了三個應用模板可選：工業、車輛、醫療。客戶只要於首次開機時，按住選項3 秒鐘便可成功設定，之後也可以通過 GUI builder軟體來更換模板。

WL0F00050000FGAAASA01	標準值	單位
工作電壓	5	Vdc
通訊介面	CAN bus 差異 ± 3.3	Vpp
MCU	STM32F750	N/A
快閃記憶體	16	MB
SDRAM Frequency	108	MHz
顯示器尺寸	5.0	吋
TFT P/No.	WF50FSWAGDNG0	dot
點陣	800× 3(RGB) × 480	dot
模組尺寸	135.7(W) ×82.4(H) ×12.15	mm
有效尺寸	108(W) ×64.8 (H)	mm
點間距	0.135(W) ×0.135(H)	mm
亮度	Min: 650; Typ: 750	cd/m2
LCD類型	TFT全透
視角	80/80/80/80 (IPS)
長寬比	5:3
觸控面板	電容式觸控面板
表面	亮面

WL0F00050000FGAAASA01

► 前往WL0F00050000FGAAASA01網頁介紹

SmartDisplay RS485入門

跨平台的程式控制方法

一、前言

SmartDisplay 近年來已經被廣泛地應用在醫療、工控、車用等各種領域。簡單地說，它是結合微控制器的顯示器，能夠處理複雜的圖資載入、設定、顯示、甚至是輸入等工作，而外界只要利用簡單的指令就可以進行互動操作，因此非常適合各種需要顯示或控制的各類型應用。

SmartDisplay支援多種通訊介面。目前最常用的是CANbus/CANopen，RS485/Modbus，未來也將提供更多元的選擇。其中RS485/Modbus是工業界常用的通訊介面，市面上很容易取得各種價格合理的RS485裝置。線路架構單純，只要兩條線（RS485_A／RS485_B）就可以進行通訊，而且RS485通訊介面在作業系統上通常是以『序列埠』（Serial Port）的方式呈現，在每種平台都有對應的發展函式庫。再加上Modbus協定相當容易了解，因此我們選擇它來進行實測與講解。

本文將由淺入深介紹如何控制SmartDisplay，了解其控制原理，最後再介紹如何製作跨平台的應用程式。無論您是工業界設備專家，或是熱衷動手做的Maker自造者，都歡迎和我們一起進入SmartDisplay的世界！

二、軟硬體需求

SmartDisplay

需要支援RS485介面的SmartDisplay進行連線測試。

通訊介面RS485

由於個人電腦／樹莓派通常沒有RS485，我們可以選購各種USB to RS485的轉接線。有些單板電腦內建RS485，則可以直接使用。

圖2-1 RS485轉接線

測試環境

符合前面兩個條件後，就可以選擇適合的執行環境。唯一的條件就是能夠讀寫序列埠，因此包括Windows、MacOS、各種Linux（包括樹莓派的Raspbian）、Arduino、單板電腦(SBC)等等都可以勝任，華凌型號：WUACLB120V0000N0NX01即是非常好的單板電腦(SBC)選擇。

Model No. WUACLB120V0000N0NX01

三、簡易控制測試

取得控制碼

首先我們要取得控制碼。最簡單的方式是從SmartDisplay GUI Builder取得。GUI Builder是SmartDisplay的絕佳輔助軟體。它可以幫助我們在沒有實體裝置的情況下學習、操作、設計、顯示使用者介面，完全不需要寫任何程式。具備所見即所得的特性，只要拖曳或點選按鈕或元件就可以進行使用者介面設計。除此之外，內建與SmartDisplay共用程式原始碼的模擬器，因此可以確保與實體裝置一致的外觀與行為。更棒的是，它還是免費的！

► 聯繫我們取得SmartDisplay GUI Builder

圖 3-1 SmartDisplay GUI Builder

執行GUI Builder後，開啟一個專案。在此我們選擇 5”機種，下方的預設情境則選擇車用（Vehicle）。設好專案名稱後，按Create創建。如果先前已經產生過，也可以直按右側的選單直接選取。

圖3-2開啟專案

專案打開後，先選取介面

圖3-3 選擇介面

圖3-4設定介面參數

Interface選擇RS485，RS485 Port則要設為RS485轉接線實際的連接埠，若是不清楚則可以在裝置管理員中查詢（重覆拔插看消失或顯示的是那一個）。Baudrate採用預設值115200即可。

圖3-5 裝置管理員的Com Port顯示

不過如果現在還沒有RS485裝置也沒關係，只要Interface選擇RS485即可，RS485 Port可以先不用管，因為現在我們只使用模擬器，並不會真的連線到裝置。

按Simulator/Simulator with GUI 開啟模擬器：

圖3-6 執行模擬器

執行後可以看到模擬畫面，各元件的控制項，以及右側的控制指令記錄。改變任何一個元件的值就會看到送出的指令內容：

圖3-7 改變元件內容以及傳送的控制碼

每一個動作都會看到TX/RX兩個指令，這是因為裝置（即使現在其實是模擬器）在收到指令後，會送回相同指令表示已經收到。

我們將不同元件的幾個不同數值記錄下來，下一個步驟可以用來控制實體裝置。

表 3-1 控制碼

與裝置連線

RS485是利用兩條訊號線的電位差來傳送訊號，所以只要這兩條電線就可以連線，連地線都不用接。RS485的訊號線名稱為A+/B-，照著接即可。

圖3-8 RS485 接線

主機如何傳送控制碼呢？只要作業系統的程式能寫資料到序列埠即可。不過在進行測試之前，有兩點得先注意一下。

1. 由於在不同作業系統上的Com Port名稱不一樣，因此在測試時請先查詢確定。例如下表：

表 3-2 各種作業系統的序列埠名稱

2. 有些作業系統Com Port的權限預設為不開放，使用前必須先設定一下，以Linux/Ubuntu為例，如果Com Port名稱為 ttyUSB0，則只要在終端機下執行：

sudo chmod 666 /dev/ttyUSB0

下面提供兩種測試方法。

Serial Port 終端機控制

使用支援16進位輸入的序列埠終端機軟體，連線後直接輸入16進位控制碼：

圖3-9 以終端機程式傳送控制碼

正常的話，應該就可以看到裝置上的元件根據不同控制碼產生動作。

但這種方式只是用來測試是否連線成功，在應用上其實不太方便。要達到最佳效果，還是得藉由程式來完成。至於用那一種語言？其實都可以，我們先用當紅的跨平台程式語言python來試試。

使用python

下列程式使用python3執行。程式結構相當簡單，只是直接把三組控制碼每隔一秒寫入序列埠，讓裝置上的儀表持續轉動。

import serial
from time import sleep

"""
The name of Com Port varies according to the operating system, For example:
Raspberry Pi: /dev/ttyUSBn (e.g. /dev/ttyUSB0)
Windows: COMn (e.g. COM22)
"""
# Raspberry Pi / Rasbian
# COM_PORT = '/dev/ttyUSB0'
COM_PORT = 'COM22'

v000 = bytes.fromhex('7B06000600006251')
v050 = bytes.fromhex('7B0600060032E384')
v100 = bytes.fromhex('7B060006006463BA')

ser = serial.Serial(COM_PORT, 115200)
while True:
ser.write(v000)
sleep(1.0)
ser.write(v050)
sleep(1.0)
ser.write(v100)
sleep(1.0)
ser.write(v050)
sleep(1.0)

python原始碼可以在各種平台上執行，因此只要序列埠的名稱正確，接上適當的轉接線後即可正常運作。

不過這示範程式內幾個固定的控制碼一定不符合實際應用，所以我們接下來要來了解這些指令的內容，才能充份發揮通訊界面的控制功能。

四、控制碼分析

比對分析

比對同一個元件，不同值的指令：

Table

不難發現，藍色部分就是我們設定元件的值。

比對不同元件，同一個值的指令：

Table

藍色部份顯然是指對元件的某種指標或位址。

至於後方兩個bytes的資料看起來沒有規則，請見以下的控制碼解密。

控制碼解密

其實這8個bytes的內容就是所謂的Modbus訊息。簡單地用一張圖來說明各欄位的意義：

圖4-1控制碼實例說明

ID
每個Modbus裝置都要有一個識別碼。SmartDisplay的識別碼就是0x7B = 123

Fun(Function Code)
功能碼，說明這個訊息的目的，例如這裡的06就是 Write Single Register，也就寫入一個值到指定的地方。

Register Address
暫存器位址，也就是要寫入的目的地（也就是元件的地址）。

Data
要寫入的內容（也就是元件的值）

CRC
對前6個bytes進行CRC（Cyclic Redundancy Check）的結果，用來檢查傳輸過程資料是否發生錯誤。

有些概念了嗎？若要深入了解，還是得先看一下什麼是Modbus。

五、 Modbus簡介

Modbus協定

Modbus協定其實是一種資料格式。它基本上定義了一個主從架構的通訊內容。由於只是資料結構的定義，因此可以透過各種設備進行通訊，例如RS232, RS422, RS485, 甚至是網路。

由於網路上已經有非常多的教學與說明文件，所以這裡並不對Modbus進行詳細說明。其實只要知道一些概念，就可以對Modbus運用自如了。

概念模型

Modbus將資料傳輸當成是『暫存器』（Register）存取。每個裝置都要定義自己的暫存器種類與位址供外界參考。所謂傳送資料給裝置就是寫入指定暫存器，讀取資料就是讀取指定暫存器，簡單明暸。另外，每個位址暫存器儲存的值都是16-bits。

功能碼

根據資料的特性，Modbus定義了幾種讀寫的方法，以訊息中的功能碼指定。

表5-1 Modbus Function Codes

以SmartDisplay的控制程式來說，最常用的就是06：Write single register（寫入一個16-bits的值）以及Read holding registers（讀取多個暫存器的值）。

CRC

這個看起來最神秘的部分其實不難，這只是一個通訊的檢查碼，用以確保通訊資料的正確性。我們不一定要深入研究其原理（但實際上也只是查表以及位元運算，最後得到16-bit檢查碼），只要了解如何使用即可。

六、控制SmartDisplay 元件

前面提到每個Modbus都要定義暫存器種類與位址，現在就來討論這個主題。

暫存器分類

SmartDisplay暫存器大致可分成三類：

裝置資訊（例如版本、裝置名稱等）

使用04：Read Input Registers讀取。這些資料只有在更新韌體時才會改變，通常是剛連線時讀取，用來取得裝置特性參數。

元件特性（例如種類、位置等等）

使用03：ReadHoldingRegisters/16: Write Multiple Register 讀寫。這些資料影響到元件的外觀顯示，在非設計階段時通常不會改變。若要改變內容，必須先將SmartDisplay顯示暫時關閉才能更新。

元件數值（元件表現的值，例如轉速、開或關，百分比等等，因元件而異）

這是運作中主要改變的項目。每個元件都使用一個16-bits數值，因此用06：Write Single Register設定。

下面列出這些暫存器的整理清單：

Input Registers

表6-1 SmartDisplay Input Registers

Holding Registers

表6-2 SmartDisplay Holding Registers

早期的SmartDisplay只支援10個元件，因此widgetID的範圍介於0 ~ 9（含）。新版的韌體已經擴展到64個，不過定址方式有些改變，這裡暫不討論。

有了這些資料後（雖然還不完整，但是目前夠用了），我們就可以將控制指令進行包裝，傳送給SmartDisplay進行控制。至於如何包裝，以及如何加入CRC碼，將在後面的章節說明。

七、使用者介面

要讓SmartDisplay進入實際應用，還是需要有一個適合的人機介面（尤其是圖形人機介面，Graphics User Interface, GUI），才能發揮最大效用。目前跨平台的GUI發展平台有經有很多選擇，我們這裡使用Qt來實現。

許多人以為Qt僅僅是GUI函式庫，但其實它是相當完整的發展框架（Framework）。如果應用程式完全透過它的類別庫來實現，就可以很容易地將專案移植到其他平台（PC/Windows、Mac/MacOS、 Raspberry Pi/Raspbian、Android、iOS、Embedded等等），幾乎不用修改程式，是相當值得投資學習的發展工具軟體。

比較新版的Qt其實也已經支援Modbus類別庫了。但這裡為了說明，以及方便大家改寫成其他語言，我們還是從最基本的序列埠讀寫來實現這個測試程式。

這個程式除了提供選擇序列埠的功能以及傳送上個例子使用的控制碼以外，在使用者介面還進一步提供一個水平拉桿，能夠設定指定元件的數值。序列埠如果選擇COM的話，要記得再填上實際的編號。

下圖這個程式在樹莓派以及Ubuntu上的執行畫面，程式完全不用修改。

圖7-1 樹莓派上的SetWidgetValue畫面

圖7-1 Ubuntu上的SetWidgetValuet畫面

CRC運算

CRC運算其實不複雜，以Qt來實現大概就像以下的程式碼：

QByteArray SetWidgetValue::calculateCRC(QByteArray data)
{
uint16_t crc = 0xFFFF;
for(int idx = 0; idx < data.length(); idx++)
{
uint8_t i = (uint8_t)crc ^ data[idx];
crc >>= 8;
crc ^= crcTable[i];
}
QByteArray ba;
ba.append(char(crc & 0xFF));
ba.append(char(crc >> 8));
return ba;
}

其中的 crcTable[] 的內容為：

const uint16_t crcTable[] =
{
0X0000, 0XC0C1, 0XC181, 0X0140, 0XC301, 0X03C0, 0X0280, 0XC241,
0XC601, 0X06C0, 0X0780, 0XC741, 0X0500, 0XC5C1, 0XC481, 0X0440,
0XCC01, 0X0CC0, 0X0D80, 0XCD41, 0X0F00, 0XCFC1, 0XCE81, 0X0E40,
0X0A00, 0XCAC1, 0XCB81, 0X0B40, 0XC901, 0X09C0, 0X0880, 0XC841,
. . .
0X8801, 0X48C0, 0X4980, 0X8941, 0X4B00, 0X8BC1, 0X8A81, 0X4A40,
0X4E00, 0X8EC1, 0X8F81, 0X4F40, 0X8D01, 0X4DC0, 0X4C80, 0X8C41,
0X4400, 0X84C1, 0X8581, 0X4540, 0X8701, 0X47C0, 0X4680, 0X8641,
0X8201, 0X42C0, 0X4380, 0X8341, 0X4100, 0X81C1, 0X8081, 0X4040
};

這裡沒有列出全部內容。github中有完整資料，有興趣可以自行搜尋下載，在這邊技術文章中只需要知道如何運用就好。

資料包裝

下面就是根據UI計算控制碼，然後送到SmartDisplay的關鍵函式：

void SetWidgetValue::on_sbValue_valueChanged(int value)
{
int id = ui->edWidgetID->text().toInt();
sendWidgetValue(id, value);
ui->lbValue->setText(QString::number(value));
}

void SetWidgetValue::sendWidgetValue(int id, int value)
{
QByteArray msg;
uint16_t addr = (uint16_t)(id * 100 + 6);
msg.append(deviceID);
msg.append(writeSingleRegister);
msg.append((uint8_t)addr >> 8);
msg.append((uint8_t)addr & 0xFF);
msg.append((uint8_t)value >> 8);
msg.append((uint8_t)value & 0xFF);
QByteArray msgToSend = msg.append(calculateCRC(msg));
writeSerialPortData(msgToSend);
}

如果您已熟悉Qt，則上述程式碼應該不難理解。若不熟悉的話，花一點時間研究一下，它有些觀念其實還相當不錯，值得深入學習。熟悉之後，對發展跨平台應用程式，或是快速製作系統雛型來說，都是不錯的選擇。

八、進階範例

前面的例子只是針對一個元件值的設定。另外有更完整的範例SmartDisplayConsole供有興趣的讀者進一步了解。下圖是在樹莓派上的執行畫面：

圖8-1 樹莓派上的SmartDisplayConsole畫面

文章最後有github網址，觀迎大家一起參考研究。

九、結語

我們已經說明了控制SmartDisplay的每一個步驟，也提供了多種的控制方式。運用這些知識以及豐富的想像力，相信一定可以激盪出各種不一樣的火花，製作出更多樣性的產品。就讓我們一起用SmartDisplay創造更美好的未來吧！

十、參考資料

Serial Terminal Basics
https://learn.sparkfun.com/tutorials/terminal-basics/command-line-windows-mac-linux

Modbus
https://www.modbustools.com/modbus.html
https://www.modbusdriver.com/doc/mbusmaster.net/modbus.htm

十一、範例原始碼

GettingStartedWithSmartDisplay
https://github.com/Smart-Display-Series/GettingStartedWithSmartDisplay.git

SmartDisplayConsole
https://github.com/Smart-Display-Series/SmartDisplayConsole.git

► 前往技術專區網頁介紹

華凌電子報 第163期