BLYNK
HOME       📲 GETTING STARTED       📗 DOCS       ❓HELP CENTER       👉 SKETCH BUILDER

Blynk and neopixel fade

I’m using ZERGBA with Wemos D1 mini and shield rgb.
And I would like to create a white fade for the color chosen in the app.

But I didn’t find in the library how I do it.

I have made the code here:

But it’s not working


#include <Adafruit_NeoPixel.h>
#include <SPI.h>
#include <BlynkSimpleEsp8266.h>
#include <ESP8266WiFi.h>


#define PIN D4
#define NUMPIXELS 7
#define BLYNK_PRINT Serial
Adafruit_NeoPixel pixels = Adafruit_NeoPixel(NUMPIXELS, PIN, NEO_GRB + NEO_KHZ800);

char auth[] = "YizbKmQ6_AIV3pnyh4ZA-Euu7JKxTv7L";
const char* ssid = "--------";
const char* pass = "----------";

int delayval = 500; // delay for half a second


BLYNK_CONNECTED() {
  // Request the latest state from the server
  Blynk.syncAll();
}

void setup()
{
Serial.begin(9600);
Blynk.begin(auth, ssid, pass);
pixels.begin();
}

BLYNK_WRITE(V1)
{

int R = param[0].asInt();
int G = param[1].asInt();
int B = param[2].asInt();
Serial.println(R);
Serial.println(G);
Serial.println(B);
for(int i=0;i<NUMPIXELS;i++){

pixels.setPixelColor(i, pixels.Color(R,G,B));

pixels.show();
delay(delayval);
}
}

