Artboard - Rive

Represents a Rive artboard instance, providing drawing, advancing, interaction handling, and access to named nodes and data.

Fields

`frameOrigin`

If true, the artboard’s origin is treated as the frame origin.

function init(self: RenderInstance, context: Context): boolean
  local vm = Data.Character.new()

  self.instance = self.character:instance(vm)
  if self.instance then
    self.instance.frameOrigin = true
  end

  return true
end

`data`

The typed data associated with the artboard.

function init(self: RenderInstance, context: Context): boolean
  local vm = Data.Character.new()

  self.instance = self.character:instance(vm)

  if self.instance then
    self.instance.frameOrigin = true

    local data = self.instance.data
    if data then
      print(data.nickname)
    end
  end

  return true
end

`width`

The width of the artboard.

self.instance = self.character:instance(vm)
  if self.instance then
    print(self.instance.width)
  end
end

`height`

The height of the artboard.

self.instance = self.character:instance(vm)
  if self.instance then
    print(self.instance.height)
  end
end

Methods

`draw`

draw(renderer: Renderer) -> ()

Draws the artboard using the provided renderer.

type RenderInstances = {
  character: Input<Artboard<Data.Character>>,

  instance: Artboard<Data.Character>?,
}

function init(self: RenderInstances, context: Context): boolean
  local vm = Data.Character.new()

  self.instance = self.character:instance(vm)

  return true
end

function draw(self: RenderInstances, renderer: Renderer)
  local instance = self.instance

  if instance then
    renderer:save()
    instance:draw(renderer)
    renderer:restore()
  end
end

return function(): Node<RenderInstances>
  return {
    character = late(),
    instance = nil,
    init = init,
    draw = draw,
  }
end

`drawCanvas`

drawCanvas() -> ()

Use this method to call drawCanvas on instances that are created dynamically. This must only be called during an active canvas drawing phase, such as from within a drawCanvas callback.

`advance`

advance(seconds: number) -> boolean

Advances the artboard by the given time in seconds. Returns true if the artboard should continue receiving advance calls.

type RenderInstances = {
  character: Input<Artboard<Data.Character>>,

  instance: Artboard<Data.Character>?,
}

function init(self: RenderInstances, context: Context): boolean
  local vm = Data.Character.new()

  self.instance = self.character:instance(vm)

  return true
end

function advance(self: RenderInstances, seconds: number): boolean
  if self.instance then
    return self.instance:advance(seconds)
  end
  return true
end

return function(): Node<RenderInstances>
  return {
    character = late(),
    instance = nil,
    init = init,
    advance = advance,
  }
end

`instance`

instance(viewModel: ViewModel?) -> Artboard<T>

Creates a new instance of the artboard with independent state.

type ViewModelExample = {
  character: Input<Artboard<Data.Character>>,
  instance: Artboard<Data.Character>?,
}

function init(self: ViewModelExample, context: Context): boolean
  local vm = Data.Character.new()
  self.instance = self.character:instance(vm)
  return true
end

return function(): Node<ViewModelExample>
  return {
    character = late(),
    instance = nil,
    init = init,
  }
end

`animation`

animation(name: string) -> Animation?

Creates an animation instance linked to the artboard instance

`bounds`

bounds() -> (Vector, Vector)

Returns the bounding box of the artboard as two Vector values: the minimum point and the maximum point.

local minPt, maxPt = self.instance:bounds()
print("Bounds width", maxPt.x - minPt.x)
print("Bounds height", maxPt.y - minPt.y)

`node`

node(name: string) -> NodeData?

Returns the node with the given name, or nil if no such node exists.

if self.instance then
  local node = self.instance:node('Root')
  if node then
    local m = Mat2D.withTranslation(100, 100)
    node:decompose(m)
  end
end

`pointerDown`

pointerDown(event: PointerEvent) -> number

Pointer event down handler. Returns a hit-test result (0 = no hit). Only returns a non-zero value if a hit-testable object inside the nested artboard is hit.

function handlePointerDown(self: PointerExample, event: PointerEvent)
  if self.instance then
    local hit = self.instance:pointerDown(event)
    if hit ~= 0 then
      print(event.id)
      print(event.position)
    end
  end
end

`pointerUp`

pointerUp(event: PointerEvent) -> number

Pointer event up handler. Returns a hit-test result (0 = no hit). Only returns a non-zero value if a hit-testable object inside the nested artboard is hit.

function handlePointerUp(self: PointerExample, event: PointerEvent)
  if self.instance then
    local hit = self.instance:pointerUp(event)
    if hit ~= 0 then
      print(event.id)
      print(event.position)
    end
  end
end

`pointerMove`

pointerMove(event: PointerEvent) -> number

Pointer event move handler. Returns a hit-test result (0 = no hit). Only returns a non-zero value if a hit-testable object inside the nested artboard is hit.

function handlePointerMove(self: PointerExample, event: PointerEvent)
  if self.instance then
    local hit = self.instance:pointerMove(event)
    if hit ~= 0 then
      print(event.id)
      print(event.position)
    end
  end
end

`pointerExit`

pointerExit(event: PointerEvent) -> number

Pointer event exit handler. Returns a hit-test result (0 = no hit). Only returns a non-zero value if a hit-testable object inside the nested artboard is hit.

function handlePointerExit(self: PointerExample, event: PointerEvent)
  if self.instance then
    local hit = self.instance:pointerExit(event)
    if hit ~= 0 then
      print(event.id)
      print(event.position)
    end
  end
end

`addToPath`

addToPath(path: Path, transform: Mat2D?) -> ()

Adds the artboard’s geometry to the given path, optionally transformed by the provided matrix. For a complete working example, see the Add to Path demo.

function draw(self: AddToPathExample, renderer: Renderer)
  local instance = self.instance
  if not instance then
    return
  end

  -- Draw the artboard normally first.
  renderer:save()
  instance:draw(renderer)
  renderer:restore()

  -- Reset the path each frame, then rebuild it from the artboard's geometry.
  self.outlinePath:reset()

  -- Add the artboard's geometry into the path with an optional transform.
  -- Here we apply a slight offset via Mat2D to show the transform parameter.
  local transform = Mat2D.withTranslation(8, 8)
  instance:addToPath(self.outlinePath, transform)

  -- Draw the extracted path with a custom stroke paint as an outline / shadow effect.
  renderer:drawPath(self.outlinePath, self.outlinePaint)
end

`gamepadConnected`

gamepadConnected(event: GamepadConnected) -> number

`gamepadEvent`

gamepadEvent(event: GamepadEvent) -> number

`gamepadDisconnected`

gamepadDisconnected(event: GamepadDisconnected) -> number

​Fields

​frameOrigin

​data

​width

​height

​Methods

​draw

​drawCanvas

​advance

​instance

​animation

​bounds

​node

​pointerDown

​pointerUp

​pointerMove

​pointerExit

​addToPath

​gamepadConnected

​gamepadEvent

​gamepadDisconnected