Как достичь следующей анимации в дизайне материалов Android?

введите описание изображения здесь

Хотелось бы добиться этой анимации в android.Appreciate любая помощь.

Ответы

Ответ 1

Я не тестировал это, но он должен работать.

Добавьте эту зависимость в файлы приложений gradle: compile 'com.github.ozodrukh:CircularReveal:1.1.1'

Объявите эти переменные в начале вашей деятельности:

LinearLayout mRevealView;
boolean hidden = true;

Добавьте это в свой метод onCreate:

mRevealView = (LinearLayout) findViewById(R.id.reveal_items);
mRevealView.setVisibility(View.INVISIBLE);

В вашем методе FAB onClick добавьте следующее:

int cx = (mRevealView.getLeft() + mRevealView.getRight());
        int cy = mRevealView.getTop();
        int radius = Math.max(mRevealView.getWidth(), mRevealView.getHeight());

        //Below Android LOLIPOP Version
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
            SupportAnimator animator =
                    ViewAnimationUtils.createCircularReveal(mRevealView, cx, cy, 0, radius);
            animator.setInterpolator(new AccelerateDecelerateInterpolator());
            animator.setDuration(700);

            SupportAnimator animator_reverse = animator.reverse();

            if (hidden) {
                mRevealView.setVisibility(View.VISIBLE);
                animator.start();
                hidden = false;
            } else {
                animator_reverse.addListener(new SupportAnimator.AnimatorListener() {
                    @Override
                    public void onAnimationStart() {

                    }

                    @Override
                    public void onAnimationEnd() {
                        mRevealView.setVisibility(View.INVISIBLE);
                        hidden = true;

                    }

                    @Override
                    public void onAnimationCancel() {

                    }

                    @Override
                    public void onAnimationRepeat() {

                    }
                });
                animator_reverse.start();
            }
        }
        // Android LOLIPOP And ABOVE Version
        else {
            if (hidden) {
                Animator anim = android.view.ViewAnimationUtils.
                        createCircularReveal(mRevealView, cx, cy, 0, radius);
                mRevealView.setVisibility(View.VISIBLE);
                anim.start();
                hidden = false;
            } else {
                Animator anim = android.view.ViewAnimationUtils.
                        createCircularReveal(mRevealView, cx, cy, radius, 0);
                anim.addListener(new AnimatorListenerAdapter() {
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        super.onAnimationEnd(animation);
                        mRevealView.setVisibility(View.INVISIBLE);
                        hidden = true;
                    }
                });
                anim.start();
            }
        }

Добавьте этот метод в свою деятельность:

private void hideRevealView() {
    if (mRevealView.getVisibility() == View.VISIBLE) {
        mRevealView.setVisibility(View.INVISIBLE);
        hidden = true;
    }
}

Создайте новую раскладку xml для раскрытия, назовите ее opens_layout.xml и добавьте следующее:

<io.codetail.widget.RevealFrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="?attr/actionBarSize">

    //You can include whatever layout you want here
    <include layout="@layout/layout_you_want_to_show" />

</io.codetail.widget.RevealFrameLayout>

Чтобы это сработало, необходимо добавить это в конец макета вашей деятельности:

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <include layout="@layout/reveal_layout" />

</FrameLayout>

Надеюсь, что это поможет.