用Firebeetle ESP32-E复刻辐射中的哔哔小子手表（PiP Watch）

1. 项目简介
Pip-Watch 是由海外用户Arnov Sharma 受《辐射》游戏系列启发进而开发的一款创新智能手表项目。该项目使用 Firebeetle ESP32-E 开发板和 GC9A01 圆形 LCD 显示屏，具有显示时间和日期的基本功能。这个手表项目不仅展示了硬件的组装，还包括详细的代码实现，适合电子爱好者和开发人员参考。  

2. 组件清单
1. Firebeetle ESP32-E 开发板：这块板子是项目的核心处理器，负责所有逻辑控制和 WiFi 连接。
2. GC9A01 圆形 LCD 显示屏： 240x240 分辨率的圆形彩色 LCD 显示屏，通过四线 SPI 通信接口连接。
3. 7V 2200mAh 锂电池：作为项目的主要电源，通过 Firebeetle 板上的电池端口供电。


3. 原型设计
我研究了许多Pipboy的设计，包括粉丝作品和原版设计。这里我用Fusion360围绕现有组件建模，创建了类似Pipboy的设计，包括显示屏、Firebeetle板和锂电池。虽然Pipwatch借鉴了Pipboy的一些设计元素，但并非完全复制。另外还测量了手腕并在Cad程序中建模。腕夹通过铰链与主表连接，使用超级磁铁固定。佩戴时，只需用力分开磁铁接缝，腕夹就会打开，方便佩戴。选择磁铁而非卡扣是因为PLA材料不适合制作卡扣，3D打印的卡扣不耐用，而磁铁锁简单易制，不易损坏。整个模型由主体、侧盖、前屏幕支架、下铰链夹和PipWatch标志名牌五个部分组成。名牌打印时使用了双色技术，先用白色PLA打印一半，再换成灰色PLA，使字母呈现灰色，底座为白色。所有部件都使用白色大理石PLA和0.4毫米喷嘴3D打印。

4. 硬件选择
在这个项目中，我使用了DFROBOT的FireBeetle 2 ESP32-E板，主要原因之一是利用其集成的TP4056锂电池电源管理芯片。板载的ESP-WROOM-32E非常适合处理与显示相关的项目，因此是这个项目的理想选择。可以在产品的wiki页面查看更多关于该开发板的信息
屏幕方面，我使用了GC9A01，这是一款240x240的圆形RGB LCD显示屏，采用四线SPI通信接口。SPI速度快，可以大大节省GPIO端口，并且通信速度更快。它的尺寸与240x240的方形LCD相似，但边缘是圆形的。这款LCD使用的内置驱动是GC9A01，分辨率为240RGB×240点。更多信息请查看其wiki页面
我还在这个项目中使用了一块3.7V、2200mAh的锂离子电池，作为项目的主要电源。

5. 硬件连接
显示屏连接：
- VCC 连接到 3.3V
- GND 连接到 GND
- DIN (MOSI) 连接到 GPIO23
- CLK (SCK) 连接到 GPIO18
- CS 连接到 GPIO15
- DC 连接到 GPIO02
- RST 连接到 GPIO04

电池连接：
将正极和负极连接到 Firebeetle 板上的相应端口，并通过一个摇杆开关控制电源的开关。

6. 代码与TFT_eSPI 设置

项目代码使用了 WiFi 和 NTP 客户端库，通过互联网获取当前时间和日期，并显示在 LCD 屏幕上。以下是主要代码

#include <WiFi.h>
#include <NTPClient.h>
#include <WiFiUdp.h>

#include <TFT_eSPI.h>
TFT_eSPI tft = TFT_eSPI();

// Replace with your network credentials
const char *ssid = "YOUR SSID";
const char *password = "YOUR PASS";

// Define NTP Client to get time
WiFiUDP ntpUDP;
NTPClient timeClient(ntpUDP);

// Variables to save date and time
String formattedDate;
String dayStamp;
String timeStamp;

void setup() {
  // Initialize Serial Monitor
  Serial.begin(115200);
  Serial.print("Connecting to ");
  Serial.println(ssid);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  // Print local IP address and start web server
  Serial.println("");
  Serial.println("WiFi connected.");
  Serial.println("IP address: ");
  Serial.println(WiFi.localIP());

// Initialize a NTPClient to get time
  timeClient.begin();
  // Set offset time in seconds to adjust for your timezone, for example:
  // GMT +1 = 3600
  // GMT +8 = 28800
  // GMT -1 = -3600
  // GMT 0 = 0
  timeClient.setTimeOffset(19800);
  tft.init();
  tft.setRotation(4); // Adjust rotation if needed

}

