listview下拉刷新

最新推荐文章于 2022-08-09 10:57:44 发布

xuegang87

最新推荐文章于 2022-08-09 10:57:44 发布

阅读量458

点赞数

本文链接：https://blog.csdn.net/u010906868/article/details/37756817

版权

第一次写，心情有点小激动，就是算是对以前的工作中用到最多的一个自定义的view的总结。带有下拉刷新的listview，这个自定义的view的相对简单些。原理呢，就是自定义头部的view，以addHeaderView的形式添加进去，然后去设置head的setPadding值来控制headview的显示隐藏，废话不多说了，先看一下效果，直接上代码。

首先我们去创建一个工程，工程的名字随便起，我起的名字RefreshListViewDemo,工程能我是比较习惯建成2.3.3版本的。首先我们先去创建一个头部的布局，

<?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="horizontal" 
    android:background="#EBEBEB"
    android:id="@+id/headView"
    >
    <RelativeLayout 
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingLeft="30dp"
        >
        <FrameLayout 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"            
            >
            <ImageView 
                android:id="@+id/pull_header_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/arrow_down"
                android:layout_gravity="center"
                />
            <ProgressBar 
                android:id="@+id/pull_header_proBar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                style="?android:attr/progressBarStyleSmall"
                android:visibility="gone"
                />
        </FrameLayout>
        <LinearLayout 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:orientation="vertical"
            android:gravity="center_horizontal"
            >
            <TextView 
                android:id="@+id/pull_header_introuduct_tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="下拉帅新"
                android:textSize="15sp"
                android:gravity="center_vertical"
                android:layout_marginTop="6dp"
                />
            <TextView 
                android:id="@+id/pull_header_time_tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="上次更新时间"
                android:textSize="12sp"
                android:gravity="center_vertical"
                android:layout_marginBottom="6dp"
                />
        </LinearLayout>
    </RelativeLayout>
</LinearLayout>

这个布局很简单，简单介绍一下就可以了，在一个相对布局中嵌套了一个帧布局和一个线性布局，帧布局中包含一个imageview和一个progressbar，用于动画操作。下边一个是记录刷新时间和内容提醒，这样头部的布局就算好了，下边是重点，也就是view的重写。

建一个PullToRefreshListView去继承LisvIew和实现OnScrollListener

package com.example.refreshlistviewdemo.view;

import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date;

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.LinearInterpolator;
import android.view.animation.RotateAnimation;
import android.widget.AbsListView;
import android.widget.AbsListView.OnScrollListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.ProgressBar;
import android.widget.TextView;

import com.example.refreshlistviewdemo.R;

public class PullToRefreshListView extends ListView implements OnScrollListener {
	/** 头部布局 */
	private LinearLayout headView;
	/** 头部imageview */
	private ImageView pull_header_image;
	/** 头部ProgressBar */
	private ProgressBar pull_header_proBar;
	/** 头部提示内容 */
	private TextView pull_header_introuduct_tv;
	/** 头部跟新时间提示 */
	private TextView pull_header_time_tv;

	private LayoutInflater mInflater;

	/**
	 * 当下拉刷新的时候头部的箭头需要去转动，初始化动画，用的就是android自身所带的动画，因为箭头开一由下指向上方，
	 * 也可以由上方指向下方所以这里需要两个动画
	 */
	private RotateAnimation animationUp;
	private RotateAnimation animationDown;
	/** 布局的高度 */
	private int headContextHeigth;
	/** 记录Y轴的坐标 */
	private int standY;
	/** 当前item的索引值 */
	private int firstItemIndex;
	/** 我在这里设置了四中状态用于记录头部当前的状态 */
	// 松开刷新
	private static final int RELEASE_To_REFRESH = 1;
	// 下拉刷新
	private static final int PULL_To_REFRESH = RELEASE_To_REFRESH << 2;
	// 正在刷新
	private static final int REFRESHING = RELEASE_To_REFRESH << 3;
	// 空闲状态
	private static final int DONE = RELEASE_To_REFRESH << 4;

	/** 添加一个坐标去设置是否可以去下拉刷新,这个控制是否要下拉刷新这个功能 */
	public boolean isFefreshAble;

	/** 设定初始状态 */
	private int currentStatus;

	/** 设定一个参数可以标记箭头的方向release_fefresh到pull_fefresh状态的时候是否去旋转箭头(看不懂先上后看) */
	private boolean isturn = false;

