Create a bump effect for a bottom sheet android studio

353 Views Asked by At

having a collapsed bottom sheet I would like this bottom sheet making a little bump effect whenever i want (when I update some data)

What do you think would be the best practice ? Playing with the set bottomsheetpeeklayoutheight attribute ?

I'm using a

private BottomSheetBehavior bottomSheetBehavior;

with a

private NestedScrollView bottomSheetStoreResult;

Anybody that has implemented this in its code ?

thank you all in advance ! :)

1

There are 1 best solutions below

0
On

OLD ANSWER - SEE BELOW

. .

Ok I am doing this with handlers, I know it's not always a great solution to use them, but here it's for a light duty and lasts 1 second.

But It's working like I've being expecting which is the most important !

I still would like to ear from you guys if you have a better solution:

first I used getViewTreeObserver() in onCreate() to get the peekheight of my bottomsheetlayout.

    bottomSheetPeekLayout.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            bottomSheetPeekLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);
            peekHeight = bottomSheetPeekLayout.getHeight();
        }
    });

then, on a network result i just used setPeekHeight, as there is a set animation to true option available :

    final Handler h1 = new Handler();
    h1.postDelayed(new Runnable() {
        @Override
        public void run() {
            h1.removeCallbacksAndMessages(this);
            if (bottomSheetBehavior.getState() == BottomSheetBehavior.STATE_COLLAPSED){
                bottomSheetBehavior.setPeekHeight(peekHeight*3, true);
            final Handler h2 = new Handler();
            h2.postDelayed(new Runnable() {
                @Override
                public void run() {
                    h2.removeCallbacksAndMessages(this);
                    bottomSheetBehavior.setPeekHeight(peekHeight, true);
                }
            }, 400);
        }
        }
    }, 600);

. .

UPDATE

. .

As I though using my own duration was a very bad Idea, I decide to use animate() method. It's more fluid and nicer to see than it was with the above handler answer.

If you would like to use it, make sure your bottom sheet is tall enough to be translated without creating a blank space at the bottom during animation.

use this :

    bottomSheet.animate()
            .translationYBy(-250)
            .setDuration(300)
            .setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    super.onAnimationEnd(animation);
                    bottomSheet.animate()
                            .translationY(0)
                            .setDuration(300);
                }
            });

You can customize delays and it's bit cleaner :) enjoy !