Liquid GlassAPI Reference
Liquid GlassAPI Reference
Spring
The physics primitive driving all animations.
Spring
A damped harmonic oscillator class used to drive all animations in Liquid Glass.
Constructor
new Spring(value: number, stiffness?: number, damping?: number)
| Param | Type | Default | Description |
|---|---|---|---|
value | number | Required | Initial value of the spring |
stiffness | number | 300 | Spring stiffness (higher = faster movement) |
damping | number | 20 | Damping coefficient (higher = less overshoot) |
Props
| Prop | Type | Description |
|---|---|---|
value | number | Current simulated value |
target | number | The goal value the spring is moving towards |
velocity | number | Current velocity of the spring |
stiffness | number | Stiffness coefficient |
damping | number | Damping coefficient |
Methods
| Method | Returns | Description |
|---|---|---|
setTarget(t: number) | void | Set a new goal value |
update(dt: number) | number | Step the simulation by dt seconds; returns the new value |
isSettled() | boolean | Returns true when the spring has reached the target and stopped moving |
Basic Usage
import { Spring } from '@avenra/liquid-glass';
const spring = new Spring(0);
spring.setTarget(100);
function loop() {
const val = spring.update(1/60); // Assuming 60fps
console.log('Current value:', val);
if (!spring.isSettled()) {
requestAnimationFrame(loop);
}
}
loop();