CODEWITHSUNDEEP
dartflutter
bnayagrawal
bnayagrawal

Reputation: 1154

Animate the color change when button is enabled or disabled

I have a button whose color is Blue when enabled and black when disabled. What I want is, when I enable the button the color should gradually change from black to blue and not in an instant and vice versa. How can I do that?

Upvotes: 5

Views: 889

Answers (1)

Filled Stacks
Filled Stacks

Reputation: 4346

Use the AnimatedContainer, you build it once with a particular attribute when it's rebuilt with a different value using something like setState then it animates that colour. Or if the value is passed from the outside.

class AnimatedButton extends StatelessWidget {
 final Color widgetColor;

 AnimatedButton({this.widgetColor});

 build(){
  return AnimatedContainer(
   color: widgetColor,
   duration: Duration(seconds: 2),
   child: Text('Some text')
 );
}

You change _passedInColorValue either in setState or by passing in a different value from the parent on a rebuild and the container will perform the animation for you.

Upvotes: 4

Related Questions