Rive Scripting
Rive Scripting uses Luau (Roblox's Lua variant) to create interactive and procedural behaviors inside Rive animations. Scripts run in the Rive editor and export with your .riv file.
Script Types
| Type |
Purpose |
Key Methods |
| Node Script |
Procedural drawing and interactivity |
init, advance, update, draw |
| Layout Script |
Custom sizing and positioning |
measure, resize |
| Converter Script |
Transform data for bindings |
convert, reverseConvert |
| PathEffect Script |
Modify paths procedurally |
effect |
| Util Script |
Reusable helper functions |
exports |
Luau Quick Reference
-- Types
type MyState = {
count: number,
active: boolean,
items: {string},
}
-- Functions
local function add(a: number, b: number): number
return a + b
end
-- Tables
local t = {x = 10, y = 20}
t.z = 30
-- Conditionals
if value > 0 then
-- positive
elseif value < 0 then
-- negative
else
-- zero
end
-- Loops
for i = 1, 10 do
print(i)
end
for key, value in pairs(table) do
print(key, value)
end
Core Pattern
All Rive scripts follow this pattern:
-- 1. Define your state type
type MyNode = {
path: Path,
paint: Paint,
time: number,
}
-- 2. Define protocol methods
function draw(self: MyNode, renderer: Renderer)
renderer:drawPath(self.path, self.paint)
end
function advance(self: MyNode, elapsed: number)
self.time = self.time + elapsed
end
-- 3. Return factory function
return function(): Node<MyNode>
return {
draw = draw,
advance = advance,
path = Path.new(),
paint = Paint.new(),
time = 0,
}
end
Key APIs
Drawing
Path - Vector paths (moveTo, lineTo, quadTo, cubicTo, close)
Paint - Fill/stroke styling (color, gradient, thickness)
Renderer - Drawing operations (drawPath, clipPath, transform)
Geometry
Vec2D - 2D vectors (xy, length, normalize, dot)
AABB - Axis-aligned bounding boxes
Mat2D - 2D transformation matrices
Data
ViewModel - Access bound data
Property - Read/write data values
Trigger - Fire events
Rules
@file rules/getting-started.md
@file rules/node-scripts.md
@file rules/drawing.md
@file rules/pointer-events.md
@file rules/layout-scripts.md
@file rules/converter-scripts.md
@file rules/path-effects.md
@file rules/data-binding.md
@file rules/util-scripts.md
@file rules/api-reference.md
1---2name: rive-scripting3description: Trigger when: (1) Working with Rive scripts or Luau code, (2) Code contains Node, Layout, Converter, or PathEffect protocols, (3) User mentions "Rive scripting" or "Rive Luau", (4) Drawing with Path, Paint, Renderer APIs, (5) Files have .lua extension in a Rive project context. Best practices for Rive Scripting - Luau-based scripts for procedural graphics, custom layouts, data converters, and path effects that run inside Rive animations.4---56# Rive Scripting78Rive Scripting uses Luau (Roblox's Lua variant) to create interactive and procedural behaviors inside Rive animations. Scripts run in the Rive editor and export with your .riv file.910## Script Types1112| Type | Purpose | Key Methods |13|------|---------|-------------|14| **Node Script** | Procedural drawing and interactivity | `init`, `advance`, `update`, `draw` |15| **Layout Script** | Custom sizing and positioning | `measure`, `resize` |16| **Converter Script** | Transform data for bindings | `convert`, `reverseConvert` |17| **PathEffect Script** | Modify paths procedurally | `effect` |18| **Util Script** | Reusable helper functions | `exports` |1920## Luau Quick Reference2122```lua23-- Types24type MyState = {25 count: number,26 active: boolean,27 items: {string},28}2930-- Functions31local function add(a: number, b: number): number32 return a + b33end3435-- Tables36local t = {x = 10, y = 20}37t.z = 303839-- Conditionals40if value > 0 then41 -- positive42elseif value < 0 then43 -- negative44else45 -- zero46end4748-- Loops49for i = 1, 10 do50 print(i)51end5253for key, value in pairs(table) do54 print(key, value)55end56```5758## Core Pattern5960All Rive scripts follow this pattern:6162```lua63-- 1. Define your state type64type MyNode = {65 path: Path,66 paint: Paint,67 time: number,68}6970-- 2. Define protocol methods71function draw(self: MyNode, renderer: Renderer)72 renderer:drawPath(self.path, self.paint)73end7475function advance(self: MyNode, elapsed: number)76 self.time = self.time + elapsed77end7879-- 3. Return factory function80return function(): Node<MyNode>81 return {82 draw = draw,83 advance = advance,84 path = Path.new(),85 paint = Paint.new(),86 time = 0,87 }88end89```9091## Key APIs9293### Drawing94- `Path` - Vector paths (moveTo, lineTo, quadTo, cubicTo, close)95- `Paint` - Fill/stroke styling (color, gradient, thickness)96- `Renderer` - Drawing operations (drawPath, clipPath, transform)9798### Geometry99- `Vec2D` - 2D vectors (xy, length, normalize, dot)100- `AABB` - Axis-aligned bounding boxes101- `Mat2D` - 2D transformation matrices102103### Data104- `ViewModel` - Access bound data105- `Property` - Read/write data values106- `Trigger` - Fire events107108## Rules109110@file rules/getting-started.md111@file rules/node-scripts.md112@file rules/drawing.md113@file rules/pointer-events.md114@file rules/layout-scripts.md115@file rules/converter-scripts.md116@file rules/path-effects.md117@file rules/data-binding.md118@file rules/util-scripts.md119@file rules/api-reference.md