使用esp8266的webserver,网页控制ws2812的颜色变化、呼吸效果
实物效果手机效果#includeESP8266WiFi.h#includeESP8266WebServer.h#includeAdafruit_NeoPixel.h#definePIN4//ws2812的控制脚#defineNUMPIXELS7//ws2812的灯珠数量后面要通过循环遍历#definessidESP8266//名称#definepssd123456789//密码#defineRANDOMTIME5000//随机变换颜色的间隔时间毫秒#defineBREATHTIME20//呼吸效果的快慢频率,毫秒Adafruit_NeoPixel pixelsAdafruit_NeoPixel(NUMPIXELS,PIN,NEO_GRBNEO_KHZ800);ESP8266WebServeresp8266_server(80);byte showRandom1;//是否随机显示颜色byte showFlash0;//是否闪烁byte showBreath1;//是否呼吸uint8_trrr50;//RGB的颜色uint8_tggg50;uint8_tbbb50;uint8_tbright60;//亮度unsignedlonglastRandomTime0;//最后一次随机变换的时间unsignedlonglastBreathTime0;//最后一次呼吸的时间byte breathDirection0;//呼吸变换的方向是变暗还变亮voidsetup(){pixels.begin();Serial.begin(9600);pinMode(D4,OUTPUT);//设置内置LED引脚为输出模式以便控制LEDWiFi.mode(WIFI_AP);//设置成AP模式WiFi.softAP(ssid,pssd);delay(10);IPAddress ipWiFi.softAPIP();//获取ip地址Serial.println(ip);//打印出来ip地址esp8266_server.begin();// 启动网站服务esp8266_server.on(/,HTTP_GET,handleRoot);// 设置服务器根目录即 / 的函数handleRootesp8266_server.onNotFound(handleNotFound);// 设置处理404情况的函数handleNotFoundSerial.println(HTTP esp8266_server started);}voidloop(void){esp8266_server.handleClient();// 检查http服务器访问if(showRandom1){doRandom();}if(showBreath1){doBreath();}showLed();}voiddoBreath(){if(millis()-lastBreathTimeBREATHTIME){if(breathDirection0){//判断亮度是增加还是减少bright-1;if(bright0){breathDirection1;}}if(breathDirection1){bright1;if(bright155){breathDirection0;}}lastBreathTimemillis();//Serial.println(bright);}}voiddoRandom(){if(millis()-lastRandomTimeRANDOMTIME){rrrrandom(256);gggrandom(256);bbbrandom(256);lastRandomTimemillis();}}voidhandleRoot(){//处理请求的参数,使用的是get方法也许post会更好些没有研究明白Serial.println(当前请求中请求体数量:);Serial.println(esp8266_server.args());if(esp8266_server.hasArg(random)){esp8266_server.arg(random)true?showRandom1:showRandom0;}if(esp8266_server.hasArg(flash)){esp8266_server.arg(flash)true?showFlash1:showFlash0;}if(esp8266_server.hasArg(breath)){esp8266_server.arg(breath)true?showBreath1:showBreath0;}if(esp8266_server.hasArg(bright)){brightString(esp8266_server.arg(bright)).toInt();}if(esp8266_server.hasArg(r)){rrrString(esp8266_server.arg(r)).toInt();}if(esp8266_server.hasArg(g)){gggString(esp8266_server.arg(g)).toInt();}if(esp8266_server.hasArg(b)){bbbString(esp8266_server.arg(b)).toInt();}for(inti0;iesp8266_server.args();i){String tesp8266_server.argName(i)String(esp8266_server.arg(i));Serial.println(t);}//Serial.print( bright);//Serial.print(bright);//把当前的rgb数值更新到网页里String checkboxRandom;if(showRandom1){checkboxRandomchecked\true\;}String checkboxFlash;showFlash?checkboxFlashchecked\true\:true;String checkboxBreath;showBreath?checkboxBreathchecked\true\:true;String myhtmlPageString()!DOCTYPE htmlhtml lang\zh-CN\head meta charset\UTF-8\ meta name\viewport\ content\widthdevice-width, initial-scale1.4, user-scalableyes\ / titleIt\s a model of html/title script function postLed() { let checkRandom document.getElementById(\checkRandom\).checked; let checkBreath document.getElementById(\checkBreath\).checked; let checkFlash document.getElementById(\checkFlash\).checked; let bright document.getElementById(\rangeBright\).value; let rrr document.getElementById(\rangeR\).value; let ggg document.getElementById(\rangeG\).value; let bbb document.getElementById(\rangeB\).value; let args window.location.href.split(\?\)[0]; args \?random\ checkRandom \breath\ checkBreath \flash\ checkFlash; args \bright\ bright \r\ rrr \g\ ggg \b\ bbb; console.log(args); window.location.hrefargs; } /script/headbody /br input type\checkbox\ id\checkRandom\ checkboxRandom span随机/span/br input type\checkbox\ id\checkFlash\checkboxFlashspan闪烁/span/br input type\checkbox\ id\checkBreath\checkboxBreathspan呼吸/span/br span亮度/spaninput id\rangeBright\ type\range\ value\String(bright)\ min\0\ max\255\/br span红色/spaninput id\rangeR\ type\range\ value\String(rrr)\ min\0\ max\255\/br span绿色/spaninput id\rangeG\ type\range\ value\String(ggg)\ min\0\ max\255\/br span蓝色/spaninput id\rangeB\ type\range\ value\String(bbb)\ min\0\ max\255\/br /br input type\button\ id\btn1\ onclick\postLed()\ value\提交\ //body/html;esp8266_server.send(200,text/html,myhtmlPage);}// 设置处理404情况的函数handleNotFoundvoidhandleNotFound(){esp8266_server.send(404,text/plain,404: Not found);// 发送 HTTP 状态 404 (未找到页面) 并向浏览器发送文字 404: Not found}//遍历更新每一个灯珠voidshowLed(){pixels.setBrightness(bright);pixels.clear();for(inti0;iNUMPIXELS;i){pixels.setPixelColor(i,rrr,ggg,bbb);// Moderately bright green color.pixels.show();// This sends the updated pixel color to the hardware.delay(1);}}目前闪烁的代码还没加进去。