Let's add more animation modes. We'll build each mode in the
forever loop, so we can tweak the values and make it to our liking while watching the emulator, then once we're happy, move it into its own function for safe keeping. It's also helpful to download the code onto your Circuit Playground whenever you want to see how something looks, and also test with the NeoPixel strip attached. The animations look pretty different in real life -- and of course you can always come back and change things when your corset is finished.
OneColor mode will be almost identical to the
RainbowFade mode. The only difference is that we won't change the hue. Copy the two
set strip blocks from the
RainbowFade function and paste them into the
forever loop. Check the emulator. All the lights are red, because we haven't defined
hue so it's defaulting to
0 which translates to red.
This was an easy one. Make a function called
OneColor and move all the code in the
forever loop over.
Next we'll create the
Gradient animation. We'll take the value assigned to
hue and add a small random number to it, assign this new hue to a pixel, and then rotate the strip. Each pixel will carry its random color like an ant marching down the strip, surrounded by colors that are all slightly, randomly different.
From LIGHT > MORE drag an instance of
set strip pixel color at 0 to red. Replace the
0 with the
hue variable, and the
red with the
hue / sat / val block (from the LIGHT tab).
Notice that this is different from the blocks we used in the previous functions. Those blocks affected all the lights on the strip at once, and this block affects just one pixel at a time.
We're going to add a whole lot of randomness here. We'll change the hue, saturation, and value all by a random amount to get a really nice variety of colors and shades.
Drag out 4 instances of MATH >
pick random 0 to 10. Place one in each of the spaces for
Next, grab a
0 - 0 block from the top of the MATH tab. Replace the
10 in the
pick random 0 to 10 you assigned to the
hue space with this block.
Then place your fourth
pick random block into the second slot in this latest block. Change the
pick random values to match the picture.
hue variable as shown. Add a
strip rotate by 1 block from the MORE tab. Add a random element to the speed of the animation by choosing LOOPS > pause 100 ms and placing
pick random 0 to 100 (from MATH) inside it.
Check the emulator. It's a little hard to see with just red, so for testing purposes, let's assign a temporary value to our
hue variable. Add
set hue to 50 at the beginning of your
This got complicated pretty fast! It's the result of a whole lot of trial-and-error, and of playing with the different blocks in different configurations until I found a combination I love. Download the code onto your Circuit Playground to see the animation in real life, then change it all around until its yours and you love it.
Once you're happy, copy/paste your blocks to also apply them to
strip2 (your NeoPixel strip).
Create a function and move all the code except for
set hue to 50 into the function. That block was just for testing, so delete it for now. We don't want to lock
hue into any particular number just yet.
RainbowSwirls mode is almost exactly the same as
Gradient mode. I want to keep the randomness (though I'll tweak the numbers a bit) and the format and speed. The main difference is that we're going to add
change hue by 1 to the end so the hue moves through all the colors in the spectrum, instead of being based on just one color.
Copy all the code from the
Gradient function back into your FOREVER loop. Change the randomness values of the hue as shown, and add
change hue by 1 from the VARIABLES tab in at the bottom. Watch it on the emulator to see what happens.
Once you're happy with the rainbow animation, move the code into its own function called
I added one more mode, which gives a twinkly white glittery effect. The easy way to do this is to use one of MakeCode's preprogrammed animations. Look under LIGHT > MORE and drag an instance of strip show animation for 500 ms into your
forever loop. Add a
pause from the LOOPS tab to control the speed.
This is easy, and there are five other canned animations you can use as modes as well. However... I find this particular canned animation to be a bit frenetic for this project. It also can't be interrupted for the 500 ms that it's running, which makes the button presses not work very well - you tend to get "stuck" in the canned animations. I spent a bunch of time playing around and came up with my own twinkle animation.
This code makes random pixels blink on in a variety of muted colors and whites. I achieved this by choosing random hues with low saturation (remember, saturation 0 is colorless), and then it makes other random pixels blink off. I found that for the long NeoPixel
strip2, this created a satisfying amount of lights, but for the Circuit Playground's 10 lights on
strip, I needed to double the "off" commands or the whole thing just sort of stayed lit up.
The one new thing here is the
strip length block, which is found in the MORE tab near the bottom. This is a handy little block of code that will automatically remember how many lights you said the strip has and apply that number -- like an automatic variable.
This code picks a random light from
strip length, and sets a random pale hue, saturation and value to it. The next block picks a different random light and turns the pixel off. We end up with pale pastel lights twinkling merrily all over the corset.
That's all our functions! Next we'll build our mode-switching engine and tell the buttons how to navigate through all the modes.