基于ESP32制造有趣的超級(jí)馬里奧主題時(shí)鐘

MAKER:jnthas／譯：趣無盡

這是一款超級(jí)馬里奧主題的時(shí)鐘，基于 ESP32 和彩色點(diǎn)陣制造，非常生動(dòng)有趣。

馬里奧會(huì)站在舞臺(tái)上頂起磚塊來更新時(shí)間數(shù)字。除了馬里奧表盤之外，我們還會(huì)制作了一個(gè)會(huì)文字顯示時(shí)間的表盤，顯示世界地圖上的時(shí)間的表盤和一個(gè)模擬時(shí)鐘的表盤。
所有這些資料都可以在 Clockwise’s 網(wǎng)站上找到。除了時(shí)鐘的外觀，之后我們還考慮添加一些其他功能，例如：電子郵件通知、天氣預(yù)報(bào)、新聞、交通、向順時(shí)針發(fā)送短信等。

組件清單

ESP32 開發(fā)板/ESP32 Trinity × 1
64×64 RGB LED × 1
5v 電源 × 1

自制 PCB 板

期初開發(fā)的時(shí)候，我使用 ESP32 來控制 LED 矩陣。對(duì)于沒法自制 PCB 板的新手來說 ESP32 開發(fā)板是非常不錯(cuò)的選擇。如何利用好板子取決于你拍線的能力。

你只需按照 GitHub 上顯示驅(qū)動(dòng)程序的接線的說明進(jìn)行操作，也可以尋求接線圖的幫助。

具體可以參考：
https://github.com/mrfaptastic/ESP32-HUB75-MatrixPanel-I2S-DMA#2-wiring-esp32-with-the-led-matrix-panel/

在完成時(shí)鐘的基本代碼后，我準(zhǔn)備自制一塊的 PCB 板。它可以控制顯示器的電路板。

具體詳情可查看：
https://github.com/jnthas/clockwise/tree/main/firmware/

推薦一個(gè)很棒的平臺(tái)——Tindie，全球各地的制造商都會(huì)在這里創(chuàng)建和銷售他們的項(xiàng)目。

在這里我找到更好的板子——ESP32 Trinity，它帶有觸摸感應(yīng)按鈕、LDR（可以用它調(diào)節(jié)顯示器的亮度）、USB-C、電源控制等。

查看更多信息：
https://github.com/witnessmenow/ESP32-Trinity/

刷固件

如果你不想了解代碼的工作原理、設(shè)置和配置，只是想檢查它是否正常工作，你可以使用 Mario Bros. Clock 安裝程序，然后上傳固件。因?yàn)樗呀?jīng)編譯，你無需安裝任何東西。將 ESP32 插入 USB 端口，然后單擊 P-Switch 閃爍即可。

https://jnthas.github.io/mariobros-clock/

配置 WiFi

第一次運(yùn)行時(shí)，需要配置 WiFi。通過智能手機(jī)或筆記本電腦連接到 “Clockwise-Wifi”，密碼為：12345678，再點(diǎn)擊配置 WiFi，選擇你的 AP，輸入密碼和時(shí)區(qū)并保存。然后時(shí)鐘就可以連接到 NTP 服務(wù)器并獲取正確的時(shí)間。它使用的是 2.4GHz WiFi，不適用于 5G。

關(guān)于時(shí)區(qū)

WiFi Manager 可以收集時(shí)鐘中使用的時(shí)區(qū)參數(shù)并確保顯示正確的時(shí)間。例如 NTP 客戶端時(shí)，默認(rèn)時(shí)間為 UTC，我們需要在 Wifi 設(shè)置中告知正確的時(shí)區(qū)。所有時(shí)區(qū)可點(diǎn)解這里查看：
https://en.wikipedia.org/wiki/List_of_tz_database_time_zones/

對(duì)于我而言，在 WiFi 管理器的時(shí)區(qū)字段中輸入“America/Sao_Paulo”即可。如果你想了解更多關(guān)于 NTP 服務(wù)器工作的信息，可點(diǎn)擊此處查看：
https://lastminuteengineers.com/esp32-ntp-server-date-time-tutorial/

源代碼

通常，我會(huì)使用 PlatformIO 開發(fā)固件，如果你不知道，推薦試試。但在本項(xiàng)目中，我使用 Arduino IDE ，項(xiàng)目會(huì)更簡單一些。存儲(chǔ)庫中的代碼與 ESP32-HUB75-MatrixPanel-I2S-DMA 庫一起使用，同時(shí)我也使用了 PxMatrix 并且一切正常。你只需要替換庫而不需要進(jìn)一步更改代碼，因?yàn)槎际腔?Adafruit_GFX。

