我有星星png图像,我需要使用Flutter AnimationController和Transformer旋转星星。我找不到图像旋转动画的任何文档或示例。
任何想法如何使用Flutter AnimationController和Transform旋转图像?
更新:
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin { AnimationController animationController; @override void initState() { super.initState(); animationController = new AnimationController( vsync: this, duration: new Duration(milliseconds: 5000), ); animationController.forward(); animationController.addListener(() { setState(() { if (animationController.status == AnimationStatus.completed) { animationController.repeat(); } }); }); } @override Widget build(BuildContext context) { return new Container( alignment: Alignment.center, color: Colors.white, child: new AnimatedBuilder( animation: animationController, child: new Container( height: 80.0, width: 80.0, child: new Image.asset('images/StarLogo.png'), ), builder: (BuildContext context, Widget _widget) { return new Transform.rotate( angle: animationController.value, child: _widget, ); }, ), ); } }
这是我旋转图像的示例。我不知道-但也许适合您
AnimationController rotationController; @override void initState() { rotationController = AnimationController(duration: const Duration(milliseconds: 500), vsync: this); super.initState(); } //... RotationTransition( turns: Tween(begin: 0.0, end: 1.0).animate(rotationController), child: ImgButton(...) //... rotationController.forward(from: 0.0); // it starts the animation
UPD-如何解决问题Transform.rotate
Transform.rotate
在您的情况下,所有功能均与您编写的完全一样- 它将图像从0.0旋转到1.0(这是的默认参数AnimationController)。对于完整的圆,您必须将上参数设置为2 * pi(来自math程序包)
AnimationController
pi
math
import 'dart:math'; //... animationController = AnimationController(vsync: this, duration: Duration(seconds: 5), upperBound: pi * 2);