Comments (8)
Hi @ricsmania, you can return false in the advance function when you are done advancing. We need to document that and also add a way to start it back up, but for now that should allow you to save some CPU cycles :) let me know if that works!
from flare-flutter.
Hi @luigi-rosso I'm using a workaround that involves returning false, but I create a timer that sets a variable after 2 seconds, and if that variable is true I return false. I was looking for a good way to detect that the animation has finished without the timer, do you have a suggestion? I thought that checking if the elapsed is >= the duration would do that, but it doesn't seem to work.
from flare-flutter.
Hey @ricsmania!
The easiest way to do this is to use a local variable for your animation, and increment it by elapsed
every time advance()
is called.
Here's what I mean:
// Local field in your controller.
double animationTime = 0.0;
@override
bool advance(FlutterActorArtboard artboard, double elapsed) {
animationTime += elapsed;
if(animationTime >= _animation.duration) {
return false;
}
_animation.apply(animationTime, artboard, .05);
return true;
}
Another thing you could do is to just set the animation to not loop in Flare
Lastly, if you have any other doubts regarding Controllers, you can check out our tutorial here!
from flare-flutter.
Hi @umberto-sonnino, thanks for your help!
Unfortunately it didn't do it for me. I tried using the elapsed time, but the animation always stops a few frames short of finishing. I think it's the mix value that is causing that, but I couldn't find a combination that has a smooth animation and stops on the correct frame.
I also tried counting the frames, but I noticed that it's not always 1:1, because there are a few dropped frames.
Also the animation is already set to not loop in Flare, but I guess that because I'm using a custom controller that has no effect.
What I did for now was using the total elapsed time check, but instead of getting the duration I get the duration * 2. It's not ideal but I guess it's better than using a timer.
from flare-flutter.
The logic above will actually miss the last apply, try something like this instead and use a full mix value. Is there a reason you were using a mix of .05? That will barely mix the animation in.
@override
bool advance(FlutterActorArtboard artboard, double elapsed) {
animationTime += elapsed;
_animation.apply(animationTime, artboard, 1.0);
return animationTime < _animation.duration;
}
from flare-flutter.
@luigi-rosso that seems to work. I have several animations, I tried with the simplest one and it worked. I'll try with the most complex ones, and if it works I'll close the issue.
But now I see that I misunderstood the advance method. On the first code sample I send the widget.progress variable is always the same, so I'm actually always applying the same value. That was kind of trial and error to get it working, that's why I chose the 0.05 mix, but somehow it worked. I wasn't even using the elapsed time, so I guess by applying a very small mix several times it will eventually get to the final value.
I got to this point by basically trying to reverse engineer the examples and many hours of trial and error. Flare is great and so is the Flutter implementation, the only thing that I find lacking is the documentation, especially on custom controllers.
Anyway, thank you both so much for your help so far.
from flare-flutter.
It worked, now I can stop exactly on the correct frame and stop executing after that. I'm closing the issue. Thanks again!
from flare-flutter.
You're right, we definitely need better documentation around how applying and mixing animations works.
And yes, you're right the mix operation is cumulative because every frame it interpolates the current values to the next target ones which you are applying. So by keeping the animation running for a long time, you'll eventually get there (or at least very very close). Think of mix as a way to interpolate your animations. It's really just another layer of interpolation on top of the current (on your actor hierarchy) values and target (computed key values in your animation) values.
from flare-flutter.
Related Issues (20)
- Migrate to null safety HOT 8
- Add debug mode HOT 1
- Migration to Null-Safety HOT 3
- Request for Clarification: Flare-Flutter vs Rive Flutter Runtime Use Cases HOT 4
- LateInitializationError HOT 8
- Null Safety for flare_dart HOT 3
- Placeholder widget while animation is loading
- 3.0.0 antialiasing no longer working HOT 13
- IK Constraints not working HOT 4
- Difference between flare-flutter and rive-flutter HOT 4
- FlutterActorImage not visible FlareActor
- Clear Memory after finish an animation HOT 2
- Can't load FlareActor.bundle on Android HOT 2
- Unhandled Exception: Exception: LateInitializationError: Field '_paint@235459774' has not been initialized HOT 2
- LateInitializationError: Field '_paint@xxxxxx' has not been initialized HOT 2
- LateInitializationError: Field '_setupAABB@43245341' has not been initialized HOT 1
- Flutter 2.10 & 3.0 throw warnings during compilation HOT 3
- Warning: Operand of null-aware operation '?.' has type 'SchedulerBinding' which excludes null. HOT 4
- update HOT 1
- Flutter3 Error HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from flare-flutter.