Alec Sibilia
Alec Sibilia

Reputation: 956

Flipping an animation controller view property value in Flutter

I'm trying to flip the progress value of an AnimatedIcon. For example:

icon: AnimatedIcon(
  icon: AnimatedIcons.close_menu,
  progress: _controller.view,
),

Right now the icon animation is backwards for what I need. So when I'm expecting _controller.view to be 0.0 it's actually showing 1.0.

I tried:

progress: _controller.view == 1.0 ? 0.0 : 1.0

but _controller.view is an Animation<double> and not just a <double>.

How can I set progress to a hard coded value?

Upvotes: 2

Views: 946

Answers (2)

Alex.F
Alex.F

Reputation: 6201

I find using ReverseAnimation is more intuitive for me

icon: AnimatedIcon(
  icon: AnimatedIcons.close_menu,
  progress: ReverseAnimation(_controller),
),

Upvotes: 0

Jonah Williams
Jonah Williams

Reputation: 21451

You can use a Tween to create an animation that transforms the controller's range of values [0.0, 1.0] to an inverted range [1.0, 0.0] using Tween.animate. For example,

// create your tween.
final tween = Tween<double>(begin: 1.0, end: 0.0);

// apply it to a controller to create an animation.
final animation<double> = tween.animate(controller);

AnimatedIcon(
  icon: AnimatedIcons.close_menu,
  progress: animation,
); 

Upvotes: 2

Related Questions