最简单DIY基于ESP8266的国产WS2812智能彩灯④（在网页用按钮点亮）

ESP8266和ESP32智能彩灯开发系列文章目录

第一篇：最简单DIY基于ESP8266的智能彩灯①（在网页用按钮点亮普通RGB灯）
第二篇：最简单DIY基于ESP8266的智能彩灯②（在网页用按键和滑动条控制RGB灯）
第三篇：最简单DIY基于ESP8266的智能彩灯③（在网页用按钮+滑动条+手机APP控制RGB灯）
第四篇：最简单DIY基于ESP8266的国产WS2812智能彩灯④（在网页用按钮点亮）

---

---

前言

    daodanjishui物联网核心原创技术之最简单DIY基于ESP8266的国产WS2812智能彩灯④（在网页用按钮点亮）。
    市面上有各种开源智能彩灯控制程序出售，但是有复杂的有简单的，如果想快速入门用网页按键无线点亮国产WS2812RGB灯，这个方案会给你一个快捷高效的方案。

---

一、最简单DIY基于ESP8266的国产WS2812智能彩灯④（在网页用按钮点亮）是什么？

    以前写的点灯程序都是直接点亮LED而已，例如本专栏的第一篇、第二篇和第三篇，没涉及到复杂的PWM或者是时序问题的。这次换了一个智能彩灯方案，采用国产芯片WS2812和WS2811实现智能彩灯调色，主控芯片采用国产ESP8266，支持国产从我做起，反对霸权主义，反对技术封锁，反对芯片垄断。现在很多建筑物墙上布置的彩灯就是这个系列的彩灯，这每一个彩灯里面是包含有WS2812芯片的，当这个彩灯数量达到一定级别的时候，炫酷的效果就出来了。为了学习这个彩灯，daodanjishui花血本在某宝买了33片8X8=64的WS2812矩阵彩灯，一个矩阵大概要20块，所以总价值20*33=660块，后期会将这些矩阵彩灯拼接起来加入图像处理和智能app客户端和电脑客户端去控制彩灯，在2021年新冠状病毒居家隔离过年的时候写了一批量代码出来。目前国内还没有关于WS2812彩灯的各种上位机和下位机和服务器全方位击破的开源教程，那么这里希望成为第一家。全家福如下图所示：

功能描述：最简单DIY基于ESP8266的智能彩灯①（在网页用按钮点亮普通RGB灯）当时用的是普通的RGB LED灯，里面是不带有芯片的，控制亮度用的是PWM波，控制颜色是通过控制三种颜色灯丝的PWM波比例。那么这次ESP8266调库用其IO口间接通过WS2812芯片控制LED，IO口通过单线归零码协议实现控制，至于这个协议怎么用，具体不需要深究，因为Arduino的WS2812库帮我们做好的驱动，我们直接调用函数驱动即可，这里用到的是FastLED这个库，假如真的想深究，等我发布STM32版本的WS2812项目吧。最后实现的效果是ESP8266创建热点，然后用户在其嵌入式主页控制彩灯的变化，这次点一盏灯，分别是WS2811和WS2812，其实代码都是通用的，点亮第一盏灯以后才能点亮更多的灯。下面是Arduino写的原创开源代码截图：

手机连上ESP6266热点之后，在浏览器打开嵌入式主页：

二、使用步骤

1.准备硬件

（1）购买ESP8266开发板：mini D1 wifi ESP-12F N ESP8266。

芯片包装如下：

（2）购买WS2812国产RGB灯或者模块。

2.搭建Arduino开发环境

（1）第一步下载Arduino IDE安装，双击下一步，下一步，直到完成，建议不要中文路径。

（2）下载ESP8266安装包插件，这是最方便的，如果在Arduino里面搜索安装，你会发现很慢，特别是在这个紧张的芯片之争的关键时期下,按照这个网址去下载：https://www.arduino.cn/thread-76029-1-1.html

（3）双击（2）下载的三个包中的一个，我双击安装的是第二个包，重启Arduino就可以安装好了。

安装好之后你会发现开发板选项多了ESP8266这类的开发板。实在不行就找其他教程再试试了，没有必要一步一步教这个开发环境搭建。
（3.1）导入FASTLED库，或者说是安装FASTLED库（自己百度如何安装即可）

可以打开一个红色箭头官方示例代码玩玩
主要修改一下参数：
#define LED_TYPE WS2811
#define COLOR_ORDER GRB
#define NUM_LEDS 64
第一个是RGB灯的型号，可以是2812或者2811
第三个是RGB灯的数量，我的设置为1

#include <FastLED.h>

FASTLED_USING_NAMESPACE

// FastLED "100-lines-of-code" demo reel, showing just a few 
// of the kinds of animation patterns you can quickly and easily 
// compose using FastLED.  
//
// This example also shows one easy way to define multiple 
// animations patterns and have them automatically rotate.
//
// -Mark Kriegsman, December 2014

#if defined(FASTLED_VERSION) && (FASTLED_VERSION < 3001000)
#warning "Requires FastLED 3.1 or later; check github for latest code."
#endif

#define DATA_PIN    3
//#define CLK_PIN   4
#define LED_TYPE    WS2811
#define COLOR_ORDER GRB
#define NUM_LEDS    64
CRGB leds[NUM_LEDS];

#define BRIGHTNESS          96
#define FRAMES_PER_SECOND  120

void setup() {
   
   
  delay(3000); // 3 second delay for recovery
  
  // tell FastLED about the LED strip configuration
  FastLED.addLeds<LED_TYPE,DATA_PIN,COLOR_ORDER>(leds, NUM_LEDS).setCorrection(TypicalLEDStrip);
  //FastLED.addLeds<LED_TYPE,DATA_PIN,CLK_PIN,COLOR_ORDER>(leds, NUM_LEDS).setCorrection(TypicalLEDStrip);

  // set master brightness control
  FastLED.setBrightness(BRIGHTNESS);
}


// List of patterns to cycle through.  Each is defined as a separate function below.
typedef void (*SimplePatternList[])();
SimplePatternList gPatterns = {
   
    rainbow, rainbowWithGlitter, confetti, sinelon, juggle, bpm };

uint8_t gCurrentPatternNumber = 0; // Index number of which pattern is current
uint8_t gHue = 0; // rotating "base color" used by many of the patterns
  
void loop()
{
   
   
  // Call the current pattern function once, updating the 'leds' array
  gPatterns[gCurrentPatternNumber]();

  // send the 'leds' array out to the actual LED strip
  FastLED.show();  
  // insert a delay to keep the framerate modest
  FastLED.delay(1000/FRAMES_PER_SECOND); 

  // do some periodic updates
  EVERY_N_MILLISECONDS( 20 ) {
   
    gHue++; } // slowly cycle the "base color" through the rainbow
  EVERY_N_SECONDS( 10 ) {
   
    nextPattern(); } // change pat