ESP32 FireBeetle VGA 语音波形显示

2023-10-073540
AI 快速预览详细 收起
本项目展示了如何在VGA显示器上实现实时音频波形显示。硬件方面使用了ESP32 FireBeetle,软件部分通过简单的代码步骤完成。首先,使用cv.scroll(1, 0)函数将屏幕内容右移一个像素;然后,在屏幕最左侧绘制直线cv.drawLine(0, CENTERLINE-value, 0, CENTERLINE+value)。这样就能在VGA显示器上看到音频波形的动态变化,非常适合STEM教育场景,激发孩子对电子和编程的兴趣。
在影视作品中,我们经常能看到使用下面的波形演示声音。这次我们的作品就是在 VGA 显示器上展示实时波形。

ESP32 FireBeetle VGA 语音波形显示图1

硬件方面直接使用之前的设计【参考1】,我们需要做的只是编写软件:

ESP32 FireBeetle VGA 语音波形显示图2


  1. #include "fabgl.h"
  2. const int WIDTH = 640;
  3. const int HEIGHT = 400;
  4. const int BKNOISE = 100;
  5. const int CENTERLINE = 200;
  6. // 实验测试取得,最大的在 155
  7. const int MAXVALUE = 155;
  8. // VGA 显示
  9. fabgl::VGA16Controller DisplayController;
  10. Canvas cv(&DisplayController);
  11. #define AUDIO_IN_PIN    A0            // Signal in on this pin
  12. //int Volume[WIDTH];
  13. void setup() {
  14.   Serial.begin(115200);
  15.   DisplayController.begin();
  16.   // 设定分辨率
  17.   DisplayController.setResolution(VGA_640x400_60Hz);
  18.   cv.setPenColor(Color::Red);
  19.   cv.setBrushColor(Color::White);
  20.   cv.setScrollingRegion(0, 0, WIDTH - 1, HEIGHT - 1);
  21. }
  22. int value = 0;
  23. int maxvalue=0;
  24. void loop() {
  25.   cv.scroll(1, 0);
  26.   value = analogRead(AUDIO_IN_PIN)>>4;
  27.   if (value > BKNOISE) {
  28.     value = value - BKNOISE;
  29.   } else {
  30.     value = 0;
  31.   }
  32.   if (value > BKNOISE) {
  33.     value = value - BKNOISE;
  34.   }
  35.   value=map(value,0,MAXVALUE,0,255);
  36.   cv.drawLine(0, CENTERLINE-value, 0,CENTERLINE+value);
  37.   delay(10);
  38. }
复制代码

代码方面非常简单,只需要2个步骤:
1.     使用  cv.scroll(1, 0) 函数,将屏幕所有内容右移一个像素;
2.     在屏幕最左侧绘制直线
cv.drawLine(0, CENTERLINE-value,0,CENTERLINE+value);
这样就能够实现前面提到的效果,是不是非常简单?

工作测试视频:

参考:

创作许可协议

本项目采用 None(不开放任何权利,保留所有权利) 进行许可。

评论(0)
- 没有更多了 -