How to set properties of Rive data-binding view model

Hi,

I am trying to dynamically set properties for a Rive view-model (i.e. bind data for a Rive animation at runtime), but I cannot seem to find any options to do so. The element actions for the Rive animation only include “Set Boolean”, “Set number”, “Fire”, “Play”, and “Pause”, and these only seem to affect Rive state machines and their inputs.

Does Plasmic’s integration with Rive support data binding? Can we dynamically get/set the properties of the view-model at runtime? Additionally, can Rive text-run values be set/get at runtime? Is there any documentation on this?

Here is the Rive animation that I am currently experimenting with, and you should be able to set three properties of the view-model: “bar” (i.e. the color of the progress bar), "min, “max”, and “current” and that impacts the progress bar animation
https://rive.app/marketplace/17811-33444-data-binding-example-tutorial-in-file-loaders/

Below is a screenshot of what I see in Plasmic:

Please advise. Thanks!

Hi @belal_sweileh, as Rive only released data binding a few weeks ago for rive-react, we haven’t had a chance to integrate and test the data binding functionality yet.

Any chance you’re a developer and would be interested in helping out with this effort?

Hi @jason,

I know my way around code and I’ll be glad to help in any way I can. Let me know how I can be of assistance. Thanks!

1 Like

Awesome! Sent you a message on Slack.

The Rive code is all here: plasmic/plasmicpkgs/rive at master · plasmicapp/plasmic · GitHub

Would be awesome to integrate the data binding features there :slight_smile: