Question

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

我看到了几门他们有这样的话：

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();
        }
    });
}

根据您的使用方式，可能不需要发布可运行对象，但这有助于解决两个潜在问题：

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

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

CircularRevealCompat.createCircularReveal返回一个Animator，类似于原来的方法（ViewAnimationUtils.createCircularReveal）。

默认情况下，显示动画上没有稀松布颜色。如果要在显示视图时设置稀松布的颜色动画，则需要具有特殊属性ObjectAnimator

的CircularRevealWidget.CircularRevealScrimColorProperty.CIRCULAR_REVEAL_SCRIM_COLOR

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

Answer 2

我不熟悉这些视图，但是创建圆形显示的方法如下：

val view= ... //Get your view
val cx = view.width / 2
val cy = view.height / 2
val finalRadius = Math.hypot(cx, cy)
val anim = ViewAnimationUtils.createCircularReveal(view, cx, cy, 0, finalRadius) //this is the important one here
anim.start()

通函显示Android与设计库兼容28

2 个答案: