android meterdesign 动画 (二)

Material 新增动画 ：

• Touch feedback（触摸反馈）
• Reveal effect（揭露效果）
• Activity transitions（Activity转换效果）
• Curved motion（曲线运动）
• View state changes （视图状态改变）
• Animate Vector Drawables（可绘矢量动画）

触摸反馈（波纹效果Ripple）

常用效果就是波纹动画，例如点击按钮时会从点击位置产生类似于波纹的扩散效果

 <Button
        android:text="button1"
        android:id="@+id/button1"
        ...
        android:background="@drawable/ripple_bg"
         />

    <Button
        android:text="button2"
        android:id="@+id/button2"
	...
        android:background="?android:attr/selectableItemBackground"
        />

    <Button
        android:text="button3"
        android:id="@+id/button3"
	...
        android:background="?android:attr/selectableItemBackgroundBorderless"
       />

    <Button
        android:text="button4"
        android:id="@+id/button4" 
	.../>

button1:自定义按钮的ripple效果背景色(ripple_bg.xml)

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#FF0000"><!--波纹颜色-->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#00FFFF" /> <!--按键背景色-->
            <corners android:radius="4dp" />
        </shape>
    </item>
</ripple>

button2:    ?android:attr/selectableItemBackground (有界波纹)

button3:    ?android:attr/selectableItemBackgroundBorderless (无界波纹)

你可以给RippleDrawable对象指定一种颜色。要更改默认的触摸反馈颜色，使用主题的android:colorControlHighlight属性。

<span style="font-size:18px;">  <style name="Theme.DesignDemo" parent="Base.Theme.DesignDemo"></style>
  <style name="Base.Theme.DesignDemo" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">#673AB7</item>
        <item name="colorPrimaryDark">#512DA8</item>
        <item name="colorAccent">#FF4081</item>
        <item name="android:colorControlHighlight">#ff00ff</item>
        <item name="android:windowBackground">@color/window_background</item>
    </style></span>

Reveal effect（揭露效果）

使用ViewAnimationUtils.createCircularReveal()方法去创建一个RevealAnimator动画

该方法源码

 public static Animator createCircularReveal(View view,
            int centerX,  int centerY, float startRadius, float endRadius) {
        return new RevealAnimator(view, centerX, centerY, startRadius, endRadius);
    }

这五个参数分别是：
view 操作的视图
centerX 动画开始的中心点X
centerY 动画开始的中心点Y
startRadius 动画开始半径
endRadius 动画结束半径

FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Animator animator;
                if (isFirst) {
                    animator = ViewAnimationUtils.createCircularReveal( //以图片中心为起始点，隐藏imageview
                            imageView,// 操作的视图
                            imageView.getWidth()/2,// 动画开始的中心点X
                            imageView.getHeight()/2,// 动画开始的中心点Y
                            imageView.getWidth(),// 动画开始半径
                            0);// 动画结束半径
                } else { 
                    animator = ViewAnimationUtils.createCircularReveal( //以（0,0）点为起始点，显示imageview
                            imageView,// 操作的视图
                            0,// 动画开始的中心点X
                            0,// 动画开始的中心点Y
                            0,// 动画开始半径
                            (float)Math.hypot(imageView.getWidth(),imageView.getHeight()));// 动画结束半径
                }


                animator.setInterpolator(new AccelerateDecelerateInterpolator());
                animator.setDuration(2000);
                animator.start();
                if (!isFirst) {
                    imageView.setVisibility(View.VISIBLE);
                }
                isFirst=!isFirst;

            }
        });

Activity transitions（Activity过渡效果）

Activity Transition提供了两种Transition类型：
Enter（进入）：进入一个Activity的效果
Exit（退出）：退出一个Activity的效果

而这每种类型又分为普通Transition和共享元素Transition，一个共享元素过渡(动画)决定两个activities之间的过渡，怎么共享(它们)的视图。

普通Transition：
explode：从场景的中心移入或移出
slide：从场景的边缘移入或移出
fade：调整透明度产生渐变效果


