ESP-12S音控雪花灯-硬件到软件

一、功能介绍

二、雪花灯硬件

三、软件教程

  • 1、下载并安装Arduino IDE
  • 2、下载并安装blinker APP
  • 3、修改编译并上传程序
  • 四、 绑定天猫精灵（前提要有一台智能音箱）
  • 五、全彩灯环的效果

一、功能介绍

①ESP-12S主控，基于Blinker物联网平台，实现WIFI联网控制 ②手机APP可实现256级亮度控制及全彩调色 ③天猫精灵语音控制，实现部分颜色调节

二、雪花灯硬件

（1）、全彩雪花灯硬件在立创开源平台已开源，获取链接：音控全彩雪花灯

Arduino ESP12f 的引脚映射 esp12s arduino_#define

Arduino ESP12f 的引脚映射 esp12s arduino_#define_02

Arduino ESP12f 的引脚映射 esp12s arduino_数据_03

三、软件教程

1、下载并安装Arduino IDE

（1）Arduino下载链接：Arduino下载

  • 下载后安装即可，有些版本不需要安装，解压后即可使用，具体如何根据你下载版本而定

（2） 接着安装ESP8266 Arduino库

  • ①.打开Arduino，点击左上角 文件->首选项 找到附加开发板管理器，输入：http://arduino.esp8266.com/stable/package_esp8266com_index.json 点击“好”完成
  • ②返回首页，点击左上角 工具->开发板：“Arduino…”->开发板管理器，等待加载完成后，在搜索栏输入esp8266，如图2，选择2.5.2版本(版本不低于2.5.0)，点击安装，下载速度跟网速相关，若下载失败，可退出界面重新下载

    • Arduino ESP12f 的引脚映射 esp12s arduino_#define_04

（3）.下载并安装Blinker-library库

  • Blinker库下载：Blinker库下载
  • Windows：将下载好的blinker库解压到 我的电脑>文档>Arduino>libraries 文件夹中
  • Mac OS：将下载好的blinker库解压到 文稿>Arduino>libraries 文件夹中

（4）.下载并加载Adafruit NeoPixel库

  • Adafruit NeoPixel库下载： Adafruit NeoPixel
  • Adafruit NeoPixel库：用于控制基于单总线协议的LED灯带的Arduino库。
  • 下载后，将文件夹重命名为‘Adafruit_NeoPixel’并剪切到Arduino Library(Arduino IDE的解压目录或安装目录内)文件夹中，重新启动Arduino IDE。

2、下载并安装blinker APP

  • Android APP下载：Blinker IOS APP下载：App Store中搜索“blinker”下载
  • 在app中添加设备，获取Secret Key 1.进入App，点击右上角的“+”号，然后选择 DIY设备->Arduino 2.点击选择 WiFi接入 3.复制保存申请到的Secret Key(后续程序修改要用到)
  • DIY界面 ： 返回首页，会有一个新的设备（没有的话下滑刷新下），点击刚创建的设备，首次进入设备会弹出向导页，在向导页点击载入示例，接下来我们就开始创建图标界面来控制全彩灯环，步骤如下： 1.在设备列表页，点击右上角设备图标，进入设备控制面板

    Arduino ESP12f 的引脚映射 esp12s arduino_#define_05

    2.进入设备控制面板后，在屏幕下方找到 颜色 组件，点击添加，可拖动新建的图标来选择放置位置，如下图：

    Arduino ESP12f 的引脚映射 esp12s arduino_数据_06

    3.点击新建的图标，进入图标设置界面，把数据键名改为clo-abc(如下图，数据键名可任意填写，记住自己设置的数据键名，程序修改时会用到)，然后点击右上角的“√图标”完成设置，再点击右上角“小锁”图标锁定界面，手机App配置完成

    Arduino ESP12f 的引脚映射 esp12s arduino_app_07

3、修改编译并上传程序

打开Arduino IDE，复制完整代码，在程序中找到如下变量：

1.程序中宏#define PIN为单总线彩灯控制引脚，全彩雪花灯的控制引脚为GPIO13，所以设置为13

2.#define NUMPIXELS为全彩灯的个数，修改为雪花灯上灯的个数30