	/** 保证y值在一次touch中被记录，并且避免重读加载 */
	private boolean isRecored;

	/** 设定拉伸过程中头部显示的空档 */
	private static final int RATIO = 4;

	/** 更新时间 */
	private Date mData;
	private String dateStr = "刚刚";
	private int i;

	private OnRefreshListener mOnRefreshListener;

	public PullToRefreshListView(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}

	public PullToRefreshListView(Context context, AttributeSet attrs) {
		super(context, attrs);
		initData(context);
	}

	public PullToRefreshListView(Context context, AttributeSet attrs,
			int defStyle) {
		super(context, attrs, defStyle);
		// TODO Auto-generated constructor stub
	}

	private void initData(Context context) {

		mInflater = LayoutInflater.from(context);
		// 初始化头部布局
		headView = (LinearLayout) mInflater.inflate(
				R.layout.pull_to_refresh_header, null);

		pull_header_image = (ImageView) headView
				.findViewById(R.id.pull_header_image);
		pull_header_proBar = (ProgressBar) headView
				.findViewById(R.id.pull_header_proBar);
		pull_header_introuduct_tv = (TextView) headView
				.findViewById(R.id.pull_header_introuduct_tv);
		pull_header_time_tv = (TextView) headView
				.findViewById(R.id.pull_header_time_tv);
		// 去获取view的params
		measureView(headView);

		headContextHeigth = headView.getMeasuredHeight();

		// 设置头部的padding参数使得加载的时候头部位置保持隐藏
		headView.setPadding(0, -1 * headContextHeigth, 0, 0);
		headView.invalidate();

		addHeaderView(headView, null, false);

		/**
		 * fromDegrees：旋转的开始角度。
		 * 
		 * toDegrees：旋转的结束角度。
		 * 
		 * pivotXType：X轴的伸缩模式，可以取值为ABSOLUTE、RELATIVE_TO_SELF、RELATIVE_TO_PARENT。
		 * 
		 * pivotXValue：X坐标的伸缩值。
		 * 
		 * pivotYType：Y轴的伸缩模式，可以取值为ABSOLUTE、RELATIVE_TO_SELF、RELATIVE_TO_PARENT。
		 * 
		 * pivotYValue：Y坐标的伸缩值。
		 * 
		 * */
		animationUp = new RotateAnimation(0, -180,
				RotateAnimation.RELATIVE_TO_SELF, 0.5f,
				RotateAnimation.RELATIVE_TO_SELF, 0.5f);
		animationUp.setInterpolator(new LinearInterpolator());
		animationUp.setDuration(250);// 持续时间
		animationUp.setFillAfter(true);// 是否保持最终的状态

		animationDown = new RotateAnimation(-180, 0,
				RotateAnimation.RELATIVE_TO_SELF, 0.5f,
				RotateAnimation.RELATIVE_TO_SELF, 0.5f);
		animationDown.setInterpolator(new LinearInterpolator());
		animationDown.setDuration(200);
		animationDown.setFillAfter(true);

		// 设置当前头部状态是空闲状态
		currentStatus = DONE;
		// 设置是否需要有下拉刷新功能初始为false
		isFefreshAble = false;

	}

