Android 揭露动画（Reveal Effect）的兼容实现

Reveal Effect

Android 5.0 系统提供了 ViewAnimationUtils#createCircularReveal()API，用于给我们方便的创建揭露动画。但是该 API 只支持 5.0 及以上，那么 5.0 以下该怎么办呢？网上的一些方法，大多都是通过自定义 Shape 然后通过 Scale 动画来做，这并不是一个好的方法，局限性太大。其实官方就提供了一个兼容实现类：CircularRevealCompat，我们完全可以使用它来做兼容。

CircularRevealCompat

CircularRevealCompat类中也有 createCircularReveal()函数，使用方式也都和之前一样。唯一区别在于第一个参数为 CircularRevealWidget接口而不是 View：

public static Animator createCircularReveal(
    CircularRevealWidget view, float centerX, float centerY, float startRadius, float endRadius) {
  ...
}

也就是说，我们必须对实现了 CircularRevealWidget接口的 View 做动画，而没有实现的则不可以。

CircularRevealWidget

官方给常用的 ViewGroup 都实现了该接口，我们可以选择直接对这些 ViewGroup 来实现动画：

如果是直接对像 ImageView 等 View 做动画，就只能使用这些 ViewGroup 再包一层了。或者是自定义 CircularRevealWidget，比如下面这个我自定义的一个 CircularRevealImageView：https://gist.github.com/Airsaid/dbb7d6080d55ad1ce6f67abfe633af1e

代码示例

• 添加 material 库支持

implementation 'com.google.android.material:material:1.1.0-alpha08'

注意：material 库的版本必须为 1.1.0-alpha08 或以上，因为在该版本中 CircularRevealHelper.Delegate 才设置为了 public。这样自定义 CircularRevealWidget就不会报错。

• xml 文件中定义：

• 代码：

private fun startRevealEffectAnimator(view: CircularRevealImageView) {
  val x = view.x
  val y = view.y
  val radius = Math.hypot(view.width.toDouble(), view.height.toDouble()).toFloat()
  val startRadius = 0f
  val endRadius = radius
  val revealAnimator = CircularRevealCompat.createCircularReveal(view, x, y, startRadius, endRadius)
  revealAnimator.interpolator = AnimationUtils.LINEAR_INTERPOLATOR
  revealAnimator.duration = 1000
  revealAnimator.start()
}

总结

对 5.0 以下设备兼容揭露动画， 其实使用官方提供的CircularRevealCompat类就可以了。官方本身对一些常用的 ViewGroup 都提供了支持，可以直接使用这些 ViewGroup。或者如果只是对 View 做动画，而不想使用这些 ViewGroup 再包裹一层，则可以自己通过自定义 CircularRevealWidget来解决。