3.填入你申请到的Secret Key(前面创建设备时保存的)和要连接的WiFi热点名(ssid)、密码(pswd)以及APP中‘颜色组件’的‘数据键名’，例如：

#define PIN            13    //控制引脚
#define NUMPIXELS      30   //WS2812的个数

#define RGB_1 "col-abc"      //col-abc对应手机APP中‘颜色组件’的‘数据键名’
BlinkerRGB WS2812(RGB_1);      

char auth[] = "abcdefghijkl"; //在app中创建设备时获取到的Secret Key
char ssid[] = "abcdefg";      //你的WiFi热点名称，可以手机开热点
char pswd[] = "123456789";    //你的WiFi密码

完整代码如下：

#define BLINKER_PRINT Serial
#define BLINKER_WIFI
#define BLINKER_ALIGENIE_OUTLET

#include <Blinker.h>

#include <Adafruit_NeoPixel.h>
#ifdef __AVR__
  #include <avr/power.h>
#endif

#define PIN            13     //控制引脚
#define NUMPIXELS      30     //WS2812的个数
Adafruit_NeoPixel pixels = Adafruit_NeoPixel(NUMPIXELS, PIN, NEO_GRB + NEO_KHZ800);

char auth[] = "a472c874b175"; //在app中创建设备时获取到的Secret Key
char ssid[] = "12345678";     //你的WiFi热点名称，可以手机开热点
char pswd[] = "12345678";     //你的WiFi密码

/*************************手机APP控制程序***************************/
//创建颜色组件对象,对应APP中颜色主件的"数据键名"
#define RGB_1 "RGBKey"
BlinkerRGB WS2812(RGB_1);

//用于处理ESP8266收到颜色主件传来的数据的回调函数
void ws2812_callback(uint8_t r_value, uint8_t g_value, uint8_t b_value, uint8_t bright_value)
{
    digitalWrite(LED_BUILTIN, !digitalRead(LED_BUILTIN));
     //红,绿,蓝三色值组合实现七彩效果
    BLINKER_LOG("R value: ", r_value); //红灯值
    BLINKER_LOG("G value: ", g_value); //绿灯值
    BLINKER_LOG("B value: ", b_value); //蓝灯值
    BLINKER_LOG("Rrightness value: ", bright_value); //亮度值

    pixels.setBrightness(bright_value);//控制RGB灯亮度

    //控制RGB灯颜色，循环一次点亮一颗灯,共点亮 NUMPIXELS 颗灯
    //所有灯显示相同颜色
    for(int i = 0; i < NUMPIXELS; i++){
        pixels.setPixelColor(i, r_value, g_value, b_value);
    }
    pixels.show();
}
/**********************************************************/

/*******************天猫精灵控制程序***********************/

char NightLight = 0;          //定义颜色状态变量，记录灯的颜色状态，用于天猫精灵颜色查询

