了解WT32-SC01觸摸屏顯示器

WT32-SC01 是一款功能強(qiáng)大的顯示器，可用于各種應(yīng)用。這種寬顯示屏還配備了觸摸屏。亮度高，是實(shí)現(xiàn)多領(lǐng)域項(xiàng)目的理想選擇，對愛好者來說潛力巨大。從不同的角度也可以看到顯示器。本文的主要目的是讓您開始使用 WT32-SC01 開發(fā)系統(tǒng)。在本文之后，將發(fā)布更多有用和復(fù)雜的項(xiàng)目。

開發(fā)板概述

WT32-SC01 是一款帶有可視觸摸屏的開發(fā)板。該板支持拖放圖形編程，以幫助經(jīng)驗(yàn)不足的用戶開發(fā)解決方案。該板的主控制器由 ESP32-wrover-b 模塊、Wi-Fi + 藍(lán)牙 + 藍(lán)牙低功耗 (LE) MCU、4-MB SPI 閃存和 8-MB PSRAM 組成。板子還可以通過兩側(cè)的擴(kuò)展接口調(diào)試按鍵、語音、攝像頭，開發(fā)更簡單。電路板尺寸為 58 × 91 mm，有四個直徑為 4.05 mm 的定位孔。開發(fā)系統(tǒng)由一個分辨率為320×480像素的3.5英寸液晶屏和一個電容式觸摸板組成。Esp32-wrever-b MCU 是一款適用于各種應(yīng)用的 Wi-Fi + 藍(lán)牙 + 藍(lán)牙 LE 模塊。它可用于低功耗傳感器網(wǎng)絡(luò)和重要應(yīng)用。它具有 8-MB PSRAM 和 4-MB 閃存。觸摸板接口是通過 I2C 實(shí)現(xiàn)的電容式接口。通用 USB-C 接口用于為開發(fā)板供電并允許 UART 通信和固件下載。電路硬件實(shí)現(xiàn)數(shù)據(jù)流控制。連接 USB 電纜時，電源指示燈（板上的紅色 LED）會亮起。該卡支持 USB Type-C 5-V 電源。未插入其他擴(kuò)展板時電流不得小于1A；否則，建議使用 2 A 的電流。下面列出了它的一些主要特征：連接 USB 電纜時，電源指示燈（板上的紅色 LED）會亮起。該卡支持 USB Type-C 5-V 電源。未插入其他擴(kuò)展板時電流不得小于1A；否則，建議使用 2 A 的電流。下面列出了它的一些主要特征：連接 USB 電纜時，電源指示燈（板上的紅色 LED）會亮起。該卡支持 USB Type-C 5-V 電源。未插入其他擴(kuò)展板時電流不得小于1A；否則，建議使用 2 A 的電流。下面列出了它的一些主要特征：

• 顯示：3.5英寸液晶屏
• 分辨率：320 × 480 像素
• SOC：ESP32-WROVER-B 模塊
• CPU：雙核 Xtensa 32 位 LX6 MCU
• Wi-Fi：2.4-GHz Wi-Fi 802.11b/g/n 協(xié)議
• 藍(lán)牙：符合 V4.2BR/EDR 和低功耗藍(lán)牙標(biāo)準(zhǔn)
• 擴(kuò)展：2×40-pin I/O pads with GPIO, I2C, VN/VP, I2S, UART, 5 V, 3.3 V, GND
• 電源：DC 5 V/2 A
• 工作溫度：–20?C 至 85?C
• 尺寸：91 × 58 毫米

如何對 WT32-SC01 進(jìn)行編程

WT32-SC01 模塊可以用不同的方法進(jìn)行編程。主要涉及Arduino IDE環(huán)境和塊圖形編程的使用，特別適合不熟悉編程藝術(shù)的人。在本文中，固件基于最新的方法。要使顯示器正常工作，必須安裝或更新 COMn/USB 管理驅(qū)動程序。因此，請下載適用于您的操作系統(tǒng)（Windows 或 macOS）的最新版本的 CP210x USB 轉(zhuǎn) UART 橋 VCP 驅(qū)動程序。編程環(huán)境是在線的，因此您無需在 PC 上安裝任何軟件，并且可以（當(dāng)前）在此處訪問。

