SusParallaxStack

Pointer-driven layered stack: bg → pattern → subject → ui (tips) → chrome.

Package

SusKit · Atoms (commercial)

Open in Playground

SusKit · Atoms

Props

Name	Type	Default
PatternAmp	Prop<float>	8f
SubjectAmp	Prop<float>	14f
UiAmp	Prop<float>	22f
Enabled	Prop<bool>	true
Easing	Prop<float>	0.08f
MinFps	Prop<float>	24f
PauseOnFocusLoss	Prop<bool>	false

Slots

No slots.

Events

Name	Field	Payload
ActiveChanged	OnActiveChanged	bool

Style hooks

USS class contract — override appearance without touching C#. States toggle via these classes:

• sus-parallax-stack
• sus-parallax-stack__bg
• sus-parallax-stack__chrome
• sus-parallax-stack__layer
• sus-parallax-stack__layers
• sus-parallax-stack__pattern
• sus-parallax-stack__subject
• sus-parallax-stack__tips
• sus-parallax-stack__ui
• sus-parallax-stack--off

Usage

var stack = new SusParallaxStack();
stack.EnsureLayers();
stack.Subject.Add(characterArt);
stack.Chrome.Add(nav);
stack.SetAmps(patternAmp: 8f, subjectAmp: 14f, uiAmp: 4f);

Prop / API	Role
PatternAmp / SubjectAmp / UiAmp	Parallax amplitude (px)
Enabled	Master switch. Default true
PauseOnFocusLoss	Park while the application window has no focus. Default false
SetLayers(layers)	Replace the picture layers (see below)
TrackPointer(source)	Also follow the pointer over another element
IsActive / OnActiveChanged	Whether the stack is moving right now, and its edges

Picture layers

SetLayers takes a list of SusParallaxLayer (picture, depth, optional USS class). The layers live in a sus-parallax-stack__layers host between Bg and Pattern; each layer is an absolute, pointer-transparent sus-parallax-stack__layer element that moves by Depth times the pointer offset. Depth is in pixels at the stack edge: 0 is static, larger is nearer, negative moves against the pointer. Size, position and bleed belong in USS. A null or empty list removes the host, and the stack is back to its five built-in layers.

stack.SetLayers(new List<SusParallaxLayer>
{
    new SusParallaxLayer(Background.FromTexture2D(sky), depth: 4f),
    new SusParallaxLayer(Background.FromTexture2D(ridge), depth: 12f, className: "my-backdrop__ridge"),
});

// A backdrop sits under the screen content and gets no pointer events of its own:
// follow the pointer over the screen root instead.
stack.TrackPointer(screenRoot);
stack.PauseOnFocusLoss.Value = true;

TrackPointer maps the pointer position into the stack's own rect; leaving the source eases the layers back to zero. The callbacks live only while the stack is attached to a panel. null stops following, and a new source replaces the old one.

With PauseOnFocusLoss on, an unfocused window parks the stack: layers rest at zero, the ticker stops and the root gets sus-parallax-stack--unfocused. Focus back resumes on the next pointer move.

Reduce motion

While SusMotion.Reduce is on, the stack parks the same way: layers at zero, no ticker, class sus-parallax-stack--reduced on the root. Turning the flag off resumes on the next pointer move.

Notes

• Call EnsureLayers() after build to resolve layer hosts (Bg, Pattern, Subject, Ui, TipHost, Chrome).
• Visual look (art, glass) belongs in consumer USS.

See also Layout recipes.