注:这是黑马自定义控件中讲的一个例子,比较实用,搬到这来了。
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/38238749
1.简介
无疑,在Android开发中,ListView是使用非常频繁的控件之一,ListView提供一个列表的容易,允许我们以列表的形式将数据展示到界面上,但是Google给我们提供的原生ListView的控件,虽然在功能上很强大,但是在用户体验和动态效果上,还是比较差劲的。为了改善用户体验,市面上纷纷出现了各种各样的自定义的ListView,他们功能强大,界面美观,使我们该需要学习的地方。其中,使用最频繁的功能无疑就是ListView的下拉刷新和上拉加载数据了,几乎在没一款内容型的App中都可以找到这种控件的身影,尤其是需要联网获取数据的模块,使用的就更为频繁了,so,我们很有必要了解下这种效果是怎么实现的。
2.开源组件PullToRefreshList介绍
3.自定义ListView——下拉刷新&上拉加载
- <?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" >
- <FrameLayout
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_margin="10dip" >
- <ImageView
- android:id="@+id/iv_listview_header_arrow"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="center"
- android:minWidth="30dip"
- android:src="@drawable/common_listview_headview_red_arrow" />
- <ProgressBar
- android:id="@+id/pb_listview_header"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="center"
- android:indeterminateDrawable="@drawable/common_progressbar"
- android:visibility="gone" />
- </FrameLayout>
- <LinearLayout
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:layout_gravity="center_vertical"
- android:gravity="center_horizontal"
- android:orientation="vertical" >
- <TextView
- android:id="@+id/tv_listview_header_state"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="下拉刷新"
- android:textColor="#FF0000"
- android:textSize="18sp" />
- <TextView
- android:id="@+id/tv_listview_header_last_update_time"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_marginTop="5dip"
- android:text="最后刷新时间: 2014-10-10 12:56:12"
- android:textColor="@android:color/white"
- android:textSize="14sp" />
- </LinearLayout>
- </LinearLayout>
- <?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="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="center_horizontal"
- android:layout_margin="10dip"
- android:gravity="center_vertical"
- android:orientation="horizontal" >
- <ProgressBar
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="center"
- android:indeterminateDrawable="@drawable/common_progressbar" />
- <TextView
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_marginLeft="10dip"
- android:text="加载更多..."
- android:textColor="#FF0000"
- android:textSize="18sp" />
- </LinearLayout>
- </LinearLayout>
- <?xml version="1.0" encoding="utf-8"?>
- <rotate xmlns:android="http://schemas.android.com/apk/res/android"
- android:fromDegrees="0"
- android:pivotX="50%"
- android:pivotY="50%"
- android:toDegrees="360" >
- <shape
- android:innerRadiusRatio="3"
- android:shape="ring"
- android:useLevel="false" >
- <gradient
- android:centerColor="#FF6666"
- android:endColor="#FF0000"
- android:startColor="#FFFFFF"
- android:type="sweep" />
- </shape>
- </rotate>
- public class RefreshListView extends ListView implements OnScrollListener {
- private static final String TAG = "RefreshListView";
- private int firstVisibleItemPosition; // 屏幕显示在第一个的item的索引
- private int downY; // 按下时y轴的偏移量
- private int headerViewHeight; // 头布局的高度
- private View headerView; // 头布局的对象
- private final int DOWN_PULL_REFRESH = 0; // 下拉刷新状态
- private final int RELEASE_REFRESH = 1; // 松开刷新
- private final int REFRESHING = 2; // 正在刷新中
- private int currentState = DOWN_PULL_REFRESH; // 头布局的状态: 默认为下拉刷新状态
- private Animation upAnimation; // 向上旋转的动画
- private Animation downAnimation; // 向下旋转的动画
- private ImageView ivArrow; // 头布局的剪头
- private ProgressBar mProgressBar; // 头布局的进度条
- private TextView tvState; // 头布局的状态
- private TextView tvLastUpdateTime; // 头布局的最后更新时间
- private OnRefreshListener mOnRefershListener;
- private boolean isScrollToBottom; // 是否滑动到底部
- private View footerView; // 脚布局的对象
- private int footerViewHeight; // 脚布局的高度
- private boolean isLoadingMore = false; // 是否正在加载更多中
- public RefreshListView(Context context, AttributeSet attrs) {
- super(context, attrs);
- initHeaderView();
- initFooterView();
- this.setOnScrollListener(this);
- }
- /**
- * 初始化脚布局
- */
- private void initFooterView() {
- footerView = View.inflate(getContext(), R.layout.listview_footer, null);
- footerView.measure(0, 0);
- footerViewHeight = footerView.getMeasuredHeight();
- footerView.setPadding(0, -footerViewHeight, 0, 0);
- this.addFooterView(footerView);
- }
- /**
- * 初始化头布局
- */
- private void initHeaderView() {
- headerView = View.inflate(getContext(), R.layout.listview_header, null);
- ivArrow = (ImageView) headerView
- .findViewById(R.id.iv_listview_header_arrow);
- mProgressBar = (ProgressBar) headerView
- .findViewById(R.id.pb_listview_header);
- tvState = (TextView) headerView
- .findViewById(R.id.tv_listview_header_state);
- tvLastUpdateTime = (TextView) headerView
- .findViewById(R.id.tv_listview_header_last_update_time);
- // 设置最后刷新时间
- tvLastUpdateTime.setText("最后刷新时间: " + getLastUpdateTime());
- headerView.measure(0, 0); // 系统会帮我们测量出headerView的高度
- headerViewHeight = headerView.getMeasuredHeight();
- headerView.setPadding(0, -headerViewHeight, 0, 0);
- this.addHeaderView(headerView); // 向ListView的顶部添加一个view对象
- initAnimation();
- }
- /**
- * 获得系统的最新时间
- *
- * @return
- */
- private String getLastUpdateTime() {
- SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
- return sdf.format(System.currentTimeMillis());
- }
- /**
- * 初始化动画
- */
- private void initAnimation() {
- upAnimation = new RotateAnimation(0f, -180f,
- Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
- 0.5f);
- upAnimation.setDuration(500);
- upAnimation.setFillAfter(true); // 动画结束后, 停留在结束的位置上
- downAnimation = new RotateAnimation(-180f, -360f,
- Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
- 0.5f);
- downAnimation.setDuration(500);
- downAnimation.setFillAfter(true); // 动画结束后, 停留在结束的位置上
- }
- @Override
- public boolean onTouchEvent(MotionEvent ev) {
- switch (ev.getAction()) {
- case MotionEvent.ACTION_DOWN :
- downY = (int) ev.getY();
- break;
- case MotionEvent.ACTION_MOVE :
- int moveY = (int) ev.getY();
- // 移动中的y - 按下的y = 间距.
- int diff = (moveY - downY) / 2;
- // -头布局的高度 + 间距 = paddingTop
- int paddingTop = -headerViewHeight + diff;
- // 如果: -头布局的高度 > paddingTop的值 执行super.onTouchEvent(ev);
- if (firstVisibleItemPosition == 0
- && -headerViewHeight < paddingTop) {
- if (paddingTop > 0 && currentState == DOWN_PULL_REFRESH) { // 完全显示了.
- Log.i(TAG, "松开刷新");
- currentState = RELEASE_REFRESH;
- refreshHeaderView();
- } else if (paddingTop < 0
- && currentState == RELEASE_REFRESH) { // 没有显示完全
- Log.i(TAG, "下拉刷新");
- currentState = DOWN_PULL_REFRESH;
- refreshHeaderView();
- }
- // 下拉头布局
- headerView.setPadding(0, paddingTop, 0, 0);
- return true;
- }
- break;
- case MotionEvent.ACTION_UP :
- // 判断当前的状态是松开刷新还是下拉刷新
- if (currentState == RELEASE_REFRESH) {
- Log.i(TAG, "刷新数据.");
- // 把头布局设置为完全显示状态
- headerView.setPadding(0, 0, 0, 0);
- // 进入到正在刷新中状态
- currentState = REFRESHING;
- refreshHeaderView();
- if (mOnRefershListener != null) {
- mOnRefershListener.onDownPullRefresh(); // 调用使用者的监听方法
- }
- } else if (currentState == DOWN_PULL_REFRESH) {
- // 隐藏头布局
- headerView.setPadding(0, -headerViewHeight, 0, 0);
- }
- break;
- default :
- break;
- }
- return super.onTouchEvent(ev);
- }
- /**
- * 根据currentState刷新头布局的状态
- */
- private void refreshHeaderView() {
- switch (currentState) {
- case DOWN_PULL_REFRESH : // 下拉刷新状态
- tvState.setText("下拉刷新");
- ivArrow.startAnimation(downAnimation); // 执行向下旋转
- break;
- case RELEASE_REFRESH : // 松开刷新状态
- tvState.setText("松开刷新");
- ivArrow.startAnimation(upAnimation); // 执行向上旋转
- break;
- case REFRESHING : // 正在刷新中状态
- ivArrow.clearAnimation();
- ivArrow.setVisibility(View.GONE);
- mProgressBar.setVisibility(View.VISIBLE);
- tvState.setText("正在刷新中...");
- break;
- default :
- break;
- }
- }
- /**
- * 当滚动状态改变时回调
- */
- @Override
- public void onScrollStateChanged(AbsListView view, int scrollState) {
- if (scrollState == SCROLL_STATE_IDLE
- || scrollState == SCROLL_STATE_FLING) {
- // 判断当前是否已经到了底部
- if (isScrollToBottom && !isLoadingMore) {
- isLoadingMore = true;
- // 当前到底部
- Log.i(TAG, "加载更多数据");
- footerView.setPadding(0, 0, 0, 0);
- this.setSelection(this.getCount());
- if (mOnRefershListener != null) {
- mOnRefershListener.onLoadingMore();
- }
- }
- }
- }
- /**
- * 当滚动时调用
- *
- * @param firstVisibleItem
- * 当前屏幕显示在顶部的item的position
- * @param visibleItemCount
- * 当前屏幕显示了多少个条目的总数
- * @param totalItemCount
- * ListView的总条目的总数
- */
- @Override
- public void onScroll(AbsListView view, int firstVisibleItem,
- int visibleItemCount, int totalItemCount) {
- firstVisibleItemPosition = firstVisibleItem;
- if (getLastVisiblePosition() == (totalItemCount - 1)) {
- isScrollToBottom = true;
- } else {
- isScrollToBottom = false;
- }
- }
- /**
- * 设置刷新监听事件
- *
- * @param listener
- */
- public void setOnRefreshListener(OnRefreshListener listener) {
- mOnRefershListener = listener;
- }
- /**
- * 隐藏头布局
- */
- public void hideHeaderView() {
- headerView.setPadding(0, -headerViewHeight, 0, 0);
- ivArrow.setVisibility(View.VISIBLE);
- mProgressBar.setVisibility(View.GONE);
- tvState.setText("下拉刷新");
- tvLastUpdateTime.setText("最后刷新时间: " + getLastUpdateTime());
- currentState = DOWN_PULL_REFRESH;
- }
- /**
- * 隐藏脚布局
- */
- public void hideFooterView() {
- footerView.setPadding(0, -footerViewHeight, 0, 0);
- isLoadingMore = false;
- }
- }
4.为ListView添加回调函数
- public interface OnRefreshListener {
- /**
- * 下拉刷新
- */
- void onDownPullRefresh();
- /**
- * 上拉加载更多
- */
- void onLoadingMore();
- }
- public void setOnRefreshListener(OnRefreshListener listener) {
- mOnRefershListener = listener;
- }
5.使用这个自定义的ListView
- public class MainActivity extends Activity implements OnRefreshListener {
- private List<String> textList;
- private MyAdapter adapter;
- private RefreshListView rListView;
- @Override
- protected void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.activity_main);
- rListView = (RefreshListView) findViewById(R.id.refreshlistview);
- textList = new ArrayList<String>();
- for (int i = 0; i < 25; i++) {
- textList.add("这是一条ListView的数据" + i);
- }
- adapter = new MyAdapter();
- rListView.setAdapter(adapter);
- rListView.setOnRefreshListener(this);
- }
- private class MyAdapter extends BaseAdapter {
- @Override
- public int getCount() {
- // TODO Auto-generated method stub
- return textList.size();
- }
- @Override
- public Object getItem(int position) {
- // TODO Auto-generated method stub
- return textList.get(position);
- }
- @Override
- public long getItemId(int position) {
- // TODO Auto-generated method stub
- return position;
- }
- @Override
- public View getView(int position, View convertView, ViewGroup parent) {
- // TODO Auto-generated method stub
- TextView textView = new TextView(MainActivity.this);
- textView.setText(textList.get(position));
- textView.setTextColor(Color.WHITE);
- textView.setTextSize(18.0f);
- return textView;
- }
- }
- @Override
- public void onDownPullRefresh() {
- new AsyncTask<Void, Void, Void>() {
- @Override
- protected Void doInBackground(Void... params) {
- SystemClock.sleep(2000);
- for (int i = 0; i < 2; i++) {
- textList.add(0, "这是下拉刷新出来的数据" + i);
- }
- return null;
- }
- @Override
- protected void onPostExecute(Void result) {
- adapter.notifyDataSetChanged();
- rListView.hideHeaderView();
- }
- }.execute(new Void[]{});
- }
- @Override
- public void onLoadingMore() {
- new AsyncTask<Void, Void, Void>() {
- @Override
- protected Void doInBackground(Void... params) {
- SystemClock.sleep(5000);
- textList.add("这是加载更多出来的数据1");
- textList.add("这是加载更多出来的数据2");
- textList.add("这是加载更多出来的数据3");
- return null;
- }
- @Override
- protected void onPostExecute(Void result) {
- adapter.notifyDataSetChanged();
- // 控制脚布局隐藏
- rListView.hideFooterView();
- }
- }.execute(new Void[]{});
- }
- }
6.AsyncTask简单介绍
- public abstract class AsyncTask<Params, Progress, Result> {
三种泛型类型分别代表
Params :“启动任务执行的输入参数”,Progress:“后台任务执行的进度”,Result:“后台计算结果的类型”。在特定场合下,并不是所有类型都被使用,如果没有被使用,可以用java.lang.Void类型代替。
一个异步任务的执行一般包括以下几个步骤:
1.execute(Params... params),执行一个异步任务,需要我们在代码中调用此方法,触发异步任务的执行。
2.onPreExecute(),在execute(Params... params)被调用后立即执行,一般用来在执行后台任务前对UI做一些标记。
3.doInBackground(Params... params),在onPreExecute()完成后立即执行,用于执行较为费时的操作,此方法将接收输入参数和返回计算结果。在执行过程中可以调用publishProgress(Progress... values)来更新进度信息。
4.onProgressUpdate(Progress... values),在调用publishProgress(Progress... values)时,此方法被执行,直接将进度信息更新到UI组件上。
5.onPostExecute(Result result),当后台操作结束时,此方法将会被调用,计算结果将做为参数传递到此方法中,直接将结果显示到UI组件上。