A FadeTransition widget animates the opacity of its child. This is the perfect animation when you want to show or hide a widget over a specified duration of time.
When using FadeTransition, you need to pass two parameters:
- opacity: This requires an Animation, which controls the transition of the child widget.
- child: The widget that fades in or out with the animation specified in the opacity.
In this recipe, you set the FadeTransition with these instructions:
FadeTransition(
opacity: animation,
child: Container(
width: 200,
height: 200,
color: Colors.purple,
),),
In this case, the child is a Container with a width and height of 200 device-independent pixels and a purple background. Of course, you could specify any other widget instead, including an image or an icon.
Animation widgets require an AnimationController. You set the controller with this instruction:
controller = AnimationController(vsync: this, duration: Duration(seconds: 3));
This specified the...