	/**
	 * 去父类中分配空间去
	 * */
	private void measureView(View child) {
		ViewGroup.LayoutParams p = child.getLayoutParams();
		if (p == null) {
			p = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT,
					ViewGroup.LayoutParams.WRAP_CONTENT);
		}
		/**
		 * 参数：spec 父窗口传递给子视图的大小和模式 padding 父窗口的边距，也就是xml中的android:padding
		 * childDimension 子视图想要绘制的准确大小，但最终不一定绘制此值
		 * 
		 * */
		int childWidthSpec = ViewGroup.getChildMeasureSpec(0, 0 + 0, p.width);
		int lpHeigth = p.height;
		int childHeigthSpec;
		if (lpHeigth > 0) {
			/**
			 * 它有三种模式：UNSPECIFIED(未指定),父元素部队自元素施加任何束缚，子元素可以得到任意想要的大小；EXACTLY(完全)
			 * ，父元素决定自元素的确切大小，子元素将被限定在给定的边界里而忽略它本身大小；AT_MOST(至多)，子元素至多达到指定大小的值。
			 * 
			 * */
			childHeigthSpec = MeasureSpec.makeMeasureSpec(p.height,
					MeasureSpec.EXACTLY);
		} else {
			childHeigthSpec = MeasureSpec.makeMeasureSpec(0,
					MeasureSpec.UNSPECIFIED);
		}
		child.measure(childWidthSpec, childHeigthSpec);

	}

	@Override
	public void onScrollStateChanged(AbsListView view, int scrollState) {
		// TODO Auto-generated method stub

	}

	@Override
	public void onScroll(AbsListView view, int firstVisibleItem,
			int visibleItemCount, int totalItemCount) {
		// TODO Auto-generated method stub

	}

	public void setOnRefreshListener(OnRefreshListener refreshListener) {
		this.mOnRefreshListener = refreshListener;
		isFefreshAble = true;
	}

	// 刷新时会去回调此方法，在方法内编写具体的刷新逻辑。
	private interface OnRefreshListener {
		public void OnRefresh();
	}

	private void onRefresh() {
		if (mOnRefreshListener != null) {
			mOnRefreshListener.OnRefresh();
		}
	}

	// 外部调用，当调用此方法的时候证明是处于下拉刷新的数据加载过程中所以要将状态设置成闲置，以便下次下拉刷新用
	// 此方法并没有集成加载过程中，加载的progressbar
	public void onRefreshComlete() {
		currentStatus = DONE;
		// 状态改变
		changedHeadViewByStatus();

		if (i > 0) {
			mData = new Date();
		}
		i++;

	}

	// 这个是最主要的逻辑
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		if (isFefreshAble) {
			switch (event.getAction()) {
			case MotionEvent.ACTION_DOWN:
				if (firstItemIndex == 0 && !isRecored) {
					standY = (int) event.getY();
					isRecored = true;
					Log.i("message", "记录点击下的y值坐标");
				}
				break;

			case MotionEvent.ACTION_UP:
				if (currentStatus == DONE) {
					// 什么都不用做
				} else if (currentStatus == PULL_To_REFRESH) {
					// 没有到达要刷新的的地步所以放开手的时候状态改为初始状态
					currentStatus = DONE;
					changedHeadViewByStatus();
				} else if (currentStatus == RELEASE_To_REFRESH) {
					// 放开刷新
					currentStatus = REFRESHING;
					changedHeadViewByStatus();
					onRefresh();
				}
				isturn = false;
				isRecored = false;

				break;
			case MotionEvent.ACTION_MOVE:
				int moveY = (int) event.getY();
				if (firstItemIndex == 0 && !isRecored) {
					isRecored = true;
					standY = moveY;
					Log.i("message", "记录滑动以后的y值");
				}

				if (currentStatus != REFRESHING && isRecored) {
					// 保证在设置padding的过程中，当前的位置一直是在head，否则如果当列表超出屏幕的话，当在上推的时候，列表会同时进行滚动

					// 下拉
					if (currentStatus == PULL_To_REFRESH) {

						setSelection(0);
						// 下拉到可以进入RELEASE_TO_REFRESH的状态
						if ((moveY - standY) / RATIO >= headContextHeigth) {
							currentStatus = RELEASE_To_REFRESH;
							isturn = true;

							changedHeadViewByStatus();
						}
						// 下拉刷新没有松手，然后在推上去
						else if (moveY - standY <= 0) {
							// 将状态设置为闲置状态
							currentStatus = DONE;
							changedHeadViewByStatus();
						}
					}

					// 可以松手去刷新了

					if (currentStatus == RELEASE_To_REFRESH) {
						setSelection(0);
						if ((moveY - standY) / RATIO < headContextHeigth
								&& (moveY - standY) > 0) {
							// 往上推了，推到了屏幕足够掩盖head的程度，但是还没有推到全部掩盖的地步
							// 这个时候状态改变成上一个状态
							currentStatus = PULL_To_REFRESH;
							changedHeadViewByStatus();
						}
						// 这是瞬间推到顶了，header完全被覆盖，那么就要把状态设置成原始的空闲状态
						if (moveY - standY < 0) {
							currentStatus = DONE;
							changedHeadViewByStatus();
						}
					}

					// 如果是原始状态则进入下一个状态
					if (currentStatus == DONE) {
						if (moveY - standY > 0) {
							currentStatus = PULL_To_REFRESH;
							changedHeadViewByStatus();
						}
					}
					// 每次设定完成都要去设定headview
					if (currentStatus == PULL_To_REFRESH
							|| currentStatus == RELEASE_To_REFRESH) {
						headView.setPadding(0, -1 * headContextHeigth
								+ (moveY - standY) / RATIO, 0, 0);
					}
				}
				break;
			}
		}
		return super.onTouchEvent(event);
	}

	// 当状态改变的时候调用此方法
	private void changedHeadViewByStatus() {
		switch (currentStatus) {
		case RELEASE_To_REFRESH:
			pull_header_image.setVisibility(View.VISIBLE);
			pull_header_proBar.setVisibility(View.GONE);

			pull_header_image.clearAnimation();
			pull_header_image.setAnimation(animationUp);

			pull_header_introuduct_tv.setText("松开刷新");
			break;
		case PULL_To_REFRESH:
			pull_header_image.setVisibility(View.VISIBLE);
			pull_header_proBar.setVisibility(View.GONE);

			if (isturn) {
				isturn = false;
				pull_header_image.clearAnimation();
				pull_header_image.setAnimation(animationDown);
			}
			pull_header_introuduct_tv.setText("下拉刷新");

			updateTime();
			break;
		case REFRESHING:
			// 正在刷新的时候设置头部
			headView.setPadding(0, 0, 0, 0);
			// 关闭headerImage上的动画效果
			pull_header_image.clearAnimation();
			// 隐藏箭头
			pull_header_image.setVisibility(View.GONE);
			// 显示progressbar
			pull_header_proBar.setVisibility(View.VISIBLE);
			pull_header_introuduct_tv.setText("正在刷新....");
			break;
		case DONE:
			// 闲置状态 首先设定头部的位置
			headView.setPadding(0, -1 * headContextHeigth, 0, 0);
			// 隐藏progressbar
			pull_header_proBar.setVisibility(View.GONE);
			// 清除动画
			pull_header_image.clearAnimation();
			pull_header_introuduct_tv.setText("下拉刷新");
			break;
		}
	}

	private void updateTime() {
		SimpleDateFormat mFormat = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
		if (mData != null) {
			dateStr = getCreateString(mData);

			if (dateStr.equals(mFormat.format(mData))) {
				dateStr = "刚刚";
			}
		}
		pull_header_time_tv.setText("最近更新:" + dateStr);
	}

	/**
	 * 获取更新时间
	 * 
	 * */
	public static String getCreateString(Date date) {
		Calendar calendar = Calendar.getInstance();
		SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
		if (calendar.get(Calendar.YEAR) - (date.getYear() + 1900) > 0) {
			return sdf.format(date);
		} else if (calendar.get(Calendar.MONTH) - date.getMonth() > 0) {
			return sdf.format(date);
		} else if (calendar.get(Calendar.DAY_OF_MONTH) - date.getDate() > 0) {
			return sdf.format(date);
		} else if (calendar.get(Calendar.HOUR_OF_DAY) - date.getHours() > 0) {
			int i = calendar.get(Calendar.HOUR_OF_DAY) - date.getHours();
			return i + "小时前";
		} else if (calendar.get(Calendar.MINUTE) - date.getMinutes() > 0) {
			int i = calendar.get(Calendar.MINUTE) - date.getMinutes();
			return i + "分钟前";
		} else if (calendar.get(Calendar.SECOND) - date.getSeconds() > 0) {
			int i = calendar.get(Calendar.SECOND) - date.getSeconds();
			return i + "秒前";
		} else {
			return sdf.format(date);
		}
	}

}

