/rive-by-example

A set of examples showing how to use Rive's runtimes.

Primary LanguageJavaScriptMIT LicenseMIT

Rive By Example

A collection of repositories showing how to use the Rive runtimes.

Flutter

Run flutter create . in a Flutter project directry to generate platform support files.

Examples

  1. Simple looping Animation - continuously play a looping animation.

  2. Start/Stop Animation - control starting and stopping a looping animation.

  3. Mixing Animations - Mixing animations together.

  4. Controlling Mix - Control the level/strength of mix between animations.

  5. Custom Controller - basic custom controller demonstrating how to customize animation behavior.

  6. Callback Controller - custom controller demonstrating how to have a callback when an animation completes, and how to replay an animation.

Web

Pure web examples use express-generator for simple local hosting. Run npm install in the example's root directory, and then npm run to serve the app.

If you'd like to learn step-by-step how the web runtimes work, have a look at the example READMEs in order.

Examples

  1. Load Rive File - demonstrates how to load a Rive file and show the first frame of an animation.

  2. Looping Animation - demonstrates how to continuously play a looping animation.

  3. Mixing Animations - demonstrates how to mix different animations together.

  4. Coming soon ...

  5. React Component - sample React component for playing Rive animations