As I said in that post:
I sat down to sketch some things out and ended up making a small framework for generating dynamic data that can be used to animate pretty much any aspect of the user interface of a program written using the JUCE application framework (which I’ve written about here many times before), and has the goals of being:
- Lightweight—if there aren’t any animations in progress, there’s no runtime overhead.
- Flexible—it’s easy to add new types of animation curves if you want to, or to chain multiple curves together into a more complex sequence.
- Decoupled—it doesn’t need or want to know anything about your application. When your code creates an animation effect, you pass it a pair of
std::functionobjects; one to handle updates for each frame, and another one to handle the completion of the effect.
- Modern—written using current C++ techniques (defined for our purposes as C++11 and later). I spent some time away from C++ and have come back to find the language has undergone some seroius changes that require me to consciously update my habits, making me feel like the programmer version of SNL’s Unfrozen Caveman Lawyer.
As the code began to take shape, I decided to name it after the great Warner Bros. animator/director Friz Freling. I would like to have called it ‘Chuck’ after his colleague Chuck Jones, but “ChucK” already means something else in the electronic music software world.
I found the time this past weekend to update the Friz code with two things that I’ve had on my list for a long time:
The library is now packaged as a JUCE module, so it’s straightforward to include in a JUCE project without needing to manually copy files around. In reality, I should have done this from day one (and now that I understand how trivial it is to work with JUCE modules, that’s how I’ll approach anything like this in the future).
To use friz as a module, get it from the GitHub repo (see below) and then use the Projucer to add it to your project from that directory:
Once you’ve done that, you can just add
…and start using it as described in my earlier post.
New ‘parametric’ easing curves
Shortly after releasing the original version of this last year, I stumbled on an excellent site that described itself as an "Easing Curve Cheat Sheet" that shows examples of a whole bunch of curves that are commonly found in the wild—libraries and frameworks like jQuery, Cinder, and Flutter all support a set of curves that all point back to functions defined by Robert Penner, whose site you should check out.
Parametric class may be created to implement any of those Penner curves, or you can use it to follow any curve that you design, by passing in a function (whether a
std::function, lambda, or plain old C function) that accepts a single
float parameter in the range
[0..1] and returns a
float that is typically but not necessarily also in the
[0..1] range. The animation framework will interpolate that output value between the start/end values used in your animation. Since these curves may have overshoot on either end (see for example, the
easeInOutElastic curve, which has fairly complex under- and overshoot on both ends of the curve), the code that handles your animation must work correctly when passed values outside of your start/stop values (where only you can define what ‘correctly’ means other than ‘don’t crash’).
You can get the library at https://github.com/bgporter/animator, and it’s MIT licensed. Open source, closed source, it’s all fine by me as long as you only use it for good and not evil.
Go make cool stuff.
This work is licensed under a Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License.