Joysticks

Summary

Joysticks are powerful on-stage controllers used to manipulate multiple properties simultaneously by scrubbing through independent timelines. This lesson covers how to create joysticks, assign timelines to X and Y axes, manage property conflicts, and customize controller behavior such as world-space drawing and handle sources.

Step by Step

1. 00:19
   Creating a Joystick

   Access the Joystick tool from the bone menu or use the shortcut J. Click anywhere on the artboard to place it.
2. 00:48
   Customizing Properties

   Adjust the joystick's size, origin, and toggle Draw in World Space. When enabled, the joystick scales with your zoom level, making it easier to see during detailed work.
3. 03:22
   Setting Handle Sources

   Use the "Handle Source" target selector to link the joystick handle to a physical object on the artboard, such as a custom slider group.
4. 04:33
   Creating Source Timelines

   In Animate Mode, create separate timelines for horizontal movement (e.g., "X timeline") and vertical movement (e.g., "Y timeline").
5. 05:04
   Assigning Axes

   Select the joystick and use the dropdown menus in the Inspector to assign your specific timelines to the X and Y axes.
6. 05:46
   Managing Conflicts

   Ensure that your X timeline _only_ contains X-axis keyframes and your Y timeline _only_ contains Y-axis keyframes. Overlapping properties on different axes will cause movement conflicts.
7. 06:41
   Interactive Control

   Create a third, main timeline to actually move the joystick handle and observe the combined motion of the objects it controls.

Notes About Current Rive

• Visual Guides: Use the "Invert" toggle on an axis if the object moves in the opposite direction of the joystick handle.
• Hierarchical Benefit: Joysticks can be parented to groups (like a character's head), allowing them to stay in context even when the main object moves or scales.
• Complex UI: Joysticks are the primary tool for creating complex UI controls or character facial expressions (like eye/mouth movement) that require multi-axis blending.