Skip to main content
C
3mo ago

Sequential calls to ref.setInputState results in only the last one being updating in the animation - React Native

When using Rive with React Native, setting multiple input states sequentially does not work as expected. Only the last input change is reflected in the animation, ignoring previous input changes. Here is an example of my code:

MonsterRef.current?.setInputState(stateMachineName, "Many Teeth Mouth", true);
MonsterRef.current?.setInputState(stateMachineName, "Many Eyes", true);

In this example, only the "Many Eyes" input change is reflected in the animation, while the "Many Teeth Mouth" input is ignored. The state machine this is affecting is a very large one, as seen below:

However, running a similar example on a different rive file with a SMALLER state machine gives the desired result.

^Works

I have found a workaround to the problem for the big state machine:

setTimeout(() => {
  MonsterRef.current?.setInputState(stateMachineName, "Many Teeth Mouth", true)
}, 50)
setTimeout(() => {
  MonsterRef.current?.setInputState(stateMachineName, "Many Eyes", true);
}, 50)

Using setTimeouts, this is the only solution I have found so far. But as my project grows, I will not be able to keep this up.

My theory is that as the state machine grows more complex, the longer it takes for an input to update the animation, however, perhaps there is not callstack, or awaiting for the first action to finish. Here is the corresponding Github Issue I opened a week ago: https://github.com/rive-app/rive-react-native/issues/265

I am using React Native 0.75.3, Expo 0.10.11, Rive-React-Native 7.30

If anyone were able to assist me, that would be great, thankyou!

2 replies
C
3mo ago

Have you checkout out state machine layers: https://rive.app/community/doc/layers/docQI8guiwME

By putting the teeth/mouth/eyes/etc all on separate state machine layers, you won't have to fire the same Any State twice at once.

C
3mo ago

Hey yeah it worked! But it is kind of annoying, I'll have to create a new layer for each Body Part, and Body type, so there's gonna be like 20 layers, but that's ok for now.
It would be good if that could be fixed though, so it doesn't matter the layer size and complexity.
Thanks though!