Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enable controlling animations durations for each trigger from the Flutter side #393

Open
azatech opened this issue May 22, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@azatech
Copy link

azatech commented May 22, 2024

Description

The main idea is that I'm using the Visemes, which comprises a total of 22 visemes (animated from 0 to 1). All 'Visemes' created in Rive with identical animation durations of 10ms, for instance.

Depending on the Viseme, I'll trigger one of the 22 animations within a specific time frame, resulting in an animated-speaking avatar.

Question 1

Is it possible to control the animation speed of each trigger and adjust it dynamically, not limited to the constant animation duration of 10ms from Rive, but rather allowing control and dynamic adjustment on the Flutter side?
For instance: Setting one trigger animation to 200ms and then to 3ms, and so on.

Question 2

Additionally, here's what I found online: link
Was this done on the Rive or Flutter side? Were the joysticks controlled from the Flutter side?
P.S. How would you suggest creating something similar on the Flutter side?

Video

In the video, I have 2 triggers, and I need to set a custom duration for each trigger animation every time from Flutter code.
I've reviewed the 'apply()' method, but I believe I may be using it incorrectly.

Code

class _VisemeRiveAnimationPageState extends State<VisemeRiveAnimationPage> {
  StateMachineController? stateMachineController;
  SMITrigger? trigger;
  SMITrigger? trigger2;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Stack(
          alignment: Alignment.bottomCenter,
          children: [
            RiveAnimation.asset(
              "assets/rive/man.riv",
              onInit: (artboard) {
                final stateMachine = StateMachineController.fromArtboard(
                  artboard,
                  'State Machine 1',
                )!;
                trigger = stateMachine.getTriggerInput('0');
                trigger2 = stateMachine.getTriggerInput('1');

                artboard.addController(stateMachine);
                /// I've reviewed the 'apply' method, but I believe I may be using it incorrectly.
                artboard.linearAnimations.first
                    .apply(3.2, coreContext: artboard.context);

                artboard.linearAnimations
                    .toList()[1]
                    .apply(3.2, coreContext: artboard.context);
              },
            ),
            Column(
              children: [
                const SizedBox(height: 50),
                ElevatedButton(
                  onPressed: () => trigger?.fire(),
                  child: const Text('0'),
                ),
                const SizedBox(height: 20),
                ElevatedButton(
                  onPressed: () => trigger2?.fire(),
                  child: const Text('1'),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}
@azatech azatech added the bug Something isn't working label May 22, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant