Recently I needed a to create an animation to dismiss a banner so that it slides up under the app bar. I was sure that using SlideTransition is going to be the end of it but I was quite surprised that it keeps the original space of the widget as it was at the start of the animation. So I kept looking, trying Transform and FractionalTranslation, couldn’t make neither work. So I looked into the code of something similar from the flutter framework, the ExpansionTile, and that is where I got the inspiration from.

The dismiss up animation that I needed

This is the starting point

I always try my code in a side project when I want to have less distractions.

starting point

Now, with animation

with animation

If you look closer you can see that while visually the widget has been dismissed it is still there in the widget tree after the animation finishes. To achieve that we need an extra step and here to each his own, some people would use setState() I personally prefer having a model and for my widget to listen to it. So I wrap the widget with ValueListenableBuilder and Visibility.

Here is the final result

If you have any suggestions, improvements or if I got something completely wrong, please let me know.