如何将App中的一个View平滑变形为另一个View？

一、平滑变形实现方案 #

1. 模糊过渡+尺寸动画手动实现 #

可以按照「模糊当前视图→同步尺寸过渡→切换视图→清晰目标视图」的流程实现，步骤如下：

• 给当前显示的View添加模糊效果，同时启动尺寸动画，让它逐步过渡到目标View的宽高。模糊可以用BlurMaskFilter实现，尺寸变化通过ValueAnimator控制：

  // 给当前View添加模糊
  val blurFilter = BlurMaskFilter(20f, BlurMaskFilter.Blur.NORMAL)
  currentView.paint.maskFilter = blurFilter
  currentView.invalidate()
  
  // 启动尺寸过渡动画
  val widthAnimator = ValueAnimator.ofInt(currentView.width, targetView.width)
  val heightAnimator = ValueAnimator.ofInt(currentView.height, targetView.height)
  val animatorSet = AnimatorSet()
  animatorSet.playTogether(widthAnimator, heightAnimator)
  animatorSet.duration = 350
  animatorSet.addUpdateListener {
      val params = currentView.layoutParams
      params.width = widthAnimator.animatedValue as Int
      params.height = heightAnimator.animatedValue as Int
      currentView.layoutParams = params
  }
  

• 当动画执行到50%左右时，隐藏当前View、显示目标View，同时给目标View加上初始模糊效果。
• 动画后半段，逐步移除目标View的模糊效果，让它清晰显示，完成过渡。

2. 现成的变形过渡方案 #

• 自定义Android Transition：利用系统的TransitionManager，自定义Transition类，同时处理尺寸变化、模糊切换和内容过渡逻辑，适配系统的过渡框架。
• 矢量图形变形：如果两个View的核心元素是矢量图，可以用Lottie制作预定义的变形动画，切换视图时播放对应的动画文件，视觉连贯性强，适合UI风格统一的场景。

二、其他视图替换解决方案 #

• 淡入淡出过渡：最轻量化的方案，给两个View分别添加透明度动画，一个从1→0淡出，另一个从0→1淡入，同时切换可见性：

  AlphaAnimation fadeOut = new AlphaAnimation(1.0f, 0.0f);
  fadeOut.setDuration(300);
  fadeOut.setFillAfter(true);
  currentView.startAnimation(fadeOut);
  
  AlphaAnimation fadeIn = new AlphaAnimation(0.0f, 1.0f);
  fadeIn.setDuration(300);
  fadeIn.setFillAfter(true);
  targetView.startAnimation(fadeIn);
  
  // 动画结束后切换可见性（避免布局闪烁）
  fadeOut.setAnimationListener(new Animation.AnimationListener() {
      @Override
      public void onAnimationEnd(Animation animation) {
          currentView.setVisibility(View.GONE);
          targetView.setVisibility(View.VISIBLE);
      }
      // 其他回调省略
  });
  

• 滑动过渡：让当前View滑出屏幕（比如向左/向上），目标View从对应方向滑入，用TranslateAnimation实现，适合内容差异稍大的场景，引导用户注意力转移。
• 共享元素过渡：如果两个View存在共同元素（如同一图标、标题文本），使用系统的共享元素过渡，让共同元素平滑移动/缩放，其他元素淡入淡出，视觉连贯性极强。
• ViewStub懒加载：如果两个View不会同时显示，用ViewStub懒加载目标View，减少初始布局加载的内存占用，配合动画切换，性能更优。

内容的提问来源于stack exchange，提问作者user20958695