Rive

Render Rive animations in your Flet app with the flet-rive extension.

Platform Support

Platform	Windows	macOS	Linux	iOS	Android	Web
Supported	✅	✅	✅	✅	✅	✅

Usage

Add flet-rive to your project dependencies:

uvpip

uv add flet-rive

pip install flet-rive  # (1)!

1. After this, you will have to manually add this package to your requirements.txt or pyproject.toml.

Hosting Rive files

Host .riv files locally or load them from a CDN. Use placeholder to keep layouts responsive while animations load.

Example

import flet_rive as ftr

import flet as ft


def main(page: ft.Page):
    page.add(
        ftr.Rive(
            src="https://cdn.rive.app/animations/vehicles.riv",
            placeholder=ft.ProgressBar(),
            width=300,
            height=200,
        ),
        ftr.Rive(
            src="vehicles.riv",
            placeholder=ft.ProgressBar(),
            width=300,
            height=200,
        ),
    )


ft.run(main)

Description

Inherits: LayoutControl

Displays rive animations.

Properties

• alignment(Alignment | None) –

  Alignment for the animation in the Rive control.

• animations(list[str]) –

  List of animations to play; default animation is played if empty.

• artboard(str | None) –

  The name of the artboard to use.

• clip_rect(Rect | None) –

  Clip the artboard to this rect.

• enable_antialiasing(bool) –

  Whether to enable anti-aliasing when rendering.

• fit(BoxFit | None) –

  The animation's fit.

• headers(dict[str, str] | None) –

  Headers for network requests.

• placeholder(Control | None) –

  Control displayed while the Rive is loading.

• speed_multiplier(Number) –

  A multiplier for controlling the speed of the Rive animation playback.

• src(str) –

  The source of your rive animation.

• state_machines(list[str]) –

  List of state machines to play; none will play if empty.

• use_artboard_size(bool) –

  Determines whether to use the inherent size of the artboard,

Properties

alignment class-attribute instance-attribute

alignment: Alignment | None = None

Alignment for the animation in the Rive control.

animations class-attribute instance-attribute

animations: list[str] = field(default_factory=list)

List of animations to play; default animation is played if empty.

artboard class-attribute instance-attribute

artboard: str | None = None

The name of the artboard to use. If not specified, the default artboard of the provided src is used.

clip_rect class-attribute instance-attribute

clip_rect: Rect | None = None

Clip the artboard to this rect.

If not supplied it'll default to the constraint size provided by the parent control. Unless the Artboard has clipping disabled, then no clip will be applied.

enable_antialiasing class-attribute instance-attribute

enable_antialiasing: bool = True

Whether to enable anti-aliasing when rendering.

fit class-attribute instance-attribute

fit: BoxFit | None = None

The animation's fit.

headers class-attribute instance-attribute

headers: dict[str, str] | None = None

Headers for network requests.

placeholder class-attribute instance-attribute

placeholder: Control | None = None

Control displayed while the Rive is loading.

speed_multiplier class-attribute instance-attribute

speed_multiplier: Number = 1.0

A multiplier for controlling the speed of the Rive animation playback.

src instance-attribute

src: str

The source of your rive animation.

Can either be a URL or a path to a local asset file.

state_machines class-attribute instance-attribute

state_machines: list[str] = field(default_factory=list)

List of state machines to play; none will play if empty.

use_artboard_size class-attribute instance-attribute

use_artboard_size: bool = False

Determines whether to use the inherent size of the artboard, i.e. the absolute size defined by the artboard, or size the control based on the available constraints only (sized by parent).