0

I need some help with my toolbar.

Right now I use a collapsing toolbar with image which collapses when I scroll up. I know I can use contentScrim to make the Toolbar transparent and therefore see the image as "toolbar background".

However, I want the image to blur(/fade) when the toolbar is collapsed.

Any suggestions how to achieve this?

Jason Aller
  • 3,541
  • 28
  • 38
  • 38
Rantir
  • 111
  • 1
  • 1
  • 11

1 Answers1

2

You can use this library. (RealTimeBlurView)
For the blur effect, just put the imageview behind the blurview. To achieve what you want just change blurview's alpha when the app bar is scrolled.

appbar.addOnOffsetChangedListener(new OnOffsetChangedListener() {
    @Override
    public void onOffsetChanged(final AppBarLayout appBarLayout, final int verticalOffset) {
        float offsetAlpha = (appBarLayout.getY() / appbar.getTotalScrollRange());
        blurView.setAlpha( 1 - (offsetAlpha * -1));
    }
});

UPDATE

FastBlur
Here's another benchmarking project to showcase all the possible blurring methods in android.
Just get the fastest algorithm from the demo and use it in your project.

Hope this helps!

Rami Jemli
  • 2,550
  • 18
  • 31
  • Thank you, but did you know any pure java solution? I just need the blur effect when the Toolbar is completly collapsed – Rantir Jul 07 '17 at 23:03
  • Thank you again! i've got a typo :/ I meant pure Android/Google lib iam not such a fan of third party lib. Would nice if you could provide another example anyway you deserved that answer accepted ! – Rantir Jul 08 '17 at 15:23
  • That's not a library. FastBlur is pure java class. Just put it in your project and pass the right parameters. – Rami Jemli Jul 08 '17 at 15:32
  • I added other blurring solutions, you can check. – Rami Jemli Jul 08 '17 at 15:38