How to play animation with Provider in flutter?
If you want to create AnimationController in the StatelessWidget you must pass TickerProviderStateMixin in the Constructor of your StatelessWidget, look at my sample code :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | import 'package:flutter/material.dart'; main() { runApp(TestyApp()); } class TestyApp extends StatefulWidget { @override _TestyAppState createState() => _TestyAppState(); } class _TestyAppState extends State<TestyApp> with TickerProviderStateMixin { @override Widget build(BuildContext context) { return MaterialApp( home: TestAnimationInStatelessWidget( tickerProviderStateMixin: this, ), ); } } class TestAnimationInStatelessWidget extends StatelessWidget { final TickerProviderStateMixin tickerProviderStateMixin; const TestAnimationInStatelessWidget( {Key key, @required this.tickerProviderStateMixin}) : assert(tickerProviderStateMixin != null), super(key: key); @override Widget build(BuildContext context) { var _animationController = AnimationController( vsync: tickerProviderStateMixin, duration: Duration(seconds: 1)); var _animation = Tween<double>(begin: 0, end: 2).animate(CurvedAnimation( parent: _animationController, curve: Curves.easeInOut)); return Scaffold( body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ RotationTransition( turns: _animation, child: Container( width: 200, height: 200, decoration: BoxDecoration( color: Colors.blueGrey, borderRadius: BorderRadius.all(Radius.circular(15)), ), ), ), SizedBox( height: 30, ), RaisedButton( onPressed: () { _animationController.reset(); _animationController.forward(); }, child: Text("Start Animation"), ) ], ), ), ); } } |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.