免費(fèi)站點(diǎn)注冊并登錄后，按“工作臺”按鈕，該按鈕通常位于右上角。系統(tǒng)提供創(chuàng)建新項(xiàng)目的選項(xiàng)并顯示其所有活動項(xiàng)目。開始新項(xiàng)目時必須采取以下步驟：

• 選擇 ESP32 MCU。
• 寫下你的應(yīng)用程序的標(biāo)題。
• 指定使用的硬件——在我們的例子中，Esp32_WT32-SC01（橫向或縱向）。
• 選擇應(yīng)用程序主題（默認(rèn)、燈光、材質(zhì)、外星人、禪宗、尼莫、單聲道）。
• 寫下項(xiàng)目的任何描述。
• 添加任何標(biāo)簽。

確認(rèn)后，應(yīng)用程序編輯器屏幕打開，如圖 2 所示。在這里，您可以添加和編程所有項(xiàng)目控件，例如按鈕、圖像、滑塊、文本等等。可以創(chuàng)建許多不同的屏幕，甚至是不同的顏色。編輯器環(huán)境非常簡單友好，用戶可以在幾分鐘內(nèi)輕松創(chuàng)建應(yīng)用程序，在屏幕上提供許多不同類型的控件。

圖 2：應(yīng)用程序編輯器

使用WT32-SC01 顯示器創(chuàng)建項(xiàng)目

該項(xiàng)目非常簡單，僅涉及顯示器和觸摸屏的使用。它的目的是熟悉系統(tǒng)，以便在未來創(chuàng)建更復(fù)雜的解決方案。實(shí)際上，屏幕必須顯示一個帶有三個按鈕和三個 LED 的窗口。這些按鈕分別具有“紅色”、“黃色”和“綠色”標(biāo)簽。按下紅色按鈕，紅色LED二極管亮；按下黃色按鈕，黃色 LED 二極管亮起；按下綠色按鈕，綠色 LED 二極管亮起。這是一個成熟的紅綠燈。屏幕還顯示交通燈的剪貼畫，以顯示系統(tǒng)的圖形可能性。事實(shí)上，可以包含任何類型的圖像或照片。這三個按鈕還有另一個用途：如果其中一個被按下超過半秒，交通燈將被重置，并且所有 LED 都會亮起。該項(xiàng)目基于通過圖形塊（Blockly）編寫代碼。圖 3 顯示了編碼，即使對于非專家來說，它實(shí)際上也非常易讀和簡單。每個按鈕都包含一個特定的圖形塊。它提供了兩種操作：

• 短按打開一個特定的 LED 二極管并關(guān)閉另外兩個。
• 長按可重置固件流程，打開所有 LED。

這是一個非常簡單但非常具有教育意義的項(xiàng)目。圖形塊（例如紅色按鈕）基于以下方法和操作層次結(jié)構(gòu)：

• 當(dāng)button_red

• 點(diǎn)擊
  • 將 LED 紅色設(shè)置為真
  • 將 LED 黃色設(shè)置為 False
  • 將 LED 綠色設(shè)置為 False
• 長按
  • 將 LED 紅色設(shè)置為真
  • 將 LED 黃色設(shè)置為真
  • 將 LED 綠色設(shè)置為真

圖 3：使用塊對程序進(jìn)行編程

在編輯器中準(zhǔn)備好所有圖形元素并對各種事件進(jìn)行編程后，您可以通過訪問“編譯”菜單中的“編譯”項(xiàng)來編譯項(xiàng)目。如果沒有錯誤，該過程需要幾分鐘來生成二進(jìn)制文件。最后，您可以通過訪問“編譯”菜單中的“下載 Bin”項(xiàng)將項(xiàng)目的二進(jìn)制文件下載到 PC 上。這是一個 ZIP 存檔，只應(yīng)從中提取最大的文件（通常，其名稱為“qmsd-demo.bin”）。下載二進(jìn)制文件后，需要將其加載到 WT32-SC01 的 ESP32 設(shè)備上。為此，有幾種解決方案，如下圖，按操作難度從高到低排列：