好了现在自定义view已经写好了，上边的注释还是比较全的吧，相信都能看懂，我就不重复的啰嗦了，时间就是金钱。

直接去布局引用刚写好的view，布局很简单就是一个listview别的什么都没有

<?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" 
    >

  
    <com.example.canvastest.view.PullToRefreshListView
        android:id="@+id/my_listView"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >
    </com.example.canvastest.view.PullToRefreshListView>
</LinearLayout>

下边就是一个activity了

package com.example.refreshlistviewdemo;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;

import com.example.refreshlistviewdemo.view.PullToRefreshListView;
import com.example.refreshlistviewdemo.view.PullToRefreshListView.OnRefreshListener;

import android.app.Activity;
import android.os.AsyncTask;
import android.os.Bundle;
import android.view.View;
import android.widget.AbsListView;
import android.widget.AbsListView.OnScrollListener;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.Toast;

public class MainActivity extends Activity {
	PullToRefreshListView mListView;
	private String[] adapterData;

	private List<String> adapterDatas = new ArrayList<String>();
	public boolean isLoading;
	private boolean touchstate = false;
	//没有去重写适配器就用的android给的
	ArrayAdapter<String> mAdapter = null;
	private Test testAsyncTask; 

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		mListView = (PullToRefreshListView) findViewById(R.id.my_listView);

