Material Design 学习——动画

(Updated: )
,

1 触摸反馈（波纹效果）

  • 默认状态下，背景正常，波纹有边界

  • 波纹做背景，波纹有边界android:background="?android:attr/selectableItemBackground

  • 波纹做背景，波纹超出边界android:background="?android:attr/selectableItemBackgroundBorderless

  • 波纹颜色android:colorControlHighlight

    2 动画——圆形揭露

    通过ViewAnimationUtils.createCircularReveal方法创建圆形揭露动画

    /**

    • 返回一个执行圆形揭露动画的Animator
    • 1.View的阴影也会执行动画
    • 2.同一时间只有一个非矩形裁剪可以作用于View上
    • 3.View执行动画时的裁剪优先级高于轮廓的裁剪
    • 4.返回的Animtor只可被执行一次，不能重用。一旦开始执行，不能暂停/恢复。
    • @param 执行圆形揭露动画的View
    • @param 动画圆心在X轴上的位置
    • @param 动画圆心在Y轴上的位置
    • @param 起始角度
    • @param 结束角度
    • /
      public static Animator createCircularReveal(View view, 
      int centerX,  int centerY, float startRadius, float endRadius) {
      return new RevealAnimator(view, centerX, centerY, startRadius, endRadius);
      }

实例：

Animator animator = ViewAnimationUtils.createCircularReveal(v, v.getWidth() / 2, v.getHeight() / 2, v.getWidth(), 0);
animator.setInterpolator(new AccelerateDecelerateInterpolator());
animator.setDuration(300);

3 Activity转场动画（Activity Transition）

  • Enter：进入下一个Activity的效果
  • Exit：离开当前Activity的效果

3.1 转场动画

3.1.1 系统提供的转场动画

  • changeBounds - 改变目标视图的布局边界
  • changeClipBounds - 裁剪目标视图边界
  • changeTransform - 改变目标视图的缩放比例和旋转角度
  • changeImageTransform - 改变目标图片的大小和缩放比例

3.1.2 自定义转场动画

style:

<transitionSet xmlns:android="http://schemas.android.com/apk/res/android">

    <explode />

    <changeBounds />

    <changeTransform />

    <changeClipBounds />

    <changeImageTransform />
</transitionSet>

code:

new Transition(){
    @Override
    public void captureStartValues(TransitionValues transitionValues) {

    }

    @Override
    public void captureEndValues(TransitionValues transitionValues) {

    }
};

3.2 设置转场动画

style:

<style name="myTheme" parent="android:Theme.Material">
    <!-- 开启转场动画功能 -->
    <item name="android:windowContentTransitions">true</item>

    <!-- 入场动画 -->
    <item name="android:windowEnterTransition">@transition/explode</item>
    <!-- 出场动画 -->
    <item name="android:windowExitTransition">@transition/explode</item>
    <!-- 共享元素入场动画 -->
    <item name="android:windowSharedElementEnterTransition">@transition/change_image_transform</item>
    <!-- 共享元素出场动画 -->
    <item name="android:windowSharedElementExitTransition">@transition/change_image_transform</item>
</style>

code:

//开启转场动画功能
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
//入场动画
getWindow().setEnterTransition(new Explode().setDuration(1000));
//出场动画
getWindow().setExitTransition(new ChangeBounds().setDuration(300));
//共享元素入场动画
getWindow().setSharedElementEnterTransition(new changeTransform().setDuration(600);
//共享元素出场动画
getWindow().setSharedElementEnterTransition(new changeClipBounds().setDuration(400));

3.3 实现共享元素Transition（Shared Elements Transition）

共享元素可以使两个View在Activity跳转间平滑过渡，只需要两步：

3.2.1 设置相同的TransitionName

style：

android:android:transitionName="sharedElement"

code：

view.setTransitionName("sharedElement");

3.2.2 转场中声明共享元素

Intent intent = new Intent(MainActivity.this, SecondActivity.class);
Bundle bundle = ActivityOptions.makeSceneTransitionAnimation(MainActivity.this, Pair.create(view1, "sharedElement1"), Pair.create(view2, view2.getTransitionName()).toBundle();
startActivity(intent, bundle);