Home » Developing U++ » U++ Developers corner » Cubic-Bézier Easing + AnimateProperty for U++ Animations (Header-only patch adds cubic-Bézier easing, presets, and AnimateProperty() for any widget property)
Cubic-Bézier Easing + AnimateProperty for U++ Animations [message #61694] |
Mon, 02 June 2025 11:52  |
dodobar
Messages: 19 Registered: April 2023 Location: Germany
|
Promising Member |
|
|
Hi everyone,
U++ 2025.1 shipped an awesome Animate().
Here's a tiny, header-only patch that adds cubic-Bézier curves and lets you
tween **any** property--not just rectangles.
──────────────────── ──
WHAT'S INSIDE
──────────────────── ──
• CtrlLib/Easing.h (≈50 LOC, constexpr)
de Casteljau cubic-Bézier evaluator
Factory: Bezier(x1,y1,x2,y2) → Fn
Presets: EaseLinear, EaseInQuad, EaseOutQuad,
EaseInOutQuad, EaseOutBounce ... add your own
• Core/Util.h overload
Lerp(a, b, t, Easing::Fn) // falls back to old behaviour if Fn == nullptr
• CtrlLib/CtrlUtil.h additions
Animate().Easing(fn) // drop-in upgrade
template AnimateProperty<T> // animate pos, size, colour, opacity, angle...
Overhead: four multiplies per frame.
Behaviour: identical to CSS, Qt, WPF, Flutter cubic-Bézier timing.
──────────────────── ──
EXAMPLE SNIPPETS
──────────────────── ──
// 1. Ease-in-out slide
Animate(panel).Time(400)
.Easing(Easing::EaseInOutQuad)
.Pos(Rect(40,40,200,100))
.Run();
// 2. Generic fade
AnimateProperty<double>(1.0, 0.0,
[&](double a){ dlg.SetOpacity(a); }, 250, Easing::EaseLinear);
// 3. Designer curve (CSS "ease-out-expo")
auto expo = Easing::Bezier(0.19, 1.0, 0.22, 1.0);
AnimateProperty<Color>(Red, Blue,
[&](Color c){ btn.SetInk(c); }, 500, expo);
──────────────────── ──
WHY BOTHER?
──────────────────── ──
• Industry-standard curves--instantly familiar to web/UI designers.
• Zero ABI churn--everything is inline.
• Keeps U++ lean yet modern; linear remains the default.
• Future-proof--springs or LUT curves can reuse the same `Easing::Fn` typedef.
──────────────────── ──
GITHUB DISCUSSION / CODE
──────────────────── ──
https://github.com/ultimatepp/ultimatepp/discussions/274
**How to try:**
1. Drop `Easing.h` into *CtrlLib*.
2. Add the 4-arg `Lerp` to *Core/Util.h*.
3. Extend *CtrlLib/CtrlUtil.h* with `.Easing()` and `AnimateProperty<>`.
4. Re-build TheIDE (or run `umk uppsrc theide CLANG -a`).
Your widgets will glide.
Feedback--or extra easing presets--welcome!
Cheers,
Curt
[Updated on: Tue, 03 June 2025 04:50] Report message to a moderator
|
|
|
|
|
Re: Cubic-Bézier Easing + AnimateProperty for U++ Animations [message #61700 is a reply to message #61699] |
Tue, 03 June 2025 03:54  |
dodobar
Messages: 19 Registered: April 2023 Location: Germany
|
Promising Member |
|
|
Hi Didier,
Sorry for the confusion--my post was prepared against the
2025.1 snapshot (commit from 25 May).
Since then, master shuffled a few headers...
Animate is now in CtrlUtil
uppsrc/CtrlLib/CtrlUtil.h
I have not committed a version in my fork yet as hoping that @mirek-fidler feels this is a worthy addition
and I promised I would work on this.
once in the master / approved I will begin creating some nice examples
cheers
note: makefiles and builds is definitely not my strong point, but I'm trying to build this weakness up.
[Updated on: Tue, 03 June 2025 04:30] Report message to a moderator
|
|
|
Goto Forum:
Current Time: Tue Jun 10 14:14:25 CEST 2025
Total time taken to generate the page: 0.03806 seconds
|