		//调用方法，实现刷新时的方法实现，如果不想要刷新功能不调用此方法即可
		mListView.setOnRefreshListener(new OnRefreshListener() {
			@Override
			public void onRefresh() {
				fetchTask();
			}
			
		});

		
		adapterData = new String[] { "Afghanistan", "Albania", "Algeria",
				"American Samoa", "Andorra", "Angola", "Anguilla",
				"Antarctica", "Antigua and Barbuda", "Argentina", "Armenia",
				"Aruba", "Australia", "Austria", "Azerbaijan", "Bahrain",
				"Bangladesh", "Barbados", "Belarus", "Belgium", "Belize",
				"Benin", "Bermuda", "Bhutan", "Bolivia",
				"Bosnia and Herzegovina", "Botswana", "Bouvet Island" };

		mListView.setOnScrollListener(scrollListener);

		addListener();

	}

        //这样你就可以看到你点的是第几个item，而且因为我们添加了headview所以第一个item的索引值并不是0，添加这个监听你就可以试试看了。
	private void addListener(){
		mListView.setOnItemClickListener(new OnItemClickListener() {

			 @Override
			public void onItemClick(AdapterView<?> parent, View view,
					int position, long id) {
				Toast.makeText(MainActivity.this, "("+position+")", Toast.LENGTH_SHORT).show();
			}
		});
	}
	@Override
	protected void onResume() {
		// TODO Auto-generated method stub
		super.onResume();
		fetchTask();
	}

	class Test extends AsyncTask<Void, Void, String> {

		private boolean isCancel;
		@Override
		protected String doInBackground(Void... params) {
			if(isCancel){
				return null;
			}
			try {

                               //使线程睡3秒这样更能看出效果
				Thread.sleep(3000);
			} catch (InterruptedException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			}
			isLoading = true;
			return null;
		}

		@Override
		protected void onPostExecute(String result) {
			super.onPostExecute(result);
				adapterDatas= Arrays.asList(adapterData);
				
				 mAdapter = new ArrayAdapter<String>(
						MainActivity.this,
						android.R.layout.simple_expandable_list_item_1, adapterDatas);
				mListView.setAdapter(mAdapter);
			//当加载完毕的时候去调用该方法重新去设定头部的状态
			mListView.onRefreshComlete();
			isLoading = false;
		}
		
		@Override
		protected void onCancelled() {
			super.onCancelled();
			cancel(true);
			isCancel = true;
		}
		
		@Override
		protected void onPreExecute() {
			super.onPreExecute();
		}

	}

	OnScrollListener scrollListener = new OnScrollListener() {

		@Override
		public void onScrollStateChanged(AbsListView view, int scrollState) {
			if (touchstate && !isLoading&&scrollState==AbsListView.OnScrollListener.SCROLL_STATE_IDLE) {
				fetchTask();
			}
		}

		@Override
		public void onScroll(AbsListView view, int firstVisibleItem,
				int visibleItemCount, int totalItemCount) {
			//设置当前显示的listview最上边的item的索引值
			mListView.setFirstItemIndex(firstVisibleItem);
			if ((firstVisibleItem + visibleItemCount >= totalItemCount)&&(firstVisibleItem!=0&&visibleItemCount!=totalItemCount)) {
				touchstate = true;
			} else {
				touchstate = false;
			}
		}
	};
	private void fetchTask() {
		// 
		try {
			if (testAsyncTask != null && !testAsyncTask.isCancelled()) {
				testAsyncTask.cancel(true);
			}
			testAsyncTask = new Test();
			testAsyncTask.execute();
		} catch (Exception e) {
			e.printStackTrace();
		}
	}

}

到这全部完了，第一次写写的不好别见怪

源码下载