
配置vsync,需要实现一下with SingleTickerProviderStateMixin
class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderStateMixin{
late AnimationController _controller;
@override
void initState() {
super.initState();
_controller = AnimationController(
duration: const Duration(milliseconds: 500),
vsync:this,
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('标题'),
),
body: Center(
child: Column(
children: [
AnimatedIcon(icon: AnimatedIcons.menu_close, progress: _controller,size: 40,color: Colors.red,),
ElevatedButton(onPressed: (){
_controller.forward();
}, child: const Text('播放')),
ElevatedButton(onPressed: (){
_controller.reverse();
}, child: const Text('返回')),
],
),
),
);
}
}
add_event
arrow_menu
close_menu
ellipsis_search
event_add
home_menu
list_view
menu_arrow
menu_close
menu_home
pause_play
play_pause
search_ellipsis
view_list
class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderStateMixin{
late AnimationController _controller;
@override
void initState() {
super.initState();
_controller = AnimationController(
duration: const Duration(milliseconds: 1000),
vsync:this,
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('标题'),
),
body: Column(
children: [
Stack(
children: [
ScaleTransition(
scale: _controller.drive(Tween(begin: 1.0,end: 0.0).chain(CurveTween(curve: const Interval(0.0, 0.5)))),
child: Icon(Icons.search,size: 40,),
),
ScaleTransition(
scale: _controller.drive(Tween(begin: 0.0,end: 1.0).chain(CurveTween(curve: Interval(0.5, 1)))),
child: const Icon(Icons.close,size: 40,),
),
],
),
ElevatedButton(onPressed: (){
_controller.forward();
}, child: const Text('播放')),
ElevatedButton(onPressed: (){
_controller.reverse();
}, child: const Text('返回')),
],
),
);
}
}
