android Pull-to-refresh 動畫實現

android Pull-to-refresh 動畫實現

現在很多應用都使用的pull-to-refresh 動畫效果，包括微博、、QQ等。

這裡樣本性的實現pull-to-refresh 動畫效果，並增加了額外的圖片放大、透明度、位移等動畫。這些動畫也被經常使用。

實現效果：

http://v.youku.com/v_show/id_XNjY0MTQzODQ4.html

java檔案

package com.buptfarmer.devapp;import static com.nineoldandroids.view.ViewPropertyAnimator.animate;import com.nineoldandroids.animation.Animator;import com.nineoldandroids.animation.AnimatorListenerAdapter;import com.nineoldandroids.view.ViewHelper;import android.app.Activity;import android.os.Bundle;import android.view.MotionEvent;import android.view.View;import android.view.ViewConfiguration;import android.view.View.OnTouchListener;import android.view.animation.RotateAnimation;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;public class PullAnimationExample extends Activity {    private TextView mRefreshText;    private TextView mAaaText;    private ImageView mHeaderImg;    private LinearLayout mBottom;    private LinearLayout mHolder;    private int mCount;    private RotateAnimation mFlipAnimation;    private RotateAnimation mReverseFlipAnimation;    private int mSlop;    private boolean mSwiping;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        ViewConfiguration vc = ViewConfiguration.get(this);        mSlop = vc.getScaledTouchSlop();        initView();        mFlipAnimation = new RotateAnimation(0, -180,                RotateAnimation.RELATIVE_TO_SELF, 0.5f,                RotateAnimation.RELATIVE_TO_SELF, 0.5f);        mFlipAnimation.setFillAfter(true);        mReverseFlipAnimation = new RotateAnimation(-180, 0,                RotateAnimation.RELATIVE_TO_SELF, 0.5f,                RotateAnimation.RELATIVE_TO_SELF, 0.5f);        mReverseFlipAnimation.setFillAfter(true);    }    private void initView() {        setContentView(R.layout.pull_animation_example);        mHolder = (LinearLayout) findViewById(R.id.holder);        mHeaderImg = (ImageView) findViewById(R.id.header_img);        ViewHelper.setAlpha(mHeaderImg, 0.3f);        mRefreshText = (TextView)findViewById(R.id.refresh);        mRefreshText.setVisibility(View.INVISIBLE);        mAaaText = (TextView) findViewById(R.id.aaa);        mBbbText = (TextView) findViewById(R.id.bbb);        mBottom = (LinearLayout) findViewById(R.id.buttom);        mHolder.setOnTouchListener(new OnTouchListener() {            private float mDownX;            private float mDownY;            @Override            public boolean onTouch(View v, MotionEvent event) {                switch (event.getAction()) {                    case MotionEvent.ACTION_DOWN: {                        mDownX = event.getX();                        mDownY = event.getY();                        mRefreshText.setVisibility(View.VISIBLE);                        mRefreshText.setText("pull to refresh");                        break;                    }                    case MotionEvent.ACTION_MOVE: {                        float deltaX = Math.abs(event.getX() - mDownX);                        float deltaY = Math.abs(event.getY() - mDownY);                        if (deltaY > mSlop && deltaY > 0) {                            mSwiping = true;                            v.getParent().requestDisallowInterceptTouchEvent(true);                            float percent = Math.min(0.2f, Math.abs(deltaY) / mHeaderImg.getMeasuredHeight());                            ViewHelper.setScaleX(mHeaderImg,                                    1f + 3f * percent);                            ViewHelper.setScaleY(mHeaderImg,                                    1f + 3f * percent);                            ViewHelper.setAlpha(mHeaderImg,                                    Math.min(1f, 0.3f+3f * percent));                            ViewHelper.setTranslationY(mBottom, deltaY);                            if(deltaY > mRefreshText.getHeight()){                                mRefreshText.setText("release to refresh");                            }                        }                        break;                    }                    case MotionEvent.ACTION_UP: {                        if (mSwiping) {                            mSwiping = false;                            ViewHelper.setScaleX(mHeaderImg, 1f);                            ViewHelper.setScaleY(mHeaderImg, 1f);                            ViewHelper.setAlpha(mHeaderImg, 0.3f);                            animate(mHeaderImg).alpha(0.3f).scaleX(1f).scaleY(1f).setListener(null);                            animate(mBottom).translationY(0).setListener(null);                            updateText();                            mRefreshText.setVisibility(View.INVISIBLE);                            mRefreshText.setText("refreshing...");                        }                        break;                    }                    default: {                        break;                    }                }                return true;            }        });    }    private void updateText() {        animateText(mAaaText, new AnimationCallback() {            @Override            public void onAnimation() {                // TODO Auto-generated method stub                mAaaText.setText("update " + mCount++);            }        });    }    public static void animateText(final View view, final AnimationCallback callback) {        int origHeight = view.getHeight();        animate(view).translationY(origHeight).alpha(0).scaleX(0.5f).scaleY(0.5f)                .setListener(new AnimatorListenerAdapter() {                    public void onAnimationEnd(Animator animation) {                        if (callback != null) {                            callback.onAnimation();                        }                        animate(view).translationY(0).alpha(1).scaleX(1f).scaleY(1f).setListener(null);                    };                });    }    public interface AnimationCallback {        public void onAnimation();    }}

layout xml 檔案