我正在尝试实现从 0 到 1 开始,然后在 0.8 和 1 之间交替的缩放动画。我从 https://api.flutter.dev/flutter/widgets/ScaleTransition-class.html 复制了代码并且调整了值,但无法实现我想要的动画。下面的代码从 0.8 开始,动画到 1 并重复。关于如何实现上述动画有什么想法吗?蒂亚
late final AnimationController _controller = AnimationController(
value: 0,
duration: const Duration(seconds: 2),
vsync: this,
)..repeat(min: 0.8, max: 1, reverse: true);
late final Animation<double> _animation = CurvedAnimation(
parent: _controller,
curve: Curves.fastOutSlowIn,
);
@override
void dispose() {
_controller.dispose();
super.dispose();
}
试试这个:
late final AnimationController _controller = AnimationController(
duration: const Duration(seconds: 2),
value: 0,
vsync: this,
)..addStatusListener((status) async {
if (status == AnimationStatus.completed) {
_controller.animateBack(0.5);
_controller.animateTo(1);
_controller.repeat(min: 0.5, max: 1, reverse: true);
}
});
late final Animation<double> _animation = CurvedAnimation(
parent: _controller,
curve: Curves.fastOutSlowIn,
);
完整样本:
class _MainAppState extends State<MainApp> with TickerProviderStateMixin {
late final AnimationController _controller = AnimationController(
duration: const Duration(seconds: 2),
value: 0,
vsync: this,
)..addStatusListener((status) async {
if (status == AnimationStatus.completed) {
_controller.animateBack(0.5);
_controller.animateTo(1);
_controller.repeat(min: 0.5, max: 1, reverse: true);
}
});
late final Animation<double> _animation = CurvedAnimation(
parent: _controller,
curve: Curves.fastOutSlowIn,
);
@override
void initState() {
super.initState();
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: ScaleTransition(
scale: _animation,
child: const Padding(
padding: EdgeInsets.all(8.0),
child: FlutterLogo(size: 150.0),
),
),
),
),
);
}
}