• ESPHome-Flasher
• flash_download_tool
• esptool.exe

在本文的示例中，我們選擇使用第一個，因?yàn)樗氖褂梅浅：唵?，而且很多配置都是自動化的?/font>圖 4 顯示了 ESPHome-Flasher 軟件的固件加載會話，可從互聯(lián)網(wǎng)免費(fèi)下載。在加載固件之前，需要指定連接 WT32-SC01 的虛擬 COM 端口，當(dāng)然還有要加載的二進(jìn)制文件。最后，您可以按下“Flash ESP”按鈕。對 MCU 進(jìn)行編程需要幾秒鐘。建議仔細(xì)閱讀軟件產(chǎn)生的日志消息。

圖 4：在設(shè)備上加載固件時的“ESPHome-Flasher for Windows”

執(zhí)行立即開始，并在屏幕上重現(xiàn)在編輯器中創(chuàng)建的確切項(xiàng)目及其功能流程。在圖 5 中，可以在在線編輯器中觀察項(xiàng)目以及最終原型的實(shí)際執(zhí)行情況。

圖 5：運(yùn)行中的紅綠燈原型

有趣的是，整個項(xiàng)目被翻譯并轉(zhuǎn)換成真正的源代碼，免費(fèi)提供：

?

#define BLOCKLY_button_red_EVENT_HANDLER

void __qmsd_button_red_cb(lv_obj_t* obj,lv_event_t 事件);

?

#define BLOCKLY_button_yellow_EVENT_HANDLER

void __qmsd_button_yellow_cb(lv_obj_t* obj,lv_event_t 事件);

?

#define BLOCKLY_button_green_EVENT_HANDLER

void __qmsd_button_green_cb(lv_obj_t* obj,lv_event_t 事件);

?

void __qmsd_button_red_cb(lv_obj_t * obj, lv_event_t 事件) {

如果（事件 == LV_EVENT_SHORT_CLICKED）{

lv_led_on(led_red);

lv_led_off(led_yellow);

lv_led_off(led_green);

} else if (event == LV_EVENT_LONG_PRESSED||event == LV_EVENT_LONG_PRESSED_REPEAT) {

lv_led_on(led_red);

lv_led_on(led_green);

lv_led_on(led_yellow);

}

}

?

無效__qmsd_button_yellow_cb（lv_obj_t * obj，lv_event_t事件）{

如果（事件 == LV_EVENT_SHORT_CLICKED）{

lv_led_on(led_yellow);

lv_led_off(led_red);

lv_led_off(led_green);

} else if (event == LV_EVENT_LONG_PRESSED||event == LV_EVENT_LONG_PRESSED_REPEAT) {

lv_led_on(led_red);

lv_led_on(led_green);

lv_led_on(led_yellow);

}

}

?

void __qmsd_button_green_cb(lv_obj_t * obj, lv_event_t 事件) {

如果（事件 == LV_EVENT_SHORT_CLICKED）{

lv_led_on(led_green);

lv_led_off(led_red);

lv_led_off(led_yellow);

} else if (event == LV_EVENT_LONG_PRESSED||event == LV_EVENT_LONG_PRESSED_REPEAT) {

lv_led_on(led_red);

lv_led_on(led_green);

lv_led_on(led_yellow);

}

}

結(jié)論

重要的是要強(qiáng)調(diào)您的應(yīng)用程序可以導(dǎo)出并保存在您的計算機(jī)上。這是讓您的工作隨時可用并避免僅依賴互聯(lián)網(wǎng)連接的絕佳方式。然后可以導(dǎo)入您自己的項(xiàng)目。當(dāng)然，您可以擴(kuò)展項(xiàng)目以滿足您的特定要求。例如，可以通過適當(dāng)?shù)碾娫醇せ钕到y(tǒng)將 GPIO 連接到真正的 LED 二極管或燈泡來控制它們。開發(fā)人員可以選擇他們最熟悉的編程語言并創(chuàng)建他們項(xiàng)目的最佳版本。


審核編輯：劉清