https://github.com/mrfaptastic/ESP32-HUB75-MatrixPanel-I2S-DMA/

https://github.com/2dom/PxMatrix/

為了讓它在 Arduino IDE 中工作，我需要稍微修改一下項(xiàng)目結(jié)構(gòu)，所有文件都與 mariobros-clock.ino 一起進(jìn)入根目錄。第一次看到時(shí)可能會(huì)有點(diǎn)混亂，我會(huì)試著在這里整理一下。

源代碼可點(diǎn)擊這里查看：
https://github.com/jnthas/mariobros-clock/

該結(jié)構(gòu)是由三個(gè)文件夾和文件樹組成。

clockface：包含圖形、字體、圖標(biāo)等以及馬里奧的顯示。
commons：包含通用實(shí)用程序，例如日期、時(shí)間和 Wifi 的配置。
engine：包含顯示器中一般使用功能的實(shí)現(xiàn)，例如繪制風(fēng)景、精靈、事件等功能。

.
├── clockface
│   ├── Clockface.cpp
│   ├── Clockface.h
│   └── gfx
│       ├── assets.h
│       ├── block.cpp
│       ├── block.h
│       ├── mario.cpp
│       ├── mario.h
│       └── Super_Mario_Bros__24pt7b.h
├── commons
│   ├── CWDateTime.cpp
│   ├── CWDateTime.h
│   ├── IClockface.h
│   └── WiFiConnect.h
├── engine
│   ├── EventBus.cpp
│   ├── EventBus.h
│   ├── EventTask.h
│   ├── Game.h
│   ├── Locator.cpp
│   ├── Locator.h
│   ├── Object.h
│   ├── Sprite.cpp
│   ├── Sprite.h
│   └── Tile.h
└── mariobros-clock.ino

有了這種結(jié)構(gòu)，組裝好后就能夠顯示出圖片中的時(shí)鐘了。在靜態(tài)物體的風(fēng)景的基本上，我們有兩個(gè)動(dòng)態(tài)的小精靈，馬里奧和積木。馬里奧每分鐘跳躍一次并擊中積木。

代碼邏輯如下：

1) mario.jump()              // changes the sprite and starts the jump animation
2) mario.collidesWith(block) // if collision is detected, mario reverses the movement and starts to fall,
                             // the blocks starts an upward movement already with the new time set
3) Block reaches the ascent limit and starts to fall until it reaches the starting position.
4) Mario hits the ground and returns to the initial state

IDE 設(shè)置

在運(yùn)行之前，需要從 Arduino Library Manager 安裝一些庫。
1、ESP32-HUB75-MatrixPanel-I2S-DMA：搜索 ESP32 HUB75 MATRIX。
2、Adafruit GFX：搜索 Adafruit GFX。
3、FastLED：搜索 FastLED。
4、Fabrice Weinberg 的 NTPClient – 搜索 NTPClient。
5、Adafruit BusIO：搜索同名。
6、Michael Margolis版本的Time：搜索 timelib。
7、tzapu的WiFi Manager：搜索 wifimanager。
8、ezTime：搜索同名。

安裝所有庫并選擇正確的板后，將它們上傳后就可以工作了。按照固件部分提供的說明配置 wifi。

3D 打印

為了讓鐘更容易掛在墻上，我在 TinkerCAD 創(chuàng)建了一個(gè)外殼。3D 建模并不是我的強(qiáng)項(xiàng)，但效果很好。我以家里的顯示器為例建模。

不同的顯示器，孔位可能會(huì)不一樣。

可以改進(jìn)的地方
1、通過 WebSerial API 更改表盤。創(chuàng)建一個(gè)網(wǎng)絡(luò)應(yīng)用程序，你只需選擇所需的表盤即可更新固件。
2、創(chuàng)建通知小部件并在表盤上顯示它們，它們可以在網(wǎng)絡(luò)應(yīng)用程序中進(jìn)行配置。
3、將 MQTT 集成到表盤中，以便在任何地方都可以接收這些通知。
4、創(chuàng)建更多表盤。

這是一個(gè)開源的項(xiàng)目，大家也可以自行二次開發(fā)。

項(xiàng)目所用的代碼在本項(xiàng)目文件庫中可以下載：
https://make.quwj.com/project/452

via instructables.com/Mario-Bros-Clock/

審核編輯：湯梓紅