Draw Order

Summary

Draw order in Rive is typically determined by the layer hierarchy; layers at the top are rendered in front of those below them. However, Draw Rules allow you to override this hierarchy during an animation, enabling objects to dynamically move behind or in front of others regardless of their position in the hierarchy panel.

Step by Step

1. 00:25
   Creating a Draw Rule

   Select the object you want to reorder, go to the Draw Order section in the Inspector, and click the + icon to add a rule.
2. 00:48
   Naming and Targeting

   Rename your rule for clarity (e.g., "Square Under Circle"). In the rule settings, set the Position (Below or Above) and choose a Target shape.
3. 01:10
   Testing the Toggle

   Switch between Normal (hierarchy-based) and your new rule to verify the visual change in the viewport.
4. 02:03
   Animating the Order

   In Animate mode, move the playhead to the desired time and click the Draw Rule name to create a keyframe.
5. 02:20
   Switching States

   Move the playhead again and switch back to "Normal" or another rule to create a dynamic depth transition (e.g., a moon orbiting a planet).

Notes About Current Rive

• Target Limitations: You can only set a Shape layer as a target for a draw rule; Groups or Bones cannot be selected as targets.
• Rigging Flexibility: You can create multiple draw rules for a single layer, which is extremely useful for complex character rigs where limbs need to swap depth frequently.
• Keyframing Tip: If clicking "Normal" doesn't automatically create a keyframe, try toggling the rule button to force the timeline to register the state change.