//天猫精灵电源类的操作接口，查询灯是否点亮
void aligeniePowerState(const String & state)
{
    BLINKER_LOG("need set power state: ", state);

    if (state == BLINKER_CMD_ON) {

        uint8_t colorR = 255; uint8_t colorG = 255; uint8_t colorB = 255;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
        NightLight = 1;
        BlinkerAliGenie.powerState("on"); 
        BlinkerAliGenie.print();   //将电源的状态返回给天猫精灵
    }
    else if (state == BLINKER_CMD_OFF) {
        uint8_t colorR = 0; uint8_t colorG = 0; uint8_t colorB = 0;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
        NightLight = 2;
        BlinkerAliGenie.powerState("off");
        BlinkerAliGenie.print();
    }
}
//天猫精灵颜色的设置接口(比如说"天猫精灵,把灯调为红色"，支持九种颜色)
void aligenieColor(const String & color)
{
    BLINKER_LOG("need set color: ", color); //串口打印颜色
    //接收来自天猫精灵传来的颜色数据，并显示在雪花灯上
    if (color == "Red") {
        uint8_t colorR = 255; uint8_t colorG = 0; uint8_t colorB = 0;
        NightLight = 3 ;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
    }
    else if (color == "Yellow") {
        uint8_t colorR = 255; uint8_t colorG = 255; uint8_t colorB = 0;
        NightLight = 4 ;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
    }
    else if (color == "Blue") {
        uint8_t colorR = 0; uint8_t colorG = 0; uint8_t colorB = 255;
        NightLight = 5 ;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
    }
    else if (color == "Green") {
        uint8_t colorR = 0; uint8_t colorG = 255; uint8_t colorB = 0;
        NightLight = 6 ;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
    }
    else if (color == "White") {
        uint8_t colorR = 255; uint8_t colorG = 255; uint8_t colorB = 255;
        NightLight = 7 ;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
    }
    else if (color == "Cyan") {
        uint8_t colorR = 0; uint8_t colorG = 255; uint8_t colorB = 255;
        NightLight = 8 ;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
    }
    else if (color == "Purple") {
        uint8_t colorR = 128; uint8_t colorG = 0; uint8_t colorB = 128;
        NightLight = 9 ;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
    }
    else if (color == "Orange") {
        uint8_t colorR = 255; uint8_t colorG = 165; uint8_t colorB = 0;
        NightLight = 10 ;
        for(int i = 0; i < NUMPIXELS; i++){
          pixels.setPixelColor(i, pixels.Color(colorR,colorG,colorB));
          pixels.show();
        }
    }
    BlinkerAliGenie.powerState("on");  //将电源的状态返回给天猫精灵
    BlinkerAliGenie.color(color);      //将灯的颜色返回给天猫精灵
    BlinkerAliGenie.print();
}
//天猫精灵设备查询接口(比如说"天猫精灵灯是什么颜色")，查询雪花灯的颜色
void aligenieQuery(int32_t queryCode)
{
    BLINKER_LOG("AliGenie Query codes: ", queryCode);

    switch (queryCode)
    {
        case BLINKER_CMD_QUERY_ALL_NUMBER :    //属性所有查询，包括电源状态和灯的颜色
            BLINKER_LOG("AliGenie Query All");
            BlinkerAliGenie.powerState(NightLight == 2|0 ? "off" : "on");
            
            if (NightLight == 1) {
               BlinkerAliGenie.color("White");
            }
            else if (NightLight == 3) {
               BlinkerAliGenie.color("Red");
            }
            else if (NightLight == 4) {
               BlinkerAliGenie.color("Yellow");
            }
            else if (NightLight == 5) {
               BlinkerAliGenie.color("Blue");
            }
            else if (NightLight == 6) {
               BlinkerAliGenie.color("Green");
            }
            else if (NightLight == 7) {
               BlinkerAliGenie.color("Black");
            }
            else if (NightLight == 8) {
               BlinkerAliGenie.color("Cyan");
            }
            else if (NightLight == 9) {
               BlinkerAliGenie.color("Purple");
            }
            else if (NightLight == 10) {     
               BlinkerAliGenie.color("Orange");;       
            }          
            BlinkerAliGenie.print();
            break;
        case BLINKER_CMD_QUERY_POWERSTATE_NUMBER :  //查询电源状态
            BLINKER_LOG("AliGenie Query Power State");
            BlinkerAliGenie.powerState(NightLight == 2|0 ? "off" : "on");
            BlinkerAliGenie.print();
            break;
        case BLINKER_CMD_QUERY_COLOR_NUMBER :       //查询颜色属性
            BLINKER_LOG("AliGenie Query Color");
            if (NightLight == 1) {
               BlinkerAliGenie.color("White");
            }
            else if (NightLight == 3) {
               BlinkerAliGenie.color("Red");
            }
            else if (NightLight == 4) {
               BlinkerAliGenie.color("Yellow");
            }
            else if (NightLight == 5) {
               BlinkerAliGenie.color("Blue");
            }
            else if (NightLight == 6) {
               BlinkerAliGenie.color("Green");
            }
            else if (NightLight == 7) {
               BlinkerAliGenie.color("Black");
            }
            else if (NightLight == 8) {
               BlinkerAliGenie.color("Cyan");
            }
            else if (NightLight == 9) {
               BlinkerAliGenie.color("Purple");
            }
            else if (NightLight == 10) {     
               BlinkerAliGenie.color("Orange");      
            }
            BlinkerAliGenie.print();
            break;
        default :
            break;
    }
}

