创建一个动画马里奥时钟的教程分享

　　《超级马里奥世界》可能是我儿时玩得最多的游戏之一。所以我与这个小小的水管工——马里奥有着深厚的情感联系。该系列的第一款游戏在 NES 上具有革命性意义，为 80 年代上半叶正处于糟糕阶段的游戏行业带来了极大的解脱。

　　本文将指导您以非常简单的步骤创建一个动画马里奥时钟，它可以成为任何环境的复古装饰物。

　　补给品

　　ESP32 开发板（速卖通）

　　如果您想要一个即用型显示控制器板，请考虑ESP32 Trinity

　　RGB LED 矩阵 64x64

　　固件

　　电源5v（推荐3A以上）

　　第 1 步：概念

　　我看到一些制造商正在使用 LED 矩阵制作几个项目，并认为也许我可以用这个矩阵制作挂钟，然后顺时针的想法就出现了。Clockwise 的概念是成为一个智能挂钟，我们可以在其中更改屏幕主题并添加对您的上下文有意义的小部件。把它想象成一个智能手表，但在墙上（并且分辨率较低）。

　　我最想拥有的表盘之一是马里奥兄弟的表盘，他站在舞台上敲击积木来改变小时和分钟。我记得在 Pebble 手表的美好时光看到并喜欢这种皮肤，并且一直想要类似的东西。我的意思是，这个想法太好了，我想在其他地方使用它。

　　除了这个表盘之外，我还制作了一个以文字显示时间的表盘，另一个显示世界地图上的时间的表盘，以及另一个模拟模拟时钟的表盘。所有这些都可以在顺时针的网站上找到。除了时钟的外观，我还想添加一些功能，例如：电子邮件通知、天气预报、新闻、交通、向顺时针发送短信的可能性以及无数其他想法。但是对于这篇文章，让我们关注马里奥的时钟。

　　LED 矩阵由 ESP32 控制，这就是我在开发初期使用的，如上图所示。对于那些有兴趣创建这个项目并且无法创建或购买将控制显示器的 PCB 的人来说，一个简单的 ESP32 开发板将像一个魅力一样工作，并且取决于你如何组织这束电线，它可能是最终的版本也是。只需按照显示驱动程序的 GitHub 上有关接线的说明进行操作，或者下一节中的接线图可以提供帮助。

　　第 2 步：我自己的 PCB

　　完成时钟的基本代码后，我需要一块 PCB。我真的很想把时钟挂在墙上，所以我开始制作我的第一块 PCB 的原型。我买了一台低功率激光器并将其安装到我的 3D 打印机上，这样我就可以设计控制显示器的电路板。这个设计工作得很好，虽然它需要一些改进。你可以在Github上找到它。

　　让我们的 PCB 更专业

　　Tindie 一直是一个很棒的平台，来自世界各地的制造商可以在这里创建和销售他们的项目。Brian Lough 就是其中之一，几年前我在社交网络上认识了他，从那时起，他一直在 ESP32 Trinity 上工作，这是一个经过测试且随时可用的板来控制这些显示器。在这种情况下，它再合适不过了，您所要做的就是将电路板插入显示器，上传固件，瞧。正因为如此，我已经淘汰了我开发的 PCB，Trinity 已经拥有我需要的一切，甚至更多，它甚至带有触摸感应按钮、LDR（我们可以用它调节显示器的亮度）、USB-C、电源控制等等，您可以点击这里查看更多详细信息

　　第 3 步：固件

　　如果您不想详细了解代码的工作原理、设置、配置，而只是想看看它是否正常工作。您可以使用 Mario Bros. Clock 安装程序来上传固件，而无需安装任何东西，也无需任何努力，因为它已经编译。只需将 ESP32 插入 USB 端口，然后单击 P-Switch 即可闪烁。点击这里安装程序。

　　配置 WiFi

　　第一次运行时，你需要配置WiFi，通过智能手机或笔记本电脑连接到密码12345678的“Clockwise-Wifi”接入点，点击“配置WiFi”并选择你的AP，输入你的密码和您的时区并保存。然后时钟可以连接到 NTP 服务器以获取正确的时间。使用 2.4GHz WiFi 很重要，它不适用于 5G。

