Listeners

Listeners let you add interactive behaviors — clicks, hovers, drags — directly inside Rive, without writing code. A Listener watches for a user action and responds by changing View Model (a container that holds your app's data — defined on the Data Binding page) properties, firing events, or moving objects.

Listeners live inside a State Machine (think of a state machine like a flowchart that decides which animation plays). Open a state machine to add and manage them.

Structure of a Listener

Every Listener has three parts:

1. Target — The shape or group that acts as the hit area. Any pointer interaction on this object triggers the Listener.
2. Condition — What kind of event to listen for.
3. Action — What happens when the condition is met.

Adding a Listener

Click the + button below the State Machine Graph and select Listener. Configure its Target, Condition, and Action in the Inspector.

Listener Conditions

Pointer Events

Condition	Fires when
Pointer Down	The pointer is pressed inside the target
Pointer Up	The pointer is released inside the target
Pointer Enter	The pointer enters the target area
Pointer Exit	The pointer leaves the target area
Pointer Move	The pointer moves within the target area
Click	A full down-then-up sequence inside the target

Data-Driven Conditions

Condition	Fires when
Listen for Event	A named event fires on a Component target
View Model Property Change	A selected View Model property changes value

Listener Actions

Action	What it does
View Model Change	Sets a View Model property to a specific value, or copies the value from another property. Can use a converter (a rule that transforms a value before using it — for example, converting a number to a true/false flag) to transform the value.
Report Event	Fires a named event when the condition triggers.
Align Target	Moves an object to follow the pointer's X/Y position — useful for drag interactions or cursor followers.

Example: Button Hover

A typical button has three states (Idle, Hovered, Clicked) and two listeners:

1. Pointer Enter → Idle sets isHovered = true, driving a transition to the Hovered state.
2. Pointer Exit sets isHovered = false, returning to Idle.

Listeners Deep Dive

Full reference for Listener conditions, actions, and complex interaction patterns.

State Machine

Listeners work inside State Machines — learn the full state machine model.