安卓新闻客户端(五) ListView下拉刷新 XlistView解析

Xlistview包含三个部分 XlistView Header Footer
先来看Header

根据这个Header 找了几个测试程序 首先是动画效果的

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >
        <Button
            android:id="@+id/rotateButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="旋转" />
        <Button
            android:id="@+id/scaleButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="缩放" />
        <Button
            android:id="@+id/alphaButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="淡入淡出" />
        <Button
            android:id="@+id/translateButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="移动" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >
        <ImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:src="@drawable/an" />
    </LinearLayout>
</LinearLayout>

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends Activity {
    private Button rotateButton = null;
    private Button scaleButton = null;
    private Button alphaButton = null;
    private Button translateButton = null;
    private ImageView image = null;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        rotateButton = (Button) findViewById(R.id.rotateButton);
        scaleButton = (Button) findViewById(R.id.scaleButton);
        alphaButton = (Button) findViewById(R.id.alphaButton);
        translateButton = (Button) findViewById(R.id.translateButton);
        image = (ImageView) findViewById(R.id.image);

        rotateButton.setOnClickListener(new RotateButtonListener());
        scaleButton.setOnClickListener(new ScaleButtonListener());
        alphaButton.setOnClickListener(new AlphaButtonListener());
        translateButton.setOnClickListener(
                new TranslateButtonListener());
    }

    class AlphaButtonListener implements OnClickListener {
        public void onClick(View v) {
            //创建一个AnimationSet对象，参数为Boolean型，
            //true表示使用Animation的interpolator，false则是使用自己的
            AnimationSet animationSet = new AnimationSet(true);
            //创建一个AlphaAnimation对象，参数从完全的透明度，到完全的不透明
            AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
            //设置动画执行的时间
            alphaAnimation.setDuration(5000);
            //将alphaAnimation对象添加到AnimationSet当中
            animationSet.addAnimation(alphaAnimation);
            //使用ImageView的startAnimation方法执行动画
            image.startAnimation(animationSet);
        }
    }

    class RotateButtonListener implements OnClickListener {
        public void onClick(View v) {
            //AnimationSet animationSet = new AnimationSet(true);
            //参数1：从哪个旋转角度开始
            //参数2：转到什么角度
            //后4个参数用于设置围绕着旋转的圆的圆心在哪里
            //参数3：确定x轴坐标的类型，有ABSOLUT绝对坐标、RELATIVE_TO_SELF相对于自身坐标、RELATIVE_TO_PARENT相对于父控件的坐标
            //参数4：x轴的值，0.5f表明是以自身这个控件的一半长度为x轴
            //参数5：确定y轴坐标的类型
            //参数6：y轴的值，0.5f表明是以自身这个控件的一半长度为x轴
            RotateAnimation rotateAnimation = new RotateAnimation(0, 180,
                    Animation.RELATIVE_TO_SELF, 0.5f,
                    Animation.RELATIVE_TO_SELF, 0.5f);
            rotateAnimation.setDuration(1000);

            rotateAnimation.setFillAfter(true);
            //animationSet.addAnimation(rotateAnimation);
            //image.startAnimation(animationSet);
           image.startAnimation(rotateAnimation);


        }
    }

    class ScaleButtonListener implements OnClickListener {
        public void onClick(View v) {
            AnimationSet animationSet = new AnimationSet(true);
            //参数1：x轴的初始值
            //参数2：x轴收缩后的值
            //参数3：y轴的初始值
            //参数4：y轴收缩后的值
            //参数5：确定x轴坐标的类型
            //参数6：x轴的值，0.5f表明是以自身这个控件的一半长度为x轴
            //参数7：确定y轴坐标的类型
            //参数8：y轴的值，0.5f表明是以自身这个控件的一半长度为x轴
            ScaleAnimation scaleAnimation = new ScaleAnimation(
                    0, 0.1f, 0, 0.1f,
                    Animation.RELATIVE_TO_SELF, 0.5f,
                    Animation.RELATIVE_TO_SELF, 0.5f);
            scaleAnimation.setDuration(1000);
            animationSet.addAnimation(scaleAnimation);
            image.startAnimation(animationSet);
        }
    }

    class TranslateButtonListener implements OnClickListener {
        public void onClick(View v) {
            AnimationSet animationSet = new AnimationSet(true);
            //参数1～2：x轴的开始位置
            //参数3～4：y轴的开始位置
            //参数5～6：x轴的结束位置
            //参数7～8：x轴的结束位置
            TranslateAnimation translateAnimation =
                    new TranslateAnimation(
                            Animation.RELATIVE_TO_SELF, 0f,
                            Animation.RELATIVE_TO_SELF, 0.5f,
                            Animation.RELATIVE_TO_SELF, 0f,
                            Animation.RELATIVE_TO_SELF, 0.5f);
            translateAnimation.setDuration(1000);
            animationSet.addAnimation(translateAnimation);
            image.startAnimation(animationSet);
        }
    }
}

大家重点看那个旋转的，这里有一点要注意，setFillAfter(true)这个方法，只有true才会保持动画后的位置，而且不要放在集合里，除了旋转外，其他几个动作都放在了集合里，这样设置setFillAfter(true)也没用，这一块主要探究header中箭头旋转动作的实现，看下我的实现目标

