如何解决在开始另一个动画之前先完成动画-Flutter
我尝试为倒数计时添加预启动,两者的持续时间不同。所以我制作了两个动画A和B, 当我按下开始按钮时,动画A开始播放,当结束时,动画B开始播放。
现在我发生了什么事,因为它们是同时开始的,我尝试了Interval类和Tween类,但没有用。
此刻我的代码如下:
import 'dart:math';
import 'package:Flutter/material.dart';
import 'package:Flutter/services.dart';
class Timer2 extends StatefulWidget {
@override
_Timer2State createState() => _Timer2State();
}
class _Timer2State extends State<Timer2> with TickerProviderStateMixin {
AnimationController animationController;
@override
void initState() {
super.initState();
animationController = AnimationController(vsync: this,duration: Duration(seconds: 10));
}
@override
Widget build(BuildContext context) {
return Scaffold(backgroundColor: Colors.black,body: Padding(
padding: EdgeInsets.all(8.0),child: AnimatedBuilder(
animation: animationController,builder: (context,child){
return Stack(
children: [
Align(
alignment: Alignment.bottomCenter,child: Container(
color: Colors.red,height:
animationController.value * MediaQuery.of(context).size.height,),Column(
children: <Widget>[
Expanded(
child: Align(
alignment: FractionalOffset.center,child: AspectRatio(
aspectRatio: 1.0,child: Stack(
children: <Widget>[
Positioned.fill(
child: AnimatedBuilder(
animation: animationController,builder: (BuildContext context,Widget child) {
return CustomPaint(
painter: TimerPainter(
animation: animationController,backgroundColor: Colors.white,color: Colors.pink),);
},],Container(
margin: EdgeInsets.all(8.0),child: Row(
mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[
FloatingActionButton(
child: AnimatedBuilder(
animation: animationController,builder: (_,Widget child) {
return Icon(
animationController.isAnimating
? Icons.pause
: Icons.play_arrow
);
}),backgroundColor: Colors.pinkAccent,onpressed: () {
if (animationController.isAnimating ) {
animationController.stop();
} else {
animationController.reverse(
from: animationController.value == 0.0
? 1.0
: animationController.value);
};
setState(() {
Icon(animationController.isAnimating
? Icons.play_arrow
: Icons.pause
);
});
},)
],)
],);
},);
}
}
class TimerPainter extends CustomPainter {
final Animation<double> animation;
final Color backgroundColor;
final Color color;
TimerPainter({this.animation,this.backgroundColor,this.color})
: super(repaint: animation);
@override
void paint(Canvas canvas,Size size) {
paint = Paint()
..color = backgroundColor
..strokeWidth = 5.0
..strokeCap = strokeCap.round
..style = PaintingStyle.stroke;
canvas.drawCircle(size.center(Offset.zero),size.width / 2.0,paint);
paint.color = color;
double progress = (1.0 - animation.value) * 2 * 3.14;
canvas.drawArc(Offset.zero & size,3.14 * 1.5,- progress,false,paint);
}
@override
bool shouldRepaint(TimerPainter old) {
return animation.value != old.animation.value ||
color != old.color ||
backgroundColor != old.backgroundColor;
}
}
谢谢
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。