Make Your Own Animation Curve in Flutter

  Рет қаралды 13,832

Fun with Flutter

Fun with Flutter

4 жыл бұрын

In this video we make use of the Curves class to create our own custom Sine and Spring Curve in Flutter. Create any animation you can image by first creating a unique curve.
Take a look at my "Mastering Animation in Flutter Course":
fun-with-flutter.teachable.co...
Written article: www.funwithflutter.dev/creati...
Find the code here:
dartpad.dev/a3c7d5b24443efdf2...
Desmos Calculator:
www.desmos.com/calculator

Пікірлер: 8
@namastecodingofficial
@namastecodingofficial 4 жыл бұрын
That's amazing. Took me back to high school days haha. Keep Grinding, you''l be big if you make videos like these! :)
@bloodtusk7160
@bloodtusk7160 5 ай бұрын
Hello, wonderful guide, please tell me where I can get the full code from video?
@danielvalencia3437
@danielvalencia3437 2 жыл бұрын
Hi friend, great explanation, one question, where did you get the spring formula, i thought you would use the second order system equation.
@BreegBenjamin
@BreegBenjamin 3 жыл бұрын
perdí mi cabeza.
@Salehalanazi-7
@Salehalanazi-7 4 жыл бұрын
Isn't better to not make it cross the new starting positive point aka 0.5 and just use absolute value on the whole function instead of adding 0.5?
@FunwithFlutter
@FunwithFlutter 4 жыл бұрын
First off, thanks for the engagement. I see you left a comment on one of the other videos as well. Using the absolute won't work for a smooth motion. At the point where it would normally cross the y-axis at 0 it will instead make a triangle back up. I didn't actually graph this, I'm just seeing it in my head (so maybe I'm completely wrong). And yeah it would be preferable to have the animation start at (0,0), but depending on when you do the animation it might not be a problem. If it starts as soon as the widget is built (for example from initState) then the first build will just be at a value that is not 0, which is fine if you want to create a looping animation. Alternatively if you want a smooth start you can just set the initial value (of the widget you're animating) to whatever the CurvedTween (with the Sine curve applied) would be at a time value of 0. Hope this makes sense.
@williamsalazar2624
@williamsalazar2624 4 жыл бұрын
How can I pay with PayPal?
@FunwithFlutter
@FunwithFlutter 4 жыл бұрын
Hey, you'll see the option at checkout. The default is Visa, but it's a drop-down button that you can toggle to then select PayPal. Cheers
Improve your Flutter Apps performance with a RepaintBoundary
31:31
Fun with Flutter
Рет қаралды 14 М.
Red❤️+Green💚=
00:38
ISSEI / いっせい
Рет қаралды 89 МЛН
Я обещал подарить ему самокат!
01:00
Vlad Samokatchik
Рет қаралды 9 МЛН
UNO!
00:18
БРУНО
Рет қаралды 2,3 МЛН
Exploring Riverpod and building a Todo App | Flutter
55:57
Fun with Flutter
Рет қаралды 24 М.
Complex Animations in Flutter using Rive | Flare
15:44
FilledStacks
Рет қаралды 224 М.
Build a Real-time Flutter Chat Application using Stream
1:08:46
Fun with Flutter
Рет қаралды 98 М.
Flutter ClipPath (Bezier Curves)
2:00
HeyFlutter․com
Рет қаралды 43 М.
Flutter Bezier Curves
3:47
Flutter Mapp
Рет қаралды 59 М.
Implementing complex UI with Flutter - Marcin Szałek | Flutter Europe
44:26
Flare and Flutter Quick Start
3:12
Fun with Flutter
Рет қаралды 33 М.
Flutter Bezier Curve Shape with ClipPath CustomClipper Widget
7:49
Proto Coders Point
Рет қаралды 3,1 М.