Android 简单的动画制作

Android 简单的动画制作 工具Android Studio

一、帧动画  

帧动画就是将一帧一帧的图片在人眼分别不出的情况下一张一张的加载出来，因而会形成类似动画的效果。  

步骤： 1.在res文件中的drawable中建立animatio-list  

具体=》右击drawable ->new->drawable resource file 选择animation-list ，然后在你刚刚创建的文件中加入item  

item的属性有 //item android:drawable="@mipmap/anim1" 当前展示的图片  

android:duration="50"></item> 图片展示的时间 好了，帧布局已经创建完成了。  

2.我们需要在layout布局文件中讲我们刚刚创建好的帧布局文件拿来用了。同样需要先创建一个ImageView布局，设置它的背 景background为刚刚创建的帧布局文件  

例如：<ImageView android:id="@+id/iv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/my_frame_animation"/>  

我们还可以创建两个按钮来进行对动画的启动与关闭。  

OK，布局已经搭完了，现在去逻辑代码中将它实现吧。  

3.首先，需要找到ImageView控件 iv ,其次，获取一个AnimationDrawable对象AnimationDrawable animationDrawable = ((AnimationDrawable) iv.getBackground());  

再点击事件中进行对动画的控制， public void MyClick(View view) {  

switch (view.getId()){  

case R.id.btn_start: //判断动画是否开启  

if (!animationDrawable.isRunning()){  

animationDrawable.start();//没有开启则开启动画  

} break;  

case R.id.btn_close:  

if (animationDrawable.isRunning()){  

animationDrawable.stop(); }  

break; }  

}

然后你点击 开启动画按钮就会看到动画的效果咯

还有一种方法就是在逻辑代码中进行 添加 布局什么的只需要建一个和上面呢个一样的layout布局就可以。

在逻辑代码中，找出控件，实例化一个AnimationDrawable对象 AnimationDrawable drawable= new AnimationDrawable(); 下面就是添加图片了，通过drawable来添加 ： drawable.addFrame(getResources().getDrawable(R.mipmap.loading0001),100); 

前面的参数是 图片的id，后面的参数是时间，一张怎么行呢，当然需要粘贴复制咯，后面的点击事件就和上面的一样了。

大致步骤：

/** * 步骤 * 1.在res/drawable获取xml的Frame 动画<animation-list> 

* 2.在xml中 添加item drawable 每一帧的动画的图片 duration 每一帧显示的时间 

* 3.在layout布局中 给ImageView设置成背景图片 

* 4.在逻辑代码中获取AnimationDrawable 对象 管理动画 start（），stop（） */

二、Tween Animation 补间动画 设置开始 和结束的动画 中间部分 由系统补齐。

这个动画主要有alpha（透明度） scale（缩放）rotate（旋转） translate（位移）

【这个是个综合的set（可以是前面四个中的任意组合）】

这个动画也是有两种加载方式 . 

1.xml步骤，首先在res文件中创建一个文件夹anim （类似于我们之前创建的drawable，不过这是一个文件夹，一定要区别开来）

2.在anim文件夹中添加动画  

详细步骤：右击创建的anim文件夹 new 一个Animation resourse file 在弹出框的第二个选项里面可以进行选择，当然你要记得它的首字母，或者中间的，至少要记得一个字母，我们常用的就是上面的几个。

alpha：android:fromAlpha="1.0" 开始的透明度  

android:toAlpha="0.0" 结束的透明度  

android:duration="3000" 展示的时间

scale：android:fromXScale="1" x轴缩放的起始比例  

android:fromYScale="1" y轴缩放的起始比例  

android:toXScale="2" x轴缩放的结束比例  

android:toYScale="2" y轴缩放的结束比例  

android:pivotX="50%" x轴的缩放中心  

android:pivotY="50%" y轴的缩放中心  

android:duration="3000" 展示的时间为三秒  

rotate： android:fromDegrees="0" 起始地位置（角度）  

android:toDegrees="360" 到达的位置（角度）  

android:pivotX="50%p" 旋转的中心（ 带p以父布局为参考物 不带p以自身参考物）  

android:pivotY="50%p" android:duration="3000" 展示的时间 android:interpolator="@android:anim/accelerate_decelerate_interpolator" 速度由快到慢  

 

translate： android:fromXDelta="0"  

android:fromYDelta="0"  

android:toXDelta="200"  

android:toYDelta="200"  

android:duration="3000" 起始位置（from） 到 （to）结束位置

还有一个属性都可以用 fillAfter=“true” 我没记错的话应该是保持改变后的状态，false则是不保存。

set：<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android">  

<rotate android:fromDegrees="0"  

android:toDegrees="720"  

android:pivotX="50%"  

android:pivotY="50%"  

android:duration="3000" ></rotate>  

<translate  

android:fromXDelta="0"  

android:fromYDelta="0"  

android:toXDelta="200"  

android:toYDelta="500"  

android:duration="3000" ></translate> 

<alpha android:fromAlpha="1.0"  