　　关于时区

　　WiFi Manager 负责收集时钟中使用的时区参数以正确显示时间。实例化 NTP 客户端时，默认时间为 UTC，我们需要在 Wifi 设置过程中告知正确的时区。此处列出了所有可用的时区名称，例如 America/New_York、Asia/Dubai、Europe/Paris 等。就我而言，我在 WiFi 管理器的时区字段中输入“America/Sao_Paulo”，仅此而已。如果您想了解更多关于 NTP 服务器的工作原理，我建议您阅读这篇文章。

　　第 4 步：源代码

　　我通常使用 PlatformIO 为我的项目开发固件。如果你还不知道，我建议你试一试。但是对于这篇文章，我决定使用 Arduino IDE 来让事情变得更简单。存储库中的代码已准备好与ESP32-HUB75-MatrixPanel-I2S-DMA库一起使用，但我也使用了 PxMatrix并且一切正常。我相信您只需要替换库而无需进一步更改代码，因为基类是Adafruit_GFX。

　　为了让它在 Arduino IDE 中工作，我不得不稍微修改一下项目结构，所有文件都与mariobros-clock.ino一起进入了根目录，当你第一次看到它时可能会有点混乱。我会试着在这里整理东西。但在我忘记之前，源代码可点击这里找到。

　　该结构由以下三个文件夹和文件树组成。

　　clockface ： 包含图形、字体、图标等以及马里奥的实现

　　commons：包含通用实用程序，例如日期/时间和 Wifi 配置

　　engine ： 包含一般显示使用的实现，如绘制风景、精灵、事件等的函数。

. ├── 表盘 │ ├── Clockface.cpp │ ├── Clockface.h │ └── gfx │ ├── assets.h │ ├── block.cpp │ ├── block.h │ ├── mario.cpp │ ├── mario.h │ └── Super_Mario_Bros__24pt7b.h ├── 公地 │ ├── CWDateTime.cpp │ ├── CWDateTime.h │ ├── IClockface.h │ └── WiFiConnect.h ├── 发动机 │ ├── EventBus.cpp │ ├── EventBus.h │ ├── EventTask.h │ ├── Game.h │ ├── Locator.cpp │ ├── Locator.h │ ├── Object.h │ ├── Sprite.cpp │ ├── Sprite.h │ └── Tile.h └── mariobros-clock.ino

　　有了这种结构，就可以组装看起来像所附图像的时钟。基本上我们有静态物体的风景。我们有两个元素，马里奥和积木。马里奥每分钟跳跃一次并击中积木，事件顺序如下：

　　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

　　第 5 步：IDE 设置

　　在运行之前需要安装一些库，所有这些都可以从 Arduino Library Manager 安装。

　　ESP32-HUB75-MatrixPanel-I2S-DMA：搜索“ESP32 HUB75 MATRIX”

　　Adafruit GFX - 搜索“Adafruit GFX

　　FastLED - 搜索“FastLED”

　　Fabrice Weinberg 的NTPClient - 搜索“NTPClient”。

　　Adafruit BusIO - 只需搜索相同的名称

　　Michael Margolis 的时间- 搜索“timelib”。

　　WiFi Manager by tzapu - 一起搜索“wifimanager”

　　ezTime - 搜索同名

　　安装所有库并选择正确的板后，只需上传它，它应该可以工作。之后，按照固件部分提供的说明配置 wifi。

　　第 6 步：3D 打印

　　为了让挂钟更容易挂在墙上，我在 TinkerCAD 上创建了一个简单的外壳。说实话，3D建模不是我的强项，但效果很好。只是一个建议，这个案例是在我家里的显示器中建模的。不知道会不会兼容所有的显示器型号，孔位可能不一样。我喜欢这个案例，因为它更容易操作显示器。

　　第 7 步：改进计划

　　创建通知小部件并在手表上显示它们，它们可以在网络应用程序本身中进行配置

　　将 MQTT 集成到手表中，以便您可以从任何地方接收这些通知