Shared Elements Transition 共享元素转换：
它的作用就是共享两个acitivity中共同的元素，在Android 5.0下支持如下效果：
changeBounds -  改变目标视图的布局边界
changeClipBounds - 裁剪目标视图边界
changeTransform - 改变目标视图的缩放比例和旋转角度
changeImageTransform - 改变目标图片的大小和缩放比例

自定义过渡动画

首先，如果要使用transition需要先修改style文件，在继承了material主题的style.xml中添加如下属性：

<style name="myTheme" parent="android:Theme.Material">  
        <!-- 允许使用transitions -->  
        <item name="android:windowContentTransitions">true</item>  
  
        <!-- 指定进入和退出transitions -->  
        <item name="android:windowEnterTransition">@transition/explode</item>  
        <item name="android:windowExitTransition">@transition/explode</item>  
  
        <!-- 指定shared element transitions -->  
        <item name="android:windowSharedElementEnterTransition">  
            @transition/change_image_transform</item>  
        <item name="android:windowSharedElementExitTransition">  
            @transition/change_image_transform</item>  
</style>  

下面再来看看如何定义transition动画：

<transitionSet xmlns:android="http://schemas.android.com/apk/res/android">  
    <explode/>  
    <changeBounds/>  
    <changeTransform/>  
    <changeClipBounds/>  
    <changeImageTransform/>  
</transitionSet>

注：每个transition的xml中定义的就是一组change的元素

在代码中启用transitions：

// inside your activity (if you did not enable transitions in your theme)
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
// set an exit transition
getWindow().setExitTransition(new Explode().setDuration(1000));

在代码中设置transitions的方法还有

• Window.setEnterTransition()：普通transition的进入效果
  Window.setExitTransition()：普通transition的退出效果
  Window.setSharedElementEnterTransition()：共享元素transition的进入效果
  Window.setSharedElementExitTransition()：共享元素transition的退出效果

• 要想尽快进行transitions过渡，可在Activity中调用Window.setAllowEnterTransitionOverlap()
  

注意：该设置一定要在setContentView之前调用

使用过渡启动Activity：

当你已经设置了允许使用Transition并设置了Transition动画，你就可以通过ActivityOptions.makeSceneTransitionAnimation()方法启动一个新的Activity来激活这个Transition：

startActivity(intent,
              ActivityOptions.makeSceneTransitionAnimation(this).toBundle());

当你在另一个Activity中设置了enter transtion，在其启动时，它将被激活。想要disable transitions，那么在启动另一个Activity时：
startActivity(intent,null);  //传递null 的options bundle

启用共享元素Transition：
启动shared element transition和普通的transition稍有不同
在所有需要共享视图的Activity中，使用android:transitionName属性对于需要共享的元素分配一个通用的名字。

Intent intent = new Intent(this, Activity2.class);  
// shareView: 需要共享的视图  
// "shareName": 设置的android:transitionName="shareName"  
ActivityOptions options = ActivityOptions  
        .makeSceneTransitionAnimation(this, shareView, "shareName");  
startActivity(intent, options.toBundle());

如果有多个View需要共享，则通过Pair.create()方法创建多个匹配对然后传入ActivityOptions.makeSceneTransitionAnimation。代码如下：

ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this,  
        Pair.create(view1, "agreedName1"),  
        Pair.create(view2, "agreedName2"));

当需要结束当前Activity并回退这个动画时调用Activity.finishAfterTransition()方法

Curved motion（曲线运动）

Material design中的动画依靠曲线，这个曲线适用于时间插值器和控件运动模式。
PathInterpolator类是一个基于贝塞尔曲线(Bézier curve)或路径(Path)对象上的新的插值器。
在materialdesign规范中，系统提供了三个基本的曲线：
@interpolator/fast_out_linear_in.xml
@interpolator/fast_out_slow_in.xml
@interpolator/linear_out_slow_in.xml
你可以传递一个PathInterpolator对象给Animator.setInterpolator()方法。
ObjectAnimator类有了新的构造方法，使你能够一次能同时使用两个或多个属性去绘制动画的路径。例如，下面的动画使用一个Path对象进行视图X和Y属性的动画绘制：

ObjectAnimator mAnimator;  
mAnimator = ObjectAnimator.ofFloat(view, View.X, View.Y, path);  
...  
mAnimator.start();