FireBeetle2-ESP32-C5 将方块躲避游戏搬上手机


之前基于树莓派RP2350设计过一个方块碰撞的游戏,支持物理按键控制,得益于ESP32的加持,可玩性更强了。于是,一个支持物理按键 + 手机Web双重控制的方块躲避小游戏就诞生了!

这玩意儿最骚的操作是,你既可以像传统游戏机一样,用两个物理按键“哒哒哒”地玩;也可以掏出手机,连!上它自己发的WiFi,在网页上点点点来控制。甚至还能显示DHT11传上来的实时温湿度,假装自己很高端。

视频展示: https://www.bilibili.com/video/BV1p14vzXEVL/

接线图

  • ESP32开发板 x 1
  • DHT11温湿度传感器 x 1
  • 0.96寸OLED小屏 x 1
  • 按键 x 2
  • 面包板、杜邦线若干

接线图我就直接用文字版了,一目了然:

ESP32   →   外设
---------------------
GPIO26  →   DHT11数据脚
GPIO9   →   OLED SDA
GPIO10  →   OLED SCL
GPIO27  →   左按键
GPIO28  →   右按键
3.3V/GND → 共用电源

折腾的重点:Web控制是怎样炼成的

这部分是整个项目最有趣的地方。过程很简单:

  1. ESP32通电后会自己建一个名叫 SUROY_AP 的WiFi热点 (密码: 88888888)。
  2. 手机连上这个WiFi。
  3. 打开浏览器,访问OLED屏幕上显示的IP地址(通常是 192.168.4.1)。
  4. Duang!一个控制界面就出来了。

为了让这个界面在手机上不那么丑,我还特地手搓了一点响应式CSS,背景还带个渐变,聊胜于无嘛,哈哈。分数、温湿度都能在网页上实时刷新,科技感(廉价感)这不就上来了吗?

聊聊技术实现和踩过的坑

写代码的过程还算顺利,但坑嘛,肯定是有的,不然还叫什么DIY!

大坑一:游戏卡成PPT!

一开始天真了,以为直接让ESP32等着网络请求就行,结果游戏逻辑和网络服务打架,一有人连WiFi,游戏就卡得像PPT。

解决方案:把网络服务改成非阻塞模式。简单说就是,有人连接我才理你,没人连接我就专心跑游戏,互不耽误。

为了更直观地展示这个双控制流程,我画了个简单的图:

大坑二:手机点太快,ESP32反应不过来

网页上快速连点“左”,“右”,命令发得太快,ESP32处理不过来就容易丢命令,导致操作失误。

解决方案:搞了个简单的命令队列 (就是上图那个流程)。Web发来的命令不直接执行,先扔进一个队列里,游戏主循环再按顺序一个个取出来处理,稳得一批。

还有些小坑:比如MicroPython自带的JSON库有时候不太听话,最后干脆自己拼字符串了;不同手机浏览器千奇百怪,调CSS兼容性调到头秃……不说了,都是泪。

玩起来咋样?主观体验!

  • 物理按键:没得说,指哪打哪,延迟超低,有种玩小霸王的感觉。清脆的按键声,是硬核玩家的浪漫!
  • Web控制:方便是真方便,躺在床上就能玩。延迟肯定比物理按键高一点(毕竟隔着WiFi),大概50-100ms,但玩这种小游戏完全足够了。
  • 混合模式:最逗的是可以俩人一起玩,一人按键一人搓手机,看谁先把谁坑死,哈哈!聚会时绝对是个整活小能手。

    下一步还想怎么折腾?

目前还只是个V1.0的玩具,脑子里已经有一堆想加的功能了:

  • 加个蜂鸣器,搞点BGM和音效
  • 搞个难度选择,越往后方块掉越快
  • 断电也能保存最高分的排行榜
  • (终极梦想) 联机对战!

总结一下

“物联网”——它不只是让设备连个网那么简单,而是能把硬件的即时反馈和软件的灵活交互真正融合起来,创造出很多新奇的玩法。用MicroPython开发效率是真的高,从有想法到实现,一个周末足矣。

对于想学习ESP32开发的朋友来说,这是个很好的入门项目。对于老手来说,这个双控制模式的思路也许能给你一些启发。


开源地址: https://github.com/zsuroy/iblock-dodge-esp32

代码已经整理好,放上来了,注释写得应该还算清楚,欢迎各位大佬围观、Star、Fork三连!


本文同步更新到 DFRobot 社区。

声明:Grows towards sunlight |版权所有,违者必究|如未注明,均为原创|本网站采用BY-NC-SA协议进行授权

转载:转载请注明原文链接 - FireBeetle2-ESP32-C5 将方块躲避游戏搬上手机


Grows towards sunlight and Carpe Diem