Detecting Click Events in Nested Artboards with Flutter
Hello!
We develop simple games using Rive in Flutter, and we're working on a project where the entire game scene is built within a single Rive artboard, using nested artboards for composition.
Our goal is to detect clicks on the game elements (nested artboards) and report them to our Flutter code. We've noticed that clicks are being detected correctly—for example, when we set up a listener in a nested artboard and configure an input in its state machine, the interaction works as expected. However, we're unable to properly handle or propagate the events to our main Flutter application code.
We suspect this issue might be related to the main artboard's state machine not being linked to the events reported by the nested artboards.
Our questions are:
Is it possible to detect and handle events reported by nested artboards in Flutter?
How can we configure Rive to propagate these events back to our Flutter application code effectively?
Any guidance or examples would be greatly appreciated!
Hey there! I put together a little video to answer your questions.
Events from nested artboards aren't seen at runtime, so we have to "bubble them up" using listeners on the main artboard.
Thanks for the suggestion, Robert! It's a good workaround for now, but I feel there should be a simpler solution built into Rive. I’m hopeful that in a future release, we’ll see a feature like "expose events to parent" or something similar. This would be incredibly useful for scenarios with nested artboards, especially when events are triggered by a specific child (e.g., a leaf node). It would enable seamless interaction between Rive and the code, particularly in complex UI setups.
From a game development perspective, for example, if I have multiple enemies (instances of the same artboard), it would be ideal to report events with custom properties, such as the enemy’s ID, strength, or other attributes. This capability would significantly simplify handling interactions in dynamic and complex game scenes, making them both easier and more powerful to implement.
Maybe a good and simple solution would be allowing us to listen for events in nested state machines. Currently, in Flutter, we have the RuntimeNestedStateMachineInstance class, but it lacks an addEventListener method. Unifying RuntimeNestedStateMachineInstance with the StateMachineController of a common artboard would be an awesome improvement.
Fwiw I’m running into the same limitations with the Unreal Engine runtime. More control over nested events and associated data is much needed.