动画学习笔记
Android的动画可以分为三类,分别是:
View Animation(补间动画)
Drawable Animation(Frame动画)
Property Animation(属性动画)
View Animation(补间动画)
简介
补间动画,可以实现简单的平移,旋转,缩放,透明度改变等动画。
使用
补间动画可以通过XML或Android代码实现,但是建议在XML文件里面实现,然后再代码中使用,优点如下:有很高的可读性和可重用性。
补间动画的四种动画方式分别代表为:
1. AlphaAnimation(渐变透明度动画效果)
2. RotateAnimation(画面转移旋转动画效果)
3. ScaleAnimation(渐变尺寸伸缩动画效果)
4. TranslateAnimation(画面转换位置移动动画效果)
需要了解到,以上所有的动画类都继承了`Animation`这个抽象类,因此他们都继承了这个类里面的方法。而这些方法都是一些基本的设置,比如说设置动画的持续时间,重复次数,重复模式等。具体可查看源码。
### 区别
虽然我们的动画都是继承自这个抽象类并且都拥有一些相同的方法,但是它们还是各不相同的(这句是废话)。接下来我们介绍一下它们的不同之处。
* Alpha属性
`android:fromAlpha` 动画开始的透明度(0.0到1.0,0.0是全透明,1.0是不透明)
`android:toAlpha` 动画结束的透明度,同上
* Rotate属性
android:fromDegrees 旋转开始角度,正代表顺时针度数,负代表逆时针度数
android:toDegrees 旋转结束角度,正代表顺时针度数,负代表逆时针度数
android:pivotX
缩放起点X坐标(数值、百分数、百分数p,譬如50表示以当前View左上角坐标加50px为初始点、50%表示以当前View的左上角加上当前View宽高的50%做为初始点、50%p表示以当前View的左上角加上父控件宽高的50%做为初始点)
`android:pivotY` 缩放起点Y坐标,同上规律
* Scale属性
`android:fromXScale`初始X轴缩放比例,1.0表示无变化
`android:toXScale`结束X轴缩放比例
`android:fromYScale`初始Y轴缩放比例
`android:toYScale`结束Y轴缩放比例
`android:pivotX`缩放起点X轴坐标(数值、百分数、百分数p,譬如50表示以当前View左上角坐标加50px为初始点、50%表示以当前View的左上角加上当前View宽高的50%做为初始点、50%p表示以当前View的左上角加上父控件宽高的50%做为初始点)
`android:pivotY` 缩放起点Y轴坐标,同上规律
* Translate属性
`android:fromXDelta`
起始点X轴坐标(数值、百分数、百分数p,譬如50表示以当前View左上角坐标加50px为初始点、50%表示以当前View的左上角加上当前View宽高的50%做为初始点、50%p表示以当前View的左上角加上父控件宽高的50%做为初始点)
`android:fromYDelta` 起始点Y轴从标,同上规律
`android:toXDelta` 结束点X轴坐标,同上规律
`android:toYDelta` 结束点Y轴坐标,同上规律
如果我们只想要使用其中的一种动画则只需要如下方式定义就可以了(scale)动画示例:
scale_anim.xml
android:duration="300"
android:fromXScale="0.0"
android:fromYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="1.0"
android:toYScale="1.0"/>
而在代码中我们只需要如下方式调用就可以了:
Animation animation = AnimationUtils.loadAnimation(this,
R.anim.scale_anim);
img = (ImageView) findViewById(R.id.image);
img.startAnimation(animation);
如果我们想要使用组合动画的话只需要将它们定义在一个XML文件里面就可以了如下:
android:interpolator="@[package:]anim/interpolator_resource"
android:shareInterpolator=["true" | "false"] >
android:fromAlpha="float"
android:toAlpha="float" />
android:fromXScale="float"
android:toXScale="float"
android:fromYScale="float"
android:toYScale="float"
android:pivotX="float"
android:pivotY="float" />
android:fromXDelta="float"
android:toXDelta="float"
android:fromYDelta="float"
android:toYDelta="float" />
android:fromDegrees="float"
android:toDegrees="float"
android:pivotX="float"
android:pivotY="float" />
...
interpolator (插值器)
通俗的讲就是控制动画的速率。具体的使用很简单就是在xml文件里面加入`android:interpolator="@[package:]anim/interpolator_resource"`属性就可以了。
android提供的默认插值器可以查看sdk源码或者网上搜索一下有很多讲的。
`特别注意` 补间动画执行之后并未改变View的真实布局属性值,这也是它的一个很大的不足。
Drawable Animation(Frame动画)
Frame动画是将图片资源按照一定的时间间隔顺序播放,造成了一种动画的效果。
使用
首先我们需要写出一个定义动画的XML文件,语法如下:
xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot=["true" | "false"] >
android:drawable="@[package:]drawable/drawable_resource_name"
android:duration="integer" />
这里介绍下几个关键属性:
* Android:oneshot: 如果定义为true的话,此动画只会执行一次,如果为false则一直循环。
* android:duration 表示动画持续时间间隔
我们新建动画XML代码如下:
frame.xml
xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
在代码中如下使用:
public class MainActivity extends AppCompatActivity {
private ImageView image;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_activity);
image = (ImageView) findViewById(R.id.image);
image.setImageResource(R.drawable.frame);
AnimationDrawable anim = (AnimationDrawable) image.getDrawable();
anim.start();
}
}
Property Animation(属性动画)
简介
Android 3.0以后引入了属性动画,属性动画可以很轻松的实现许多View动画做不到的事而属性动画就可以的。
使用
先来看看具体的使用方式:
ObjectAnimator anim2 = ObjectAnimator.ofFloat(butt, "scaleY",1.0f,
0.5f);
就这么一句话就可以实现实现一个动画,很简单,那除了scaleY还有什么呢,如下:
* translationX,translationY:控制View的位置,值是相对于View容器左上角坐标的偏移。
* rotationX,rotationY:控制相对于轴心旋转。
* x,y:控制View在容器中的位置,即左上角坐标加上translationX和translationY的值。
* alpha:控制View对象的alpha透明度值。
### 组合动画实现方式
1. 这是几个常用的,那有没有可能我们自己实现一个动画呢,当然了,我们可以填入一个不存在的如下:`ObjectAnimator anim2 =
ObjectAnimator.ofFloat(butt, "test",1.0f, 0.5f);`接下来我们只需要实现以下代码就可以了
anim.addUpdateListener(new AnimatorUpdateListener()
{
@Override
public void onAnimationUpdate(ValueAnimator animation)
{
//可以在这里修改属性
//view.setXXX(value);
//view.setXXX(value);
//butt.setScaleX(value);
//butt.setScaleY(value);
}
});
2. 这样我们就可以实现自己的动画了,当然我们也可以如下实现:
ObjectAnimator alphaAnim = ObjectAnimator.ofFloat(myView, "alpha", 1.0f,
0.5f, 0.7f, 1.0f);
ObjectAnimator scaleXAnim = ObjectAnimator.ofFloat(myView, "scaleX", 0.0f,
1.0f);
ObjectAnimator scaleYAnim = ObjectAnimator.ofFloat(myView, "scaleY", 0.0f,
2.0f);
ObjectAnimator rotateAnim = ObjectAnimator.ofFloat(myView, "rotation", 0,
360);
ObjectAnimator transXAnim = ObjectAnimator.ofFloat(myView, "translationX",
100, 400);
ObjectAnimator transYAnim = ObjectAnimator.ofFloat(myView, "tranlsationY",
100, 750);
AnimatorSet set = new AnimatorSet();
set.playTogether(alphaAnim, scaleXAnim, scaleYAnim, rotateAnim, transXAnim,
transYAnim);
set.setDuration(300);
set.start();
但是这样的话还是要看实际的效果,如果动画效果生硬的话,那么还是建议自己实现,方法上面已经给出了。
3. 其次组合动画还可以使用PropertyValuesHolder来实现。
PropertyValuesHolder alpha = PropertyValuesHolder.ofFloat("alpha", 0.0f,
1.0f);
PropertyValuesHolder scaleX = PropertyValuesHolder.ofFloat("scaleX", 1.0f,
0.0f);
ObjectAnimator animator1 = ObjectAnimator.ofPropertyValuesHolder(image,
alpha, scaleX);
animator1.setDuration(1000);
animator1.start();
好了,先写到这里,接下来的一篇会介绍属性动画的原理,源码,以及在自定义View中该如何使用属性动画来实现一些酷炫的效果等。