add circular reveal animation to BottomSheet

Question

I am using bottomsheet in my android app. How can I add circular reveal animation for loading bottomsheet? createCircularReveal is an android sdk function that supports all devices with api levels upper than 21.

Answer 1

Simple logic to convert your regular slide up animation to slide up animation on Above 21 APIs :

1) Make reveal animation code for view.

2) Get your dialog's parent view and change its background to transparent before .show() method

((View) bsdCreateNewBinding.getRoot().getParent()).setBackgroundColor(Color.TRANSPARENT);

3) Apply reveal animation in this method :

bottomSheetDialog.setOnShowListener(new DialogInterface.OnShowListener() {
            @Override
            public void onShow(DialogInterface dialog) {
                revealShow(bsdCreateNewBinding.getRoot(), true, null);
            }
        });

Here is the reveal animation code :

private void revealShow(View dialogView, boolean b, final BottomSheetDialog dialog) {

        final View view = dialogView.findViewById(R.id.dialog);

        int w = view.getWidth();
        int h = view.getHeight();

        int endRadius = (int) Math.hypot(w, h);

        int cx = (int) (binding.btnAdd.getX() + (binding.btnAdd.getWidth() / 2));
        int cy = (int) (binding.btnAdd.getY()) + binding.btnAdd.getHeight() + 56;


        if (b) {

            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                Animator revealAnimator = ViewAnimationUtils.createCircularReveal(view, cx, cy, 0, endRadius);
                view.setVisibility(View.VISIBLE);
                revealAnimator.setDuration(700);
                revealAnimator.start();
            } else {
                view.setVisibility(View.VISIBLE);
            }
        } else {

            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                Animator anim =
                        ViewAnimationUtils.createCircularReveal(view, cx, cy, endRadius, 0);

                anim.addListener(new AnimatorListenerAdapter() {
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        super.onAnimationEnd(animation);
                        dialog.dismiss();
                        view.setVisibility(View.INVISIBLE);

                    }
                });
                anim.setDuration(700);
                anim.start();
            } else {
                dialog.dismiss();
                view.setVisibility(View.INVISIBLE);
            }

        }

    }

P.S : Below and Above Lolipop case handled.

Here is the perfect example for Dialog or BottomSheetDialog with Reveal Animation : https://android.jlelse.eu/custom-dialog-with-circular-reveal-animation-ef7dc77ba1e