Android动画进阶—使用开源动画库nineoldandroids
前言
Android系统支持原生动画，这为应用开发者开发绚丽的界面提供了极大的方便，有时候动画是很必要的，当你想作一个滑动的特效的时候，若是苦思冥想都搞不定，那么你能够考虑下动画，说不定动画轻易就搞定了。下面再简单回顾下Android中的动画，本文后面会介绍一个稍微复杂点的动画，先上效果图html
动画分类
View动画：也叫渐变更画，针对View的动画，主要支持平移、旋转、缩放、透明度java
Drawable动画：也叫帧动画，主要是设置View的背景，能够以动画的形式为View设置多张背景android
对象属性动画（Android3.0新加入）：能够对对象的属性进行动画而不只仅是View，动画默认时间间隔300ms，默认帧率10ms/帧。其能够达到的效果是：在一个时间间隔内完成对象从一个属性值到另外一个属性值的改变，所以，属性动画几乎是无所不能的，只要对象有这个属性，它都能实现动画效果，可是属性动画从Android3.0才有，这就严重制约了属性动画的使用，这就是开源动画库nineoldandroids的做用，采用nineoldandroids，能够在3.0之前的系统上使用属性动画，nineoldandroids的网址是：http://nineoldandroids.com。说到属性动画，就不得不提到插值器（TimeInterpolator）和估值算法（TypeEvaluator），下面介绍。算法
TimeInterpolator和TypeEvaluator
TimeInterpolator中文翻译为时间插值器，它的做用是根据时间流逝的百分比来计算出当前属性值改变的百分比，系统预置的有LinearInterpolator（线性插值器：匀速动画）、AccelerateDecelerateInterpolator（加速减速插值器：动画两头慢中间快）和DecelerateInterpolator（减速插值器：动画愈来愈慢）等；TypeEvaluator的中文翻译为类型估值算法，它的做用是根据当前属性改变的百分比来计算改变后的属性值，系统预置的有IntEvaluator（针对整型属性）、FloatEvaluator（针对浮点型属性）和ArgbEvaluator（针对Color属性）。可能这么说还有点晦涩，不要紧，下面给出一个实例就很好理解了。
看上述动画，很显然上述动画是一个匀速动画，其采用了线性插值器和整型估值算法，在40ms内，View的x属性实现从0到40的变换，因为动画的默认刷新率为10ms/帧，因此该动画将分5帧进行，咱们来考虑第三帧（x=20 t=20ms），当时间t=20ms的时候，时间流逝的百分比是0.5 (20/40=0.5)，意味这如今时间过了一半，那x应该改变多少呢，这个就由插值器和估值算法来肯定。拿线性插值器来讲，当时间流逝一半的时候，x的变换也应该是一半，即x的改变是0.5，为何呢？由于它是线性插值器，是实现匀速动画的，下面看它的源码：ide
public class LinearInterpolator implements Interpolator {
public LinearInterpolator() {
}
public LinearInterpolator(Context context, AttributeSet attrs) {
}
public float getInterpolation(float input) {
return input;
}
}
很显然，线性插值器的返回值和输入值同样，所以插值器返回的值是0.5，这意味着x的改变是0.5，这个时候插值器的工做就完成了。布局
具体x变成了什么值，这个须要估值算法来肯定，咱们来看看整型估值算法的源码：动画
public class IntEvaluator implements TypeEvaluator<Integer> {
public Integer evaluate(float fraction, Integer startValue, Integer endValue) {
int startInt = startValue;
return (int)(startInt + fraction * (endValue - startInt));
}
}
上述算法很简单，evaluate的三个参数分别表示：估值小数、开始值和结束值，对应于咱们的例子就分别是：0.5，0，40。根据上述算法，整型估值返回给咱们的结果是20，这就是（x=20 t=20ms）的由来。ui
说明：属性动画要求该属性有set方法和get方法（可选）；插值器和估值算法除了系统提供的外，咱们还能够自定义，实现方式也很简单，由于插值器和估值算法都是一个接口，且内部都只有一个方法，咱们只要派生一个类实现接口就能够了，而后你就能够作出千奇百怪的动画效果。具体一点就是：自定义插值器须要实现Interpolator或者TimeInterpolator，自定义估值算法须要实现TypeEvaluator。还有就是若是你对其余类型（非int、float、color）作动画，你必需要自定义类型估值算法。this
nineoldandroids介绍
其功能和android.animation.*中的类的功能彻底一致，使用方法彻底同样，只要咱们用nineoldandroids来编写动画，就能够在全部的Android系统上运行。比较经常使用的几个动画类是：ValueAnimator、ObjectAnimator和AnimatorSet，其中ObjectAnimator继承自ValueAnimator，AnimatorSet是动画集，能够定义一组动画。使用起来也是及其简单的，下面举几个小栗子。lua
栗子1：改变一个对象（myObject）的 translationY属性，让其沿着Y轴向上平移一段距离：它的高度，该动画在默认时间内完成，动画的完成时间是能够定义的，想要更灵活的效果咱们还能够定义插值器和估值算法，可是通常来讲咱们不须要自定义，系统已经预置了一些，可以知足经常使用的动画。
ObjectAnimator.ofFloat(myObject, "translationY", -myObject.getHeight()).start();
栗子2：改变一个对象的背景色属性，典型的情形是改变View的背景色，下面的动画可让背景色在3秒内实现从0xFFFF8080到0xFF8080FF的渐变，而且动画会无限循环并且会有反转的效果
ValueAnimator colorAnim = ObjectAnimator.ofInt(this, "backgroundColor", /*Red*/0xFFFF8080, /*Blue*/0xFF8080FF); colorAnim.setDuration(3000); colorAnim.setEvaluator(new ArgbEvaluator()); colorAnim.setRepeatCount(ValueAnimator.INFINITE); colorAnim.setRepeatMode(ValueAnimator.REVERSE); colorAnim.start();
栗子3：动画集合，5秒内对View的旋转、平移、缩放和透明度都进行了改变
AnimatorSet set = new AnimatorSet();
set.playTogether(
ObjectAnimator.ofFloat(myView, "rotationX", 0, 360),
ObjectAnimator.ofFloat(myView, "rotationY", 0, 180),
ObjectAnimator.ofFloat(myView, "rotation", 0, -90),
ObjectAnimator.ofFloat(myView, "translationX", 0, 90),
ObjectAnimator.ofFloat(myView, "translationY", 0, 90),
ObjectAnimator.ofFloat(myView, "scaleX", 1, 1.5f),
ObjectAnimator.ofFloat(myView, "scaleY", 1, 0.5f),
ObjectAnimator.ofFloat(myView, "alpha", 1, 0.25f, 1)
);
set.setDuration(5 * 1000).start();
栗子4：下面是个简单的调用方式，其animate方法是nineoldandroids特有的
Button myButton = (Button)findViewById(R.id.myButton); //Note: in order to use the ViewPropertyAnimator like this add the following import: // import static com.nineoldandroids.view.ViewPropertyAnimator.animate; animate(myButton).setDuration(2000).rotationYBy(720).x(100).y(100);
栗子5：一个采用nineoldandroids实现的稍微复杂点的动画
布局xml以下：
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="@+id/menu"
style="@style/MenuStyle"
android:background="@drawable/menu" />
<Button
android:id="@+id/item1"
style="@style/MenuItemStyle"
android:background="@drawable/circle1"
android:visibility="gone" />
<Button
android:id="@+id/item2"
style="@style/MenuItemStyle"
android:background="@drawable/circle2"
android:visibility="gone" />
<Button
android:id="@+id/item3"
style="@style/MenuItemStyle"
android:background="@drawable/circle3"
android:visibility="gone" />
<Button
android:id="@+id/item4"
style="@style/MenuItemStyle"
android:background="@drawable/circle4"
android:visibility="gone" />
<Button
android:id="@+id/item5"
style="@style/MenuItemStyle"
android:background="@drawable/circle5"
android:visibility="gone" />
</FrameLayout>
代码以下：
public class MainActivity extends Activity implements OnClickListener {
private static final String TAG = "MainActivity";
private Button mMenuButton;
private Button mItemButton1;
private Button mItemButton2;
private Button mItemButton3;
private Button mItemButton4;
private Button mItemButton5;
private boolean mIsMenuOpen = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
@TargetApi(Build.VERSION_CODES.HONEYCOMB)
private void initView() {
mMenuButton = (Button) findViewById(R.id.menu);
mMenuButton.setOnClickListener(this);
mItemButton1 = (Button) findViewById(R.id.item1);
mItemButton1.setOnClickListener(this);
mItemButton2 = (Button) findViewById(R.id.item2);
mItemButton2.setOnClickListener(this);
mItemButton3 = (Button) findViewById(R.id.item3);
mItemButton3.setOnClickListener(this);
mItemButton4 = (Button) findViewById(R.id.item4);
mItemButton4.setOnClickListener(this);
mItemButton5 = (Button) findViewById(R.id.item5);
mItemButton5.setOnClickListener(this);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
mMenuButton.performClick();
getMenuInflater().inflate(R.menu.main, menu);
return false;
}
@Override
public void onClick(View v) {
if (v == mMenuButton) {
if (!mIsMenuOpen) {
mIsMenuOpen = true;
doAnimateOpen(mItemButton1, 0, 5, 300);
doAnimateOpen(mItemButton2, 1, 5, 300);
doAnimateOpen(mItemButton3, 2, 5, 300);
doAnimateOpen(mItemButton4, 3, 5, 300);
doAnimateOpen(mItemButton5, 4, 5, 300);
} else {
mIsMenuOpen = false;
doAnimateClose(mItemButton1, 0, 5, 300);
doAnimateClose(mItemButton2, 1, 5, 300);
doAnimateClose(mItemButton3, 2, 5, 300);
doAnimateClose(mItemButton4, 3, 5, 300);
doAnimateClose(mItemButton5, 4, 5, 300);
}
} else {
Toast.makeText(this, "你点击了" + v, Toast.LENGTH_SHORT).show();
}
}
/**
* 打开菜单的动画
* @param view 执行动画的view
* @param index view在动画序列中的顺序
* @param total 动画序列的个数
* @param radius 动画半径
*/
private void doAnimateOpen(View view, int index, int total, int radius) {
if (view.getVisibility() != View.VISIBLE) {
view.setVisibility(View.VISIBLE);
}
double degree = Math.PI * index / ((total - 1) * 2);
int translationX = (int) (radius * Math.cos(degree));
int translationY = (int) (radius * Math.sin(degree));
Log.d(TAG, String.format("degree=%f, translationX=%d, translationY=%d",
degree, translationX, translationY));
AnimatorSet set = new AnimatorSet();
//包含平移、缩放和透明度动画
set.playTogether(
ObjectAnimator.ofFloat(view, "translationX", 0, translationX),
ObjectAnimator.ofFloat(view, "translationY", 0, translationY),
ObjectAnimator.ofFloat(view, "scaleX", 0f, 1f),
ObjectAnimator.ofFloat(view, "scaleY", 0f, 1f),
ObjectAnimator.ofFloat(view, "alpha", 0f, 1));
//动画周期为500ms
set.setDuration(1 * 500).start();
}
/**
* 关闭菜单的动画
* @param view 执行动画的view
* @param index view在动画序列中的顺序
* @param total 动画序列的个数
* @param radius 动画半径
*/
private void doAnimateClose(final View view, int index, int total,
int radius) {
if (view.getVisibility() != View.VISIBLE) {
view.setVisibility(View.VISIBLE);
}
double degree = Math.PI * index / ((total - 1) * 2);
int translationX = (int) (radius * Math.cos(degree));
int translationY = (int) (radius * Math.sin(degree));
Log.d(TAG, String.format("degree=%f, translationX=%d, translationY=%d",
degree, translationX, translationY));
AnimatorSet set = new AnimatorSet();
//包含平移、缩放和透明度动画
set.playTogether(
ObjectAnimator.ofFloat(view, "translationX", translationX, 0),
ObjectAnimator.ofFloat(view, "translationY", translationY, 0),
ObjectAnimator.ofFloat(view, "scaleX", 1f, 0f),
ObjectAnimator.ofFloat(view, "scaleY", 1f, 0f),
ObjectAnimator.ofFloat(view, "alpha", 1f, 0f));
//为动画加上事件监听，当动画结束的时候，咱们把当前view隐藏
set.addListener(new AnimatorListener() {
@Override
public void onAnimationStart(Animator animator) {
}
@Override
public void onAnimationRepeat(Animator animator) {
}
@Override
public void onAnimationEnd(Animator animator) {
view.setVisibility(View.GONE);
}
@Override
public void onAnimationCancel(Animator animator) {
}
});
set.setDuration(1 * 500).start();
}
}代码下载：
http://download.csdn.net/detail/singwhatiwanna/6782865