//Blinker手机APP传来数据时的回调函数
void dataRead(const String & data)
{
    BLINKER_LOG("Blinker readString: ", data);
    //接收到数据手机震动
    Blinker.vibrate();
    //返回系统自上电开始运行的时间 
    uint32_t BlinkerTime = millis(); 
    Blinker.print(BlinkerTime);
    Blinker.print("millis", BlinkerTime);
}
/**************************************************************/

void setup()
{
    Serial.begin(115200);

    #if defined(BLINKER_PRINT)
        BLINKER_DEBUG.stream(BLINKER_PRINT);
    #endif

    //网络初始化
    Blinker.begin(auth, ssid, pswd);
    //注册Blinker手机APP传来数据时的回调函数
    Blinker.attachData(dataRead);
    //注册天猫精灵相关的回调函数
    BlinkerAliGenie.attachPowerState(aligeniePowerState); //注册开关灯的函数
    BlinkerAliGenie.attachColor(aligenieColor);  //注册灯调色的函数
    BlinkerAliGenie.attachQuery(aligenieQuery);  //注册颜色查询的函数

    /*******************手机APP部分函数初始化******************/  
    pixels.begin();
    //设置颜色组件的回调函数, 当收到指令时会调函数ws2812_callback
    WS2812.attach(ws2812_callback);
}

void loop()
{
    Blinker.run();  //运行
}
  • 源程序下载地址：附件中下载程序

恭喜！一切就绪，开始上传代码

  • 1.点击左上角 工具->开发板:”Arduino…” 在列表中找到 NodeMCU 1.0(…) 并点击选择
  • 2.将全彩雪花灯用USB-TTL下载器连接电脑，点击左上角 工具->端口 ，选择正确的端口号
  • 3.编译并上传程序到esp8266开发板，如图

    • Arduino ESP12f 的引脚映射 esp12s arduino_i++_08

  • 当出现如图所示的提示时，按住全彩雪花灯背面的K2按键不放，再按下K1按键复位，再松开两个按键，等待上传完成

    • Arduino ESP12f 的引脚映射 esp12s arduino_#define_09

  • 上传成功后，打开串口调试器，手机开热点(设置WIFI名 和 WIFI密码为12345678，只有跟程序中设置一样，ESP8266才能连接该WIFI)，点击开发板上RESET复位按键，等待开发板连接手机热点当看到串口调试器打印出“MQTT Connected!”，说明设备已经成功连接到MQTT服务器
  • 打开手机APP，在APP中刷新，会看到原先创建设备图标不再是灰色，说明设备已经上线。

四、 绑定天猫精灵（前提要有一台智能音箱）

  • 打开天猫精灵 App。点击右下角“我的”，点击“添加智能设备”
  • 在页面上方搜索栏，搜索blinker，并点击要添加的设备类型
  • 点击绑定账号，使用blinker账户登录，完成绑定

绑定成功后，在blinker App中配网成功的设备就会出现在您的智能家居设备列表中，现在可以使用天猫精灵进行语音控制了

1.天猫精灵支持的语音指令

①灯 打开/关闭{门口}的{灯} 把{卧室}的{灯}调为{红色} 把{卧室}的{灯}的{亮度调高一点} 把{卧室}的{灯}调为{影院模式} 把{门口}的{灯}的{色温}调到{1400} 把{卧室}的{灯}的{色温调暖一点} 查询{卧室}的{灯}的状态②插座 打开/关闭{厨房}的{插座} {客厅}的{插座}是否打开③传感器 查询{客厅}的{传感器}的{温度}/{湿度}/{PM2.5}

2.天猫精灵支持控制的颜色表

颜色

中文描述

Red

红色

Yellow

黄色

Blue

蓝色

Green

绿色

White

白色

Black

黑色

Cyan

青色

Purple

紫色

Orange

橙色

五、全彩灯环的效果

  • 视频演示链接：天猫精灵音控雪花灯

天猫精灵音控雪花灯

END