So I’m looking at this description, and I’m finding myself still unsure of the exact effect you’re looking for. In particular: You said you wanted “to fade between two colors over time” (emphasis mine), but then you also said you wanted the “whole blending pattern to scroll” (again emphasis mine). The first of those describes a change over time, but the second describes a change over space.
I’ll just paste some code and you can play with it!
So first of all, if you want to fill a range of pixels with a smooth gradient of color, you can do this:
CRGB startColor( CRGB::Red);
CRGB endColor( CRGB::Blue);
int startPos = 0; // start gradient at first pixel
int endPos = NUM_LEDS-1; // end gradient at last pixel
fill_gradient_RGB( leds, startPos, startColor, endPos, endColor);
FastLED.show();
And poof: a smooth filled gradient blending from Red to Blue across all the LEDs.
But let’s do it explicitly ourselves with a loop. This is basically what fill_gradient does ( except that fill_gradient does it without using floating point numbers, which aren’t as fast as integers ) …
// Loop over every pixel
for( int i = 0; i < NUM_LEDS; i++) {
// First, figure out what 'percentage' of the way along
// the strip we are at this particular pixel:
float fractionOfTheWayAlongTheStrip = (float)i / (float)(NUM_LEDS-1);
// Now calculate how much of each color we should blend together
// at this particular point along the strip.
// 0 = pure 'start color', 255 = pure 'end color'
uint8_t amountOfBlending = fractionOfTheWayAlongTheStrip * 255;
// Mix up a new color, which is a blend of the start and end colors
// Use the blend function to get the right mix for this particular pixel
CRGB pixelColor = blend( startColor, endColor, amountOfBlending);
// set this pixel to the blended color:
leds[i] = pixelColor;
}
FastLED.show();
Now you also talked about moving a pattern down the row of pixels over time. I think one relatively easy way to do that is (1) first define a color palette that has the colors you want in it, and (2) fill the led array with colors from the palette. That looks like this ( no animation yet ) :
// Define a color palette pre-filled with a gradient
// that goes from startColor, to endColor (in the middle),
// and back to startColor.
CRGBPalette16 myPalette( startColor, endColor, startColor);
// Start with the color at the beginning of the palette,
// and choose colors from along the palette moving by a few
// palette slots per pixel.
uint8_t startIndex = 0;
uint8_t incrementIndex = 128 / NUM_LEDS;
fill_palette( leds, NUM_LEDS,
startIndex, incrementIndex,
myPalette,
255, //full brightness
LINEARBLEND);
FastLED.show();
Now to animate it, you’d change it so that the first color selected from the palette shifted over time:
// Define a color palette pre-filled with a gradient
// that goes from startColor, to endColor (in the middle),
// and back to startColor.
CRGBPalette16 myPalette( startColor, endColor, startColor);
// Start with the color at the beginning of the palette,
// and choose colors from along the palette moving by a few
// palette slots per pixel.
static uint8_t startIndex = 0;
startIndex += 1; // start further down the color palette each time.
uint8_t incrementIndex = 128 / NUM_LEDS;
fill_palette( leds, NUM_LEDS,
startIndex, incrementIndex,
myPalette,
255, //full brightness
LINEARBLEND);
FastLED.show();
Now only one of these uses a ‘for’ loop, so you may want to play around and see what you can do, and then ask some more questions. I’m curious to see what you come up with these as some building blocks. Feel free to post some of your code, if it’ll help!