使用Visuino DIY如何在M5StickC ESP32上顯示時間

描述

在本教程中，我們將學習如何使用 Arduino IDE 和 Visuino 對 ESP32 M5Stack StickC 進行編程，以在 LCD 上顯示時間。

第 1 步：您需要什么

• M5StickC ESP32：你可以在這里買到
• Visuino 程序：下載 Visuino

注意：在此處查看本教程，了解如何安裝 StickC ESP32 板

第 2 步：啟動 Visuino，然后選擇 M5 Stack Stick C 板類型

?

?

?

?

1 / 2

?

啟動Visuino，如第一張圖所示點擊Arduino組件上的“工具”按鈕（圖1）

在 Visuino 出現對話框時，選擇“M5 Stack Stick C”，如圖 2 所示

第 3 步：在 Visuino 中添加和設置組件

?

?

?

?

1 / 4

?

• 單擊“M5 Stack Stick C”板將其選中
• 在“Properties”窗口中選擇“Modules”并點擊“+”展開，選擇“Display ST7735”并點擊“+”展開
• 將方向設置為“goRight” < 這表示 LCD 上的時間方向
• 選擇“元素”并單擊帶有 3 個點的藍色按鈕...
• 元素對話框將顯示
• 在元素對話框中，將“文本字段”從右側拖到左側

單擊左側的“Text Field1”將其選中，然后在“屬性窗口”中單擊顏色并將其設置為“aclOrange”

-同樣在屬性窗口中設置 X:10 和 Y:20，這是您要在 LCD 上顯示時間的位置

-set size:3 這是當時的字體大小

-您可以根據需要設置文本大小和顏色

關閉元素窗口

可選：

單擊“M5 Stack Stick C”板將其選中

在“屬性”窗口中選擇“模塊”并單擊“+”展開，選擇“顯示器 ST7735”并單擊“+”展開它，您將看到“背景顏色”這是顯示器的默認顏色，將其更改為您喜歡的顏色，您也可以設置顯示亮度，默認為 1（最大）您可以將其設置為 0.5 或其他值以使其更暗

6.添加“解碼（分割）日期/時間”組件 7.添加“格式化文本”組件

第 4 步：在 Visuino 設置組件中

?

?

?

?

1 / 2

?

• 選擇“FormattedTxt1”組件并在“屬性”窗口下將“文本”設置為：%0:%1:%2
• 雙擊“FormattedText1”組件并在“元素”對話框中將 3x“文本元素”拖到左側

第 5 步：在 Visuino Connect 組件中

?

• 將“M5 Stack Stick C”>實時鬧鐘（RTC）>引腳[Out]連接到“DecodeDateTime1”組件引腳[In]
• 將“DecodeDateTime1”組件引腳 [Hour] 連接到“FormattedText1”組件“TextElement1”引腳[In]
• 將“DecodeDateTime1”組件引腳 [Minute] 連接到“FormattedText1”組件“TextElement2”引腳[In]
• 將“DecodeDateTime1”組件引腳 [Second] 連接到“FormattedText1”組件“TextElement3”引腳[In]
• 將“FormattedText1”組件引腳 [Out] 連接到“M5 Stack Stick C”板“Display ST7735”>“Text Field1”引腳 [In]

第 6 步：生成、編譯和上傳 Arduino 代碼

?

• 在 Visuino 中，在底部單擊“構建”選項卡，確保選擇了正確的端口，然后單擊“編譯/構建和上傳”按鈕。

第 7 步：播放

如果您為 M5Sticks 模塊供電，顯示屏應開始顯示時間。

恭喜！您已使用 Visuino 完成了 M5Sticks 項目。還附上了我為本教程創(chuàng)建的 Visuino 項目，您可以在此處下載。

您可以在 Visuino 中下載并打開它

第8步：額外：簡單的技巧

您可以使用在 Arduino 中編譯代碼時計算機上的當前時間。

• 為此，只需放下“編譯日期/時間”組件并將其連接到“M5 Stack Stick C”>“實時鬧鐘（RTC）”引腳 [設置]

您可以在此處下載使用此技巧的項目文件。

第 9 步：在下一個教程中。

在下一個教程中，我將向您展示如何制作一款外觀酷炫的手表，您可以在其中使用 StickC 按鈕設置時間??！請繼續(xù)關注并在此處查看我的其他教程。