mirror of
https://github.com/niri-wm/niri.git
synced 2026-06-22 02:01:55 +07:00
feat: cubic-bezier curve for animation (#2059)
* feat: bezier curve for animation * fixes --------- Co-authored-by: Ivan Molodetskikh <yalterz@gmail.com>
This commit is contained in:
@@ -84,14 +84,24 @@ animations {
|
||||
}
|
||||
```
|
||||
|
||||
Currently, niri only supports four curves:
|
||||
Currently, niri only supports five curves.
|
||||
You can get a feel for them on pages like [easings.net](https://easings.net/).
|
||||
|
||||
- `ease-out-quad` <sup>Since: 0.1.5</sup>
|
||||
- `ease-out-cubic`
|
||||
- `ease-out-expo`
|
||||
- `linear` <sup>Since: 0.1.6</sup>
|
||||
|
||||
You can get a feel for them on pages like [easings.net](https://easings.net/).
|
||||
- `cubic-bezier` <sup>Since: next release</sup>
|
||||
A custom [cubic Bézier curve](https://www.w3.org/TR/css-easing-1/#cubic-bezier-easing-functions). You need to set 4 numbers defining the control points of the curve, for example:
|
||||
```kdl
|
||||
animations {
|
||||
window-open {
|
||||
// Same as CSS cubic-bezier(0.05, 0.7, 0.1, 1)
|
||||
curve "cubic-bezier" 0.05 0.7 0.1 1
|
||||
}
|
||||
}
|
||||
```
|
||||
You can tweak the cubic-bezier parameters on pages like [easings.co](https://easings.co?curve=0.05,0.7,0.1,1).
|
||||
|
||||
#### Spring
|
||||
|
||||
|
||||
Reference in New Issue
Block a user