How to fade in/out a widget from SliverAppBar while scrolling?

2,165 views
Skip to first unread message

Jorge Andrés Pérez Montás

unread,
Jul 15, 2018, 6:09:32 PM7/15/18
to flutt...@googlegroups.com

I want to 'fade in' and 'fade out' a widget from SliverAppBar when user scrolls on the screen. This is an example of what I want to do (look at the circle avatar fading effect when scrolling):

St0Nq.gif

Here is my code without 'fading':

https://gist.github.com/nesscx/721cd823350848e3d594ba95df68a7fa

So... How can I achieve this effect?


Thanks in advance.

Dennis Riungu

unread,
Jul 16, 2018, 6:45:41 AM7/16/18
to Flutter Dev
Check out this doc: https://flutter.io/cookbook/animation/opacity-animation/

Then try playing with some code I dropped in your gist.

Basically, it uses the AnimatedOpacity opacity property which is managed by the scroll controller of the enclosing CustomScrollView widget.
Reply all
Reply to author
Forward
0 new messages