Android动画特效实例

导语

下面介绍使用Android的动画框架来制作赏心悦目的动画效果，想看理论知识戳我。

主要内容

• 灵动菜单
• 计时器动画
• 下拉展开动画

具体内容

先上三种效果的效果图：

灵动菜单

• 布局文件

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="match_parent"    android:layout_height="match_parent">    <ImageView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/imageView_b"        android:src="@drawable/b"        android:layout_centerVertical="true"        android:layout_centerHorizontal="true" />    <ImageView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/imageView_c"        android:src="@drawable/c"        android:layout_centerVertical="true"        android:layout_centerHorizontal="true" />    <ImageView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/imageView_d"        android:src="@drawable/d"        android:layout_centerVertical="true"        android:layout_centerHorizontal="true" />    <ImageView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/imageView_e"        android:src="@drawable/e"        android:layout_centerVertical="true"        android:layout_centerHorizontal="true" />    <ImageView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/imageView_a"        android:src="@drawable/a"        android:layout_centerVertical="true"        android:layout_centerHorizontal="true" /></RelativeLayout>

• Activity文件

public class PropertyTest extends Activity implements View.OnClickListener {    private int[] mRes = {R.id.imageView_a, R.id.imageView_b, R.id.imageView_c,            R.id.imageView_d, R.id.imageView_e};    private List<ImageView> mImageViews = new ArrayList<ImageView>();    private boolean mFlag = true;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.property);        for (int i = 0; i < mRes.length; i++) {            ImageView imageView = (ImageView) findViewById(mRes[i]);            imageView.setOnClickListener(this);            mImageViews.add(imageView);        }    }    @Override    public void onClick(View v) {        switch (v.getId()) {            case R.id.imageView_a:                if (mFlag) {                    startAnim();                } else {                    closeAnim();                }                break;            default:                Toast.makeText(PropertyTest.this, "" + v.getId(),                        Toast.LENGTH_SHORT).show();                break;        }    }    private void closeAnim() {        ObjectAnimator animator0 = ObjectAnimator.ofFloat(mImageViews.get(0),                "alpha", 0.5F, 1F);        ObjectAnimator animator1 = ObjectAnimator.ofFloat(mImageViews.get(1),                "translationY", 200F, 0);        ObjectAnimator animator2 = ObjectAnimator.ofFloat(mImageViews.get(2),                "translationX", 200F, 0);        ObjectAnimator animator3 = ObjectAnimator.ofFloat(mImageViews.get(3),                "translationY", -200F, 0);        ObjectAnimator animator4 = ObjectAnimator.ofFloat(mImageViews.get(4),                "translationX", -200F, 0);        AnimatorSet set = new AnimatorSet();        set.setDuration(500);        set.setInterpolator(new BounceInterpolator());        set.playTogether(animator0, animator1, animator2, animator3, animator4);        set.start();        mFlag = true;    }    private void startAnim() {        ObjectAnimator animator0 = ObjectAnimator.ofFloat(                mImageViews.get(0),                "alpha",                1F,                0.5F);        ObjectAnimator animator1 = ObjectAnimator.ofFloat(                mImageViews.get(1),                "translationY",                200F);        ObjectAnimator animator2 = ObjectAnimator.ofFloat(                mImageViews.get(2),                "translationX",                200F);        ObjectAnimator animator3 = ObjectAnimator.ofFloat(                mImageViews.get(3),                "translationY",                -200F);        ObjectAnimator animator4 = ObjectAnimator.ofFloat(                mImageViews.get(4),                "translationX",                -200F);        AnimatorSet set = new AnimatorSet();        set.setDuration(500);        set.setInterpolator(new BounceInterpolator());        set.playTogether(                animator0,                animator1,                animator2,                animator3,                animator4);        set.start();        mFlag = false;    }}

• 效果图

• 素材

a.png b.png c.png d.png e.png

计时器动画

• 布局文件

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="match_parent"    android:layout_height="match_parent">    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="Click Me"        android:textSize="60sp"        android:onClick="tvTimer"        android:layout_centerVertical="true"        android:layout_centerHorizontal="true" /></RelativeLayout>

• Activity文件

public class TimerTest extends Activity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.timer);    }    public void tvTimer(final View view) {        ValueAnimator valueAnimator = ValueAnimator.ofInt(0, 100);        valueAnimator.addUpdateListener(                new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator animation) {                ((TextView) view).setText("$ " +                        (Integer) animation.getAnimatedValue());            }        });        valueAnimator.setDuration(3000);        valueAnimator.start();    }}

• 效果图

下拉展开动画

• 布局文件

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:orientation="vertical">    <LinearLayout        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:gravity="center_vertical"        android:onClick="llClick"        android:background="@android:color/holo_blue_bright"        android:orientation="horizontal">        <ImageView            android:id="@+id/app_icon"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_gravity="center"            android:src="@mipmap/ic_launcher" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="5dp"            android:gravity="left"            android:text="Click Me"            android:textSize="30sp" />    </LinearLayout>    <LinearLayout        android:id="@+id/hidden_view"        android:layout_width="match_parent"        android:layout_height="40dp"        android:background="@android:color/holo_orange_light"        android:gravity="center_vertical"        android:orientation="horizontal"        android:visibility="gone">        <ImageView            android:src="@mipmap/ic_launcher"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_gravity="center" />        <TextView            android:id="@+id/tv_hidden"            android:layout_width="wrap_content"            android:layout_height="match_parent"            android:gravity="center"            android:textSize="20sp"            android:text="I am hidden" />    </LinearLayout></LinearLayout>

• Activity文件

public class DropTest extends Activity {    private LinearLayout mHiddenView;    private float mDensity;    private int mHiddenViewMeasuredHeight;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.drop);        mHiddenView = (LinearLayout) findViewById(R.id.hidden_view);        // 获取像素密度        mDensity = getResources().getDisplayMetrics().density;        // 获取布局的高度        mHiddenViewMeasuredHeight = (int) (mDensity * 40 + 0.5);    }    public void llClick(View view) {        if (mHiddenView.getVisibility() == View.GONE) {            // 打开动画            animateOpen(mHiddenView);        } else {            // 关闭动画            animateClose(mHiddenView);        }    }    private void animateOpen(final View view) {        view.setVisibility(View.VISIBLE);        ValueAnimator animator = createDropAnimator(                view,                0,                mHiddenViewMeasuredHeight);        animator.start();    }    private void animateClose(final View view) {        int origHeight = view.getHeight();        ValueAnimator animator = createDropAnimator(view, origHeight, 0);        animator.addListener(new AnimatorListenerAdapter() {            public void onAnimationEnd(Animator animation) {                view.setVisibility(View.GONE);            }        });        animator.start();    }    private ValueAnimator createDropAnimator(            final View view, int start, int end) {        ValueAnimator animator = ValueAnimator.ofInt(start, end);        animator.addUpdateListener(                new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator valueAnimator) {                int value = (Integer) valueAnimator.getAnimatedValue();                ViewGroup.LayoutParams layoutParams =                        view.getLayoutParams();                layoutParams.height = value;                view.setLayoutParams(layoutParams);            }        });        return animator;    }}

• 效果图

总结

理解上面的案例。

进入我的CSDN戳这里（我的博客导航）