android:toAlpha="0.0"  

android:duration="3000" ></alpha>

</set>  

这个就是集合，将几种状态放在一起然后，在layout布局中添加一个ImageView 布局，暂且叫它 iv 吧，然后我们回到逻 辑代码中，同样找出控件，找出来之后就是设置动画了：iv.setAnimation(AnimationUtils.loadAnimation(参数1,参数2)); 

参数1 上下文，参数2 动画布局的id。Ok，xml的补间动画完成了，下面开始JAVA逻辑代码的添加吧

2.JAVA逻辑代码添加 补间动画 。

首先在layout布局中添加一个ImageView布局，也叫iv，然后回到逻辑代码中，找出控件.同时声明一个Animation对象吧， Animation animation；

现在，进行实例化，animation = new AlphaAnimation(1.0f,0.0f);

(主要参数的设置，可以试试还有什么可以设置的，当然是通过animation来进行设置，比如说： animation.setDuration(3000); animation.setFillAfter(true);)

别的我就不一一列举了，大致说一下 animation = new RotateAnimation(0,720,Animation.RELATIVE_TO_PARENT,0.5f,Animation.RELATIVE_TO_PARENT,0.5f); Animation.RELATIVE_TO_PARENT 以自身为中心  

/*****************************************/  

animation = new ScaleAnimation(0.1f,3f,0.1f,3f,Animation.RELATIVE_TO_PARENT,0.5f,Animation.RELATIVE_TO_PARENT,0.5f); /*****************************************/  

animation = new TranslateAnimation(0,200,0,200);  

animation.setDuration(3000);  

animation.setFillAfter(true);  

animation.setInterpolator(new AccelerateDecelerateInterpolator());//设置插值器 /*****************************************/ 最后还有一个集合：我们需要另外建立一个方法  

例如： private void animationSet() {  

Animation rotate = new RotateAnimation(0,720,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);  

Animation alpha = new AlphaAnimation(1.0f,0.0f);  

/* true 使用的是set默认的插值器 false 使用自身动画的插值器*/  

AnimationSet animationSet = new AnimationSet(false); //添加动画到集合  

animationSet.addAnimation(rotate);  

animationSet.addAnimation(alpha);  

//设置动画时间  

animationSet.setDuration(3000);  

//启动动画  

iv.startAnimation(animationSet); }

Nice，又完成了一部分 ，继续加油哈

三、Property Animation 属性动画 3.0以后才有的 是补间动画的加强版 属性动画指明任何动画 。既然是补间东爱护的加强版自然也是两种加载方式咯1.xml加载布局跟补间动画很类似，只不过创建的文件夹不在是anim了，而是animator（加强版自然要有加强版的不同，名字都变长了~~~） 

<set xmlns:android="http://schemas.android.com/apk/res/android" android:ordering="sequentially"><objectAnimator android:propertyName="scaleY"  

android:valueFrom="1"  

android:valueTo="3"  

android:duration="3000" ></objectAnimator>  

<set android:ordering="together">  

<objectAnimator android:propertyName="translationX"  

android:valueFrom="0"  

android:valueTo="200"  

android:duration="3000"  

></objectAnimator>  

<objectAnimator android:propertyName="translationY"  

android:valueFrom="0"  

android:valueTo="500"  

android:duration="3000"  

></objectAnimator> </set></set>  

android:ordering="sequentially" 按顺序展示  

android:ordering="together" 一起展示  

android:propertyName="translationX" 这个不用多说，看名字就知道了吧，每一个都有特定的名字，不会的话，当然是百度咯，可不能瞎写啊 然后我们就要在逻辑代码中使用动画填充器了，  

Animator animator = AnimatorInflater.loadAnimator(参数1，参数2); 参数1 上下文 参数2 布局文件的ID  

继续，设置操作对象 animator.setTarget（iv） animator.strat(); 

2.JAVA逻辑代码进行动画的添加  

1,创建动画对象

2,设置时间

3,开启动画

简单吧，就这么几步，再来看仔细一点： 

ObjectAnimator alphaAnimator = ObjectAnimator.ofFloat(iv,"alpha",1.0f,0.0f); 

参数1 操作对象，参数2 对应的动画的名字，这个也是特定的，后面的参数就是该动画的一些属性了。 alphaAnimator.setDuration(5000); 这是个例子 其他的自己试试呗 

然后再说一个 集合的问题 

我同时想实现两种动画，那么我就必须实例化一个动画集合对象 AnimatorSet animatorSet = new AnimatorSet();  

然后设置一些我想展示的动画。 

展示的方法 A：animationSet.play().with()、、、、、、 

当然也可以是before(),after()，自由搭配 然后start()这种方法，同一种动画只能执行一次。

B：我们用一个Animator的集合来添加  

//第二种方式

List<Animator> list = new ArrayList<>(); list.add(translateY);list.add(rotateY); 

animatorSet.playTogether(list);//同步执行  

animatorSet.playSequentially(list);//依次执行

animatorSet.start();

好啦。今天就写到这里了