这是下拉刷新的三个状态，开始下拉的时候显示下拉刷新，箭头向下，然后拉到这足够距离，变为松开载入更多，箭头向上，松开后变成正在加载，显示进度条；
下面是测试代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:gravity="center">
        <Button
            android:id="@+id/nomalButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="下拉刷新" />
        <Button
            android:id="@+id/readyButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="松开刷新" />
        <Button
            android:id="@+id/refrashButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="正在刷新" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal"
        android:gravity="center_horizontal">
        <ImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:src="@drawable/an"

            />
        <ProgressBar
            android:id="@+id/progressbar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:visibility="invisible"
            android:layout_marginLeft="-40dp"/>
        <TextView
            android:id="@+id/state_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="下拉刷新"/>
    </LinearLayout>
</LinearLayout>

package com.example.yimowunai.testanimation2;

import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.RotateAnimation;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ProgressBar;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    public final static int STATE_NORMAL = 0;
    public final static int STATE_READY = 1;
    public final static int STATE_REFRESHING = 2;
    public final static int ROTATE_ANIM_DURATION = 180;

    private static final String HINT_NORMAL = "下拉刷新";
    private static final String HINT_READY = "松开刷新数据";
    private static final String HINT_LOADING = "正在加载...";
    private int mState;
    private ImageView mArrowImageView;
    private ProgressBar mProgressBar;
    private TextView mHintTextView;
    private Animation mRotateUpAnim;
    private Animation mRotateDownAnim;

    private Button normal;
    private Button ready;
    private Button refreshing;

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        initView(MainActivity.this);
    }


    private void initView(Context context) {
        mState = STATE_NORMAL;
        mArrowImageView = (ImageView) findViewById(R.id.image);
        mHintTextView = (TextView) findViewById(R.id.state_text);
        mProgressBar = (ProgressBar) findViewById(R.id.progressbar);
        normal = (Button) findViewById(R.id.nomalButton);
        ready = (Button) findViewById(R.id.readyButton);
        refreshing = (Button) findViewById(R.id.refrashButton);

        normal.setOnClickListener(this);
        ready.setOnClickListener(this);
        refreshing.setOnClickListener(this);

        mRotateUpAnim = new RotateAnimation(0.0f, -180.0f,
                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
                0.5f);
        mRotateUpAnim.setDuration(ROTATE_ANIM_DURATION);
        mRotateUpAnim.setFillAfter(true);
        mRotateDownAnim = new RotateAnimation(-180.0f, 0.0f,
                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
                0.5f);
        mRotateDownAnim.setDuration(ROTATE_ANIM_DURATION);
        mRotateDownAnim.setFillAfter(true);
    }

   /*     public void setState(int state) {
            Log.i("main","---state---->"+state+"    -----mState----->"+mState);
            if (state == mState)
                return;

            // 显示进度
            if (state == STATE_REFRESHING) {
                mArrowImageView.clearAnimation();
                mArrowImageView.setVisibility(View.INVISIBLE);
                mProgressBar.setVisibility(View.VISIBLE);
            } else {
                // 显示箭头
                mArrowImageView.setVisibility(View.VISIBLE);
                mProgressBar.setVisibility(View.INVISIBLE);
            }

            switch (state) {
                case STATE_NORMAL:
                    if (mState == STATE_READY) {
                       // mArrowImageView.clearAnimation();
                        mArrowImageView.startAnimation(mRotateDownAnim);
                    }
                    if (mState == STATE_REFRESHING) {


                        mArrowImageView.clearAnimation();
                    }
                    mHintTextView.setText(HINT_NORMAL);
                    break;
                case STATE_READY:
                    if (mState != STATE_READY) {

                        mArrowImageView.clearAnimation();

                        mArrowImageView.startAnimation(mRotateUpAnim);
                        mHintTextView.setText(HINT_READY);
                    }
                    break;
                case STATE_REFRESHING:
                    mHintTextView.setText(HINT_LOADING);
                    break;
            }

            mState = state;
        }*/



    public void setState(int state) {

        if (state == mState) {
            return;
        }


        switch (state) {
            case STATE_NORMAL:
                if (mState == STATE_READY) {

                    mArrowImageView.startAnimation(mRotateDownAnim);
                } else {

                    mArrowImageView.clearAnimation();
                    mArrowImageView.setVisibility(View.VISIBLE);
                    mProgressBar.setVisibility(View.INVISIBLE);
                }
                mHintTextView.setText(R.string.xlistview_header_hint_normal);
                break;
            case STATE_READY:
                mArrowImageView.clearAnimation();
                if (mState == STATE_NORMAL) {


                    mArrowImageView.startAnimation(mRotateUpAnim);

                } else {

                    mArrowImageView.setVisibility(View.VISIBLE);
                    mProgressBar.setVisibility(View.INVISIBLE);
                    mArrowImageView.startAnimation(mRotateUpAnim);
                }
                mHintTextView.setText(R.string.xlistview_footer_hint_ready);


                break;
            case STATE_REFRESHING:
                mArrowImageView.clearAnimation();
                mArrowImageView.setVisibility(View.INVISIBLE);
                mProgressBar.setVisibility(View.VISIBLE);

                mHintTextView.setText(R.string.xlistview_header_hint_loading);
                break;


        }
        mState = state;


    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.nomalButton:
               // mArrowImageView.startAnimation(mRotateUpAnim);
                 setState(STATE_NORMAL);
                break;
            case R.id.readyButton:
                //mArrowImageView.startAnimation(mRotateDownAnim);
                setState(STATE_READY);
                break;
            case R.id.refrashButton:
                setState(STATE_REFRESHING);
                break;

        }
    }
}

注释的位置为XLISTVIEW中的代码，下面的是自己写的，基本一样，XlistView 的更简洁一些
弄明白了这个动画效果的实现之后，看以看下这篇博客，详尽分析XListView
Android XListView实现原理讲解及分析