android - Circular Reveal Android Compat With Design Library 28

Question

如何使用设计库版本 28 在 Android 中创建圆形显示动画

我看到很少有类(class)有像这样的项目:

android.support.design.circularreveal.CircularRevealFrameLayout
android.support.design.circularreveal.CircularRevealGridLayout
android.support.design.circularreveal.CircularRevealLinearLayout
android.support.design.circularreveal.CircularRevealRelativeLayout
android.support.design.circularreveal.cardview.CircularRevealCardView
android.support.design.circularreveal.coordinatorlayout.CircularRevealCoordinatorLayout

但是我没有找到任何教程

请给我一些方法来使用设计库实现这个漂亮的动画

Answer 1

以下是使用支持库 28.0.0 版或新的 AndroidX 库的方法:

private <T extends View & CircularRevealWidget> void circularRevealFromMiddle(@NonNull final T circularRevealWidget) {
    circularRevealWidget.post(new Runnable() {
        @Override
        public void run() {
            int viewWidth = circularRevealWidget.getWidth();
            int viewHeight = circularRevealWidget.getHeight();

            int viewDiagonal = (int) Math.sqrt(viewWidth * viewWidth + viewHeight * viewHeight);

            final AnimatorSet animatorSet = new AnimatorSet();
            animatorSet.playTogether(
                    CircularRevealCompat.createCircularReveal(circularRevealWidget, viewWidth / 2, viewHeight / 2, 10, viewDiagonal / 2),
                    ObjectAnimator.ofArgb(circularRevealWidget, CircularRevealWidget.CircularRevealScrimColorProperty.CIRCULAR_REVEAL_SCRIM_COLOR, Color.RED, Color.TRANSPARENT));

            animatorSet.setDuration(5000);
            animatorSet.start();
        }
    });
}

根据您的使用方式，可能不需要发布 runnable，但它有助于解决 2 个潜在问题:

• View 需要在调用 CircularRevealCompat.createCircularReveal 时附加到窗口
• 我的示例代码计算 View 的中间部分，这需要 View 的宽度和高度，并且帖子始终在 View 的 onLayout 之后运行，因此这些将始终以这种方式可用。

知道显示从View的中间开始，我们也知道当显示圆的半径等于View对角线的一半时，View将完全显示。

CircularRevealCompat.createCircularReveal 返回一个 Animator，类似于旧方法 (ViewAnimationUtils.createCircularReveal)。

默认情况下，揭示动画中没有稀松布颜色。如果您想在显示 View 时为稀松布颜色设置动画，则需要特殊属性 CircularRevealWidget.CircularRevealScrimColorProperty.CIRCULAR_REVEAL_SCRIM_COLOR

的 ObjectAnimator

您也可以通过交换 startRadius 和 endRadius(以及稀松布的开始和结束颜色)轻松创建反向动画。