Please edit your post to add triple backticks at the beginning and end of your code so that it displays correctly.
Triple backticks look like this:
```

Pete.

Done!

Okay, so put yourself in our position…

Most people probably don’t have the same hardware as you, and even if they do they probably can’t be bothered to find it, upload your code, set-up the app and try to figure-out what:

actually means in practice.

Even if they did all of that, they don’t understand what you mean by:

so, it’s very difficult for us to help you.

If you’re using the Wemos WS2812B RGB Shield then the single neopixel is attached to pin D2 (the little asterisk next to D2 is the clue).

That means that telling the library that you have 7 neopixels attached to pin D4 probably isn’t a great start:

Pete.

Pete, Im using 7 RGB LEDs (WS2812B-3535) shield and their documentation looks like this:

#define PIN D4 
#define NUMPIXELS 7

And for the fade effect, I want is when I choose a color in Zergba. Make a fade of the color chosen for white

I hope you understood

I’m afraid not.

Pete.

Pete,  I made some changes to the code but it still doesn't work.

What I want to do is that when I choose a color that the leds start off setBrightness = 0 and go up to 100. But loop (this is the effect “fade” for me".

#include <Adafruit_NeoPixel.h>
#include <SPI.h>
#include <BlynkSimpleEsp8266.h>
#include <ESP8266WiFi.h>


#define PIN D4
#define NUMPIXELS 7
#define BLYNK_PRINT Serial
Adafruit_NeoPixel pixels = Adafruit_NeoPixel(NUMPIXELS, PIN, NEO_GRB + NEO_KHZ800);

char auth[] = "YizbKmQ6_AIV3pnyh4ZA-Euu7JKxTv7L";
const char* ssid = "----";
const char* pass = "----";

BLYNK_CONNECTED() {
  // Request the latest state from the server
  Blynk.syncAll();
}


void setup()
{
Serial.begin(9600);
Blynk.begin(auth, ssid, pass);
pixels.begin();
}

BLYNK_WRITE(V1)
{

int R = param[0].asInt();
int G = param[1].asInt();
int B = param[2].asInt();
Serial.println(R);
Serial.println(G);
Serial.println(B);
int fadeVal=0;


for(int i=0;i<NUMPIXELS;i++){
pixels.setPixelColor(i, pixels.Color(R,G,B));
pixels.show();
}
for (int fadeVal=0; fadeVal>100; fadeVal++){
pixels.setBrightness(fadeVal);
Serial.println("fadeVal=");
Serial.println(fadeVal);
delay(50);
}
for(int fadeVal=100; fadeVal>=0; fadeVal--) { // Ramp down from 255 to 0
pixels.setBrightness(fadeVal);
Serial.println("fadeVal=");
Serial.println(fadeVal);
delay(50);
}
}

void loop()
{
Blynk.run();

}

You still haven’t told us what “it’s not working” actually means.

Pete.

In the last new code I made when selecting the color by Zergba is not changing Brightness.

I don’t know if I put the for doing this function in place certou or if there is any inconsistency in the code

Are you trying to make (for example) red slowly fade to a new color (say green) by transitioning thru yellow? Or are you trying to make red slowly fade (change brightness) to black/off and then back to the new color you selected? Either way I would recommend you work in the HSV (hue, saturation, brightness) world instead of RBG world. There are functions for working in the HSV world. You will have to make the hue (or brightness) changes in a “loop” in your code.

The tricky part is to do this while not waiting too long between calls to Blynk. If your loop takes too long you may need to make Blynk calls within the loop. Or another (better) option is to have a very short timer that does the hue or brightness incremental changes and then goes back to the main loop so as to not block calls to Blynk.

2 Likes

I’m trying to make the color I chose in Blynk change slowly to black / off and back to the same color I chose. Until I choose another color.

Ok so you want it to pulse on and off continuously and change color but continue to pulse when you select a new color?

Yes

To achieve what you’ve described is quite a programming challenge.
Say the colour you’ve chosen is R= 200, G=100, B=50.

You need to fade R down to 0 at the same speed as you fade G down to zero and B down to zero.
The steps would be:

200, 100, 50
196, 98, 49
192, 96, 48
188, 94, 47
184, 92, 46
etc etc.

The alternative is to use a library that uses an RGBB (Red, Green, Blue, Brightness) function that automatically handles the fade for you.

Either way, It’s not really a Blynk related issue, and not worth forum members spending time on something that isn’t exactly a critical piece of functionality (uin my opinion).

Pete.

FYI: You need a pixels.show() after each time you change brightness. Probably why your not seeing anything happen. Your code should only “pulse” once and only upon changing colors.

OK, I change the code for this:

BLYNK_WRITE(V1)
{

int R = param[0].asInt();
int G = param[1].asInt();
int B = param[2].asInt();
Serial.println(R);
Serial.println(G);
Serial.println(B);

for(int i=0;i<NUMPIXELS;i++){
pixels.setPixelColor(i, pixels.Color(R,G,B));
pixels.show();
}
FadeInOut(R,G,B);
}
void FadeInOut(byte R, byte G, byte B){
  float r, g, b;
     
  for(int k = 0; k < 256; k=k+1) {
    r = (k/256.0)*R;
    g = (k/256.0)*G;
    b = (k/256.0)*B;
    for(int i=0;i<NUMPIXELS;i++){
    pixels.setPixelColor(i, pixels.Color(r,g,b));
    pixels.show();
    } 
  }
     
  for(int k = 255; k >= 0; k=k-2) {
    r = (k/256.0)*R;
    g = (k/256.0)*G;
    b = (k/256.0)*B;
    for(int i=0;i<NUMPIXELS;i++){
    pixels.setPixelColor(i, pixels.Color(r,g,b));
    pixels.show();
    delay(25);
    } 
  }
}

void loop()
{
Blynk.run();
}

But now the “fade effect” occurs only once and stops with LEDs off
How do I make this effect loop?

Again… This is general programming question not Blynk related, but in an effort to help…

1.) Define R, G and B globally instead of in BLYNK_WRITE

2.) Call your fade function in the main loop and not in BLYNK_WRITE

Just keep in mind calls are not being made to Blynk.run() until fade cycle is complete. If this takes too long you will get disconnects.

Also instead of zebra you could use a single slider for hue. It’s not as user friendly for picking colors on the zebra but then you could use the Hue, Saturation, Value functions and not have to deal with the R.G,B math when changing brightness.

Good luck! I’m done for the night.

So, How i do this?