void loop() {
  while(!timeClient.update()) {
    timeClient.forceUpdate();
  }

  formattedDate = timeClient.getFormattedDate();
  Serial.println(formattedDate);

  int splitT = formattedDate.indexOf("T");
  dayStamp = formattedDate.substring(0, splitT);

 tft.fillScreen(TFT_BLACK); // Clear the screen
  tft.setCursor(35, 40); // Set cursor position
  tft.setTextColor(TFT_GREEN); // Set text color
  tft.setTextSize(2); // Set text size
  tft.print("DATE: "); // Print DATE
  Serial.print("DATE: ");


  tft.setCursor(32, 60); // Set cursor position
  tft.setTextColor(TFT_GREEN); // Set text color
  tft.setTextSize(3); // Set text size
  tft.print(dayStamp); // Print text 
  Serial.println(dayStamp);

  
  // Extract time
  timeStamp = formattedDate.substring(splitT+1, formattedDate.length()-1);
 
  tft.setCursor(35, 100); // Set cursor position
  tft.setTextColor(TFT_GREEN); // Set text color
  tft.setTextSize(2); // Set text size
  tft.print("HOUR: "); // Print text 
  Serial.print("HOUR: ");

  tft.setCursor(32, 120); // Set cursor position
  tft.setTextColor(TFT_GREEN); // Set text color
  tft.setTextSize(3); // Set text size
  tft.print(timeStamp); // Print text 
  Serial.println(timeStamp);

  tft.setCursor(32, 170); // Set cursor position
  tft.setTextColor(TFT_GREEN); // Set text color
  tft.setTextSize(3); // Set text size
  tft.print("pipBOY"); // Print text 

  delay(500);
}
复制代码

你需要根据自己所在时区调整 timeClient.setTimeOffset() 函数的参数。查找你所在位置的 GMT 偏移量，并将其替换为 timeClient.setTimeOffset(19800); 中的 19800。我在印度，该地区的 GMT 偏移量为 19800。
我这里使用了 Bodmer 的 TFT_eSPI 库，要求用户编辑位于 C:\Users\user\OneDrive\Documents\Arduino\libraries\TFT_eSPI 路径的用户设置文件，选择使用的显示屏。
在本例中，我们使用的是 GC9A01 显示屏并添加了相关用户数据。可以从TFT_eSPI 库获取该库


7. 组装过程
1. 铰链夹组装：添加螺纹嵌件
- 首先，将 M3 螺纹嵌件插入夹子的铰链部分。这些嵌件用 M3 螺栓固定，使其可以旋转并保持牢固。
- 使用加热到 150 摄氏度的烙铁将 M3 螺纹嵌件压入塑料中，固定在适当位置。
- 重复此步骤，将螺纹嵌件安装在铰链的另一侧。

2. 安装磁铁
- 将四个超强磁铁压入铰链夹的指定孔中。
- 使用两个 M3 螺栓将主体和铰链夹连接在一起，使其稳固。

3. 电子部件组装
- 将 Firebeetle 板定位并用热熔胶固定在手表主体上。
- 将摇杆开关安装在侧面盖上，并重新连接电池端子。
- 安装锂电池并将侧面盖用三个 M2 螺丝固定到主体上。

4. 前屏幕支架组装
- 将 38mm 的圆形亚克力板放入前屏幕支架部分，作为屏幕与主体之间的保护层。
- 使用热熔胶固定圆形屏幕和亚克力板。
- 将屏幕支架组件用 M2 螺丝固定在主体上。

5. 最后处理
- 将 PipWatch 名牌放置在设备顶部，并用四个 M2 螺丝固定。

8. 成果展示
这个项目最终实现了一个可以联网并显示当前时间和日期的 PipWatch。这款数字手表设计非常简单，主要关注手表的外观。通过修改代码，我们还可以添加 Vault Boy 的 gif 动画。本文包含了制作 PipWatch 所需的代码和其他必要文件。总体而言，这次尝试是成功的，我将很快准备一个实物大小的 PipBoy。

9. 素材
- cad file
- 接线图
- code C/C++


原文链接：https://www.hackster.io/Arnov_Sharma_makes/pip-watch-project-370245#toc-main-code-and-tft-espi-setup-3
原作者：Arnov Sharma
发表时间：2024年5月17日

啥？没懂,不过貌似

刘睿鹏 发表于 2024-5-23 10:30
啥？没懂,不过貌似

哎哪里没懂？

GIF动画版图解，

许培享 发表于 2024-5-24 09:31
GIF动画版图解，

太太太太太太太太太太太太太厉害了！

5uLNqWSF3MUs 发表于 2024-6-2 15:36
太太太太太太太太太太太太太厉害了！

学学学学学学学学学学学学起来！