我是 Flutter 设计的新手。所以我有一个关于图标动画的问题。我在带有星号的 flutter 应用程序中创建了 IconButton:
IconButton(color: _isFavourite
? Theme.of(context).primaryColor
: Colors.grey[600],
onPressed: () => changeFavourites(),
icon: Icon(Icons.star)),
当用户点击按钮时,星星会改变颜色。只是改变它,仅此而已。问题是:我能以某种方式使这种不断变化的颜色过渡更有趣吗?喜欢更光滑或类似的东西
也许有一个包可以创建这样的图标动画?
谢谢
最佳答案
虽然这是关于动画Color
,但您可以使用ColorTween
class _ColoAnState extends State<ColoAn> with SingleTickerProviderStateMixin {
late AnimationController controller;
late Animation animation;
@override
void initState() {
super.initState();
controller = AnimationController(
duration: const Duration(milliseconds: 200), //controll animation duration
vsync: this,
)..addListener(() {
setState(() {});
});
animation = ColorTween(
begin: Colors.grey,
end: Colors.red,
).animate(controller);
}
@override
void dispose() {
controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Icon(
Icons.favorite,
color: animation.value,
),
),
floatingActionButton: FloatingActionButton(onPressed: () {
if (controller.value == 1)
controller.reverse();
else
controller.forward();
}),
);
}
}
关于Flutter 图标动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71555004/