效果图：

第一步：编写需要在ListView中增加头加载的布局文件，与底部加载的布局文件：

头布局文件：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="wrap_content"
  5.     android:orientation="horizontal" >
  6.  
  7.     <FrameLayout
  8.         android:layout_width="wrap_content"
  9.         android:layout_height="wrap_content"
  10.         android:layout_margin="10dip" >
  11.  
  12.         <ImageView
  13.             android:id="@+id/iv_listview_header_arrow"
  14.             android:layout_width="wrap_content"
  15.             android:layout_height="wrap_content"
  16.             android:layout_gravity="center"
  17.             android:src="@mipmap/common_listview_headview_red_arrow" />
  18.  
  19.         <ProgressBar
  20.             android:id="@+id/pb_listview_header"
  21.             android:layout_width="wrap_content"
  22.             android:layout_height="wrap_content"
  23.             android:layout_gravity="center"
  24.             android:indeterminateDrawable="@drawable/custom_progressbar"
  25.             android:visibility="invisible" />
  26.     </FrameLayout>
  27.  
  28.     <LinearLayout
  29.         android:layout_width="fill_parent"
  30.         android:layout_height="wrap_content"
  31.         android:layout_gravity="center_vertical"
  32.         android:gravity="center_horizontal"
  33.         android:orientation="vertical" >
  34.  
  35.         <TextView
  36.             android:id="@+id/tv_listview_header_state"
  37.             android:layout_width="wrap_content"
  38.             android:layout_height="wrap_content"
  39.             android:text="下拉刷新"
  40.             android:textColor="#FF0000"
  41.             android:textSize="18sp" />
  42.  
  43.         <TextView
  44.             android:id="@+id/tv_listview_header_last_update_time"
  45.             android:layout_width="wrap_content"
  46.             android:layout_height="wrap_content"
  47.             android:layout_marginTop="5dip"
  48.             android:text="最后刷新时间: 1990-09-09 09:09:09"
  49.             android:textColor="@android:color/darker_gray"
  50.             android:textSize="14sp" />
  51.     </LinearLayout>
  52.  
  53. </LinearLayout>

底部布局文件：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout
  3.     xmlns:android="http://schemas.android.com/apk/res/android"
  4.     android:orientation="vertical"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent">
  7.  
  8.     <LinearLayout
  9.         android:layout_width="wrap_content"
  10.         android:layout_height="wrap_content"
  11.         android:orientation="horizontal"
  12.         android:layout_centerInParent="true"
  13.         android:gravity="center_vertical">
  14.  
  15.         <ProgressBar
  16.             android:layout_width="wrap_content"
  17.             android:layout_height="wrap_content"
  18.             android:indeterminateDrawable="@drawable/custom_progressbar"
  19.             />
  20.  
  21.         <TextView
  22.             android:id="@+id/tv_bottom_state"
  23.             android:layout_width="wrap_content"
  24.             android:layout_height="wrap_content"
  25.             android:text="加载更多"
  26.             android:layout_marginLeft="10dp"/>
  27.  
  28.     </LinearLayout>
  29.  
  30. </RelativeLayout>

自定义ListView需要的接口回调给UI，告诉UI ListView执行了下拉加载/上拉加载动作

  1. public interface ICustomUpdateListViewBack {
  2.  
  3.     public void downUpdateListData();
  4.  
  5.     public void upUpdateListData();
  6.  
  7. }

自定义ListView：

  1. public class CustomUpdateListView extends ListView implements AbsListView.OnScrollListener{
  2.  
  3.     private static final String TAG = CustomUpdateListView.class.getSimpleName();
  4.  
  5.     /**
  6.      * 下拉刷新
  7.      */
  8.     private static final int DOWN_UPDATE = 111;
  9.  
  10.     /**
  11.      * 准备刷新
  12.      */
  13.     private static final int PLAN_UPDATE = 112;
  14.  
  15.     /**
  16.      * 正在刷新
  17.      */
  18.     private static final int PROCESS_UPDATE = 113;
  19.  
  20.     private int thisUpdateStatusValue = DOWN_UPDATE; // 默认一直是下拉刷新
  21.  
  22.     public CustomUpdateListView(Context context, AttributeSet attrs) {
  23.         super(context, attrs);
  24.  
  25.         setOnScrollListener(this);
  26.  
  27.         initHeader();
  28.         initBottom();
  29.     }
  30.  
  31.     /**
  32.      * 定义头部相关
  33.      */
  34.     private View headerView;
  35.     private int headerViewHeight;
  36.  
  37.     private ImageView ivHeaderArrow;
  38.     private ProgressBar pbHeader;
  39.     private TextView tvHeaderState;
  40.     private TextView tvHeaderLastUpdateTime;
  41.  
  42.     /**
  43.      * 定义底部相关
  44.      */
  45.     private View bottomView;
  46.     private int bottomViewHeight;
  47.     private TextView tvBottomState;
  48.     /**
  49.      * 初始化头部 布局View相关
  50.      */
  51.     private void initHeader() {
  52.         // 从布局中拿到一个View
  53.         headerView = View.inflate(getContext(), R.layout.listview_header, null);
  54.  
  55.         // 获取头部各个控件的值
  56.         ivHeaderArrow = headerView.findViewById(R.id.iv_listview_header_arrow);
  57.         pbHeader = headerView.findViewById(R.id.pb_listview_header);
  58.         tvHeaderState = headerView.findViewById(R.id.tv_listview_header_state);
  59.         tvHeaderLastUpdateTime = headerView.findViewById(R.id.tv_listview_header_last_update_time);
  60.  
  61.         tvHeaderLastUpdateTime.setText(getThisTiem());
  62.  
  63.         // getHieight(); 方法只能获取到控件显示后的高度
  64.         // int headerViewHeight = headerView.getHeight();
  65.         // 结果 headerViewHeight: 0
  66.  
  67.         // View的绘制流程：测量 onLayout onDraw
  68.  
  69.         // 所以先测量后，就能得到测量后的高度了
  70.         headerView.measure(0, 0); // 注意：传0系统会自动去测量View高度
  71.  
  72.         // 得到测量后的高度
  73.         headerViewHeight = headerView.getMeasuredHeight();
  74.         Log.i(TAG, "headerViewHeight:" + headerViewHeight);
  75.  
  76.         headerView.setPadding(0, -headerViewHeight, 0 ,0);
  77.  
  78.         addHeaderView(headerView);
  79.  
  80.         initHeaderAnimation();
  81.     }
  82.  
  83.     private void initBottom() {
  84.         bottomView = View.inflate(getContext(), R.layout.listview_bottom, null);
  85.  
  86.         tvBottomState = bottomView.findViewById(R.id.tv_bottom_state);
  87.  
  88.         // 先测量
  89.         bottomView.measure(0, 0);
  90.  
  91.         // 获取高度
  92.         bottomViewHeight = bottomView.getMeasuredHeight();
  93.  
  94.         bottomView.setPadding(0, -bottomViewHeight, 0, 0);
  95.  
  96.         addFooterView(bottomView);
  97.  
  98.     }
  99.  
  100.     private RotateAnimation upRotateAnimation;
  101.     private RotateAnimation downRotateAnimation;
  102.  
  103.     private void initHeaderAnimation() {
  104.         upRotateAnimation = new RotateAnimation(
  105.                 0, 180,
  106.                 Animation.RELATIVE_TO_SELF, 0.5f,
  107.                 Animation.RELATIVE_TO_SELF, 0.5f);
  108.         upRotateAnimation.setDuration(500);
  109.         upRotateAnimation.setFillAfter(true);
  110.  
  111.         downRotateAnimation = new RotateAnimation(
  112.                 180, 360,
  113.                 Animation.RELATIVE_TO_SELF, 0.5f,
  114.                 Animation.RELATIVE_TO_SELF, 0.5f);
  115.         downRotateAnimation.setDuration(500);
  116.         downRotateAnimation.setFillAfter(true);
  117.     }
  118.  
  119.     /**
  120.      * 滑动的状态改变
  121.      * @param view
  122.      * @param scrollState 有三种状态
  123.      *                    SCROLL_STATE_IDLE 代表 滑动停止状态类似于手指松开UP
  124.      *                    SCROLL_STATE_TOUCH_SCROLL 代表滑动触摸状态
  125.      *                    SCROLL_STATE_FLING 快速滑动 猛的一滑
  126.      */
  127.     @Override
  128.     public void onScrollStateChanged(AbsListView view, int scrollState) {
  129.         // 如果是猛地滑动 或者 手指松开UP 才显示底部布局View
  130.         if (scrollState == SCROLL_STATE_IDLE || scrollState == SCROLL_STATE_FLING) {
  131.             // 判断必须是底部的Item的时候
  132.             if (getLastVisiblePosition() == (getCount() -1)) {
  133.                 bottomView.setPadding(0, 0, 0, 0);
  134.  
  135.                 // 回调接口方法
  136.                 if (null != customUpdateListViewBack) {
  137.                     customUpdateListViewBack.upUpdateListData();
  138.                 }
  139.             }
  140.         }
  141.     }
  142.  
  143.     private int firstVisibleItem;
  144.  
  145.     /**
  146.      * ListView滑动的监听方法
  147.      * @param view 当前ListView
  148.      * @param firstVisibleItem 当前屏幕的第一个显示的Item
  149.      * @param visibleItemCount 当前屏幕显示的Item数量
  150.      * @param totalItemCount 总共Item数量
  151.      */
  152.     @Override
  153.     public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
  154.         this.firstVisibleItem = firstVisibleItem;
  155.     }
  156.  
  157.     private int downY;
  158.  
  159.     @Override
  160.     public boolean onTouchEvent(MotionEvent ev) {
  161.         switch (ev.getAction()) {
  162.             case MotionEvent.ACTION_DOWN:
  163.                 downY = (int) ev.getY();
  164.                 break;
  165.             case MotionEvent.ACTION_UP:
  166.                 if (thisUpdateStatusValue == DOWN_UPDATE) {
  167.                     headerView.setPadding(0, -headerViewHeight ,0 ,0);
  168.                 } else {
  169.                     headerView.setPadding(0, 0, 0, 0);
  170.                     thisUpdateStatusValue = PROCESS_UPDATE;
  171.                     updateHeaderState();
  172.                 }
  173.                 break;
  174.             case MotionEvent.ACTION_MOVE:
  175.                 int cha = (int) ev.getY() - downY;
  176.                 if (this.firstVisibleItem == 0 && cha > 0) {
  177.                     int paddingTop = -headerViewHeight + cha;
  178.                     // Log.i(TAG, "paddingTop:" + paddingTop);
  179.  
  180.                     if (thisUpdateStatusValue == PROCESS_UPDATE) {
  181.                         break;
  182.                     }
  183.  
  184.                     if (paddingTop > 0 && thisUpdateStatusValue == DOWN_UPDATE) {
  185.                         // 准备刷新
  186.                         Log.i(TAG, "paddingTop:" + paddingTop + ">>>准备刷新");
  187.                         thisUpdateStatusValue = PLAN_UPDATE;
  188.  
  189.                         updateHeaderState();
  190.  
  191.                     } else if (paddingTop < 0 && thisUpdateStatusValue == PLAN_UPDATE) {
  192.                         // 正在刷新
  193.                         Log.i(TAG, "paddingTop:" + paddingTop + ">>>正在刷新");
  194.                         thisUpdateStatusValue = DOWN_UPDATE;
  195.  
  196.                         updateHeaderState();
  197.                     }
  198.  
  199.                     headerView.setPadding(0, paddingTop, 0, 0);
  200.                 }
  201.                 break;
  202.             default:
  203.                 break;
  204.         }
  205.         return super.onTouchEvent(ev); // 不返回ture 而是去调用父类的方法，是保证ListView自身的滑动功能正常
  206.     }
  207.  
  208.     private void updateHeaderState() {
  209.  
  210.         switch (thisUpdateStatusValue) {
  211.             case DOWN_UPDATE:
  212.                 ivHeaderArrow.startAnimation(downRotateAnimation);
  213.                 tvHeaderState.setText("下拉刷新");
  214.                 break;
  215.             case PLAN_UPDATE:
  216.                 ivHeaderArrow.startAnimation(upRotateAnimation);
  217.                 tvHeaderState.setText("准备刷新");
  218.                 break;
  219.             case PROCESS_UPDATE:
  220.                 ivHeaderArrow.setVisibility(INVISIBLE);
  221.                 ivHeaderArrow.clearAnimation();
  222.                 pbHeader.setVisibility(VISIBLE);
  223.                 tvHeaderState.setText("正在刷新中...");
  224.  
  225.                 if (null != customUpdateListViewBack) {
  226.                     customUpdateListViewBack.downUpdateListData();
  227.                 }
  228.                 break;
  229.             default:
  230.                 break;
  231.         }
  232.     }
  233.  
  234.     private ICustomUpdateListViewBack customUpdateListViewBack;
  235.  
  236.     public void setCallback(ICustomUpdateListViewBack back) {
  237.         this.customUpdateListViewBack = back;
  238.     }
  239.  
  240.     public void updateHeaderResult() {
  241.         headerView.setPadding(0, -headerViewHeight, 0, 0);
  242.  
  243.         // 状态还原
  244.         ivHeaderArrow.clearAnimation();
  245.         tvHeaderState.setText("下拉刷新");
  246.  
  247.         ivHeaderArrow.setVisibility(VISIBLE);
  248.         pbHeader.setVisibility(INVISIBLE);
  249.  
  250.         tvHeaderLastUpdateTime.setText(getThisTiem());
  251.  
  252.         thisUpdateStatusValue = DOWN_UPDATE;
  253.     }
  254.  
  255.     private String getThisTiem() {
  256.         SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy年MM月dd日 HH:mm:ss");// HH:mm:ss
  257.         // 获取当前时间
  258.         Date date = new Date(System.currentTimeMillis());
  259.         return simpleDateFormat.format(date);
  260.     }
  261.  
  262.     public void updateBottomResult() {
  263.         /*tvBottomState.setText("加载成功");
  264.         tvBottomState.setTextColor(Color.GREEN);*/
  265.  
  266.         new android.os.Handler().postDelayed(new Runnable() {
  267.             @Override
  268.             public void run() {
  269.                 bottomView.setPadding(0, -bottomViewHeight, 0, 0);
  270.             }
  271.         }, 2000);
  272.     }
  273. }

把ProgressBar的风格修改，从白色演变成红色的形式

custom_progressbar.xml 文件：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <rotate xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:fromDegrees="0"
  4.     android:pivotX="50%"
  5.     android:pivotY="50%"
  6.     android:toDegrees="360" >
  7.  
  8.     <shape
  9.         android:innerRadiusRatio="3"
  10.         android:shape="ring"
  11.         android:thicknessRatio="10"
  12.         android:useLevel="false" >
  13.         <gradient
  14.             android:centerColor="#FF6A6A"
  15.             android:endColor="#FF0000"
  16.             android:startColor="#FFFFFF"
  17.             android:type="sweep" />
  18.     </shape>
  19.  
  20. </rotate>

如何使用自定义的ListView：

  1.     <heima.custom.CustomUpdateListView
  2.         android:id="@+id/custom_listview"
  3.         android:layout_width="match_parent"
  4.         android:layout_height="match_parent"
  5.         android:layout_below="@id/ll">
  6.     </heima.custom.CustomUpdateListView>

当把数据查询出来后，执行：

  1. listView.updateHeaderResult(); // 更新头部布局复原
  1. listView.updateBottomResult(); // 更新底部布局复原
  1. listView.setCallback(new ICustomUpdateListViewBack() {
  2.             @Override
  3.             public void downUpdateListData() {
  4.                 new AsyncTask<Void, Void, Void>() {
  5.  
  6.                     @Override
  7.                     protected Void doInBackground(Void... voids) {
  8.                         SystemClock.sleep(3000);
  9.                         mData.add(0, "1最新加载出来的数据");
  10.                         mData.add(1, "2最新加载出来的数据");
  11.                         mData.add(2, "3最新加载出来的数据");
  12.                         mData.add(3, "4最新加载出来的数据");
  13.                         mData.add(4, "5最新加载出来的数据");
  14.                         mData.add(5, "6最新加载出来的数据");
  15.                         return null;
  16.                     }
  17.  
  18.                     @Override
  19.                     protected void onPostExecute(Void aVoid) {
  20.                         // super.onPostExecute(aVoid);
  21.                         adapter.notifyDataSetChanged();
  22.                         listView.updateHeaderResult();
  23.                     }
  24.                 }.execute(new Void[]{});
  25.             }
  26.  
  27.             @Override
  28.             public void upUpdateListData() {
  29.                 new AsyncTask<Void, Void, Void>() {
  30.  
  31.                     @Override
  32.                     protected Void doInBackground(Void... voids) {
  33.                         SystemClock.sleep(6000);
  34.                         mData.add("1commonlibrary");
  35.                         mData.add("2commonlibrary");
  36.                         mData.add("3commonlibrary");
  37.                         mData.add("4commonlibrary");
  38.                         mData.add("5commonlibrary");
  39.                         mData.add("6commonlibrary");
  40.                         return null;
  41.                     }
  42.  
  43.                     @Override
  44.                     protected void onPostExecute(Void aVoid) {
  45.                         // super.onPostExecute(aVoid);
  46.                         adapter.notifyDataSetChanged();
  47.                         listView.updateBottomResult();
  48.                     }
  49.                 }.execute(new Void[]{});
  50.             }
  51.         });
  1.  

Android-自定义ListView下拉刷新与上拉加载的更多相关文章

  1. Android如何定制一个下拉刷新，上滑加载更多的容器

    前言 下拉刷新和上滑加载更多,是一种比较常用的列表数据交互方式. android提供了原生的下拉刷新容器 SwipeRefreshLayout,可惜样式不能定制. 于是打算自己实现一个专用的.但是下拉 ...

  2. Android之下拉刷新，上啦加载的实现（一）

    转载地址http://blog.csdn.net/leehong2005/article/details/12567757#t5 前段时间项目中用到了下拉刷新功能,之前在网上也找到过类似的demo,但 ...

  3. 【Android - 自定义View】之自定义可下拉刷新或上拉加载的ListView

    首先来介绍一下这个自定义View: (1)这个自定义View的名称叫做 RefreshableListView ,继承自ListView类: (2)在这个自定义View中,用户可以设置是否支持下拉刷新 ...

  4. Android打造(ListView、GridView等)通用的下拉刷新、上拉自动加载的组件

    原文 http://blog.csdn.net/bboyfeiyu/article/details/39253051       前言 下 拉刷新组件在开发中使用率是非常高的,基本上联网的APP都会采 ...

  5. android ListView的上部下拉刷新下部点击加载更多具体实现及拓展

    android ListView的上部下拉刷新下部点击加载更多具体实现及拓展 ListView下拉刷新,上拉自动加载更多 下拉刷新以及加载更多

  6. ListView下拉刷新、上拉载入更多之封装改进

    在Android中ListView下拉刷新.上拉载入更多示例一文中,Maxwin兄给出的控件比较强大,前面有详细介绍,但是有个不足就是,里面使用了一些资源文件,包括图片,String,layout,这 ...

  7. Android XListView下拉刷新、上拉载入更多

    source code: https://github.com/Maxwin-z/XListView-Android 提供了两个接口: a) IXListViewListener:  触发下拉刷新.上 ...

  8. Android 自定义 ListView 上下拉动“刷新最新”和“加载更多”歌曲列表

    本文内容 环境 测试数据 项目结构 演示 参考资料 本文演示,上拉刷新最新的歌曲列表,和下拉加载更多的歌曲列表.所谓"刷新最新"和"加载更多"是指日期.演示代码 ...

  9. DCloud-MUI：下拉刷新、上拉加载

    ylbtech-DCloud-MUI:下拉刷新.上拉加载 1. 下拉刷新返回顶部 0. http://dev.dcloud.net.cn/mui/pulldown/ 1. 概述 为实现下拉刷新功能,大 ...

  10. RN-第三方之react-native-pull 下拉刷新、上拉加载

    有一个很好的下拉刷新.上拉加载库:react-native-pull地址:https://github.com/greatbsky/react-native-pull-demo 使用 import { ...

随机推荐

  1. powerdns

    powerdns http://bbs.51cto.com/thread-880297-1.html https://blog.csdn.net/kepa520/article/details/791 ...

  2. 在制MO未取到FP2

    描述:工单被过滤掉 IN_SFCHEADER表数据被删除掉 备份表监控可见数据是有写入IN_SFCHEADER表 删除前会将数据写入IN_SFCHEADER_TEMP表,发现物料编码是带了一个尾续CZ ...

  3. ORACLE 对一个表进行循环查数，再根据MO供给数量写入另一个新表

    一. 加工处理后要变成如下效果 create table test1 (sonum varchar2(10),lineid varchar2(10),qty int ,qty2 int ,remark ...

  4. IIS7配置下载apk以及目录浏览

    IIS7为了增加安全性,如果需要禁止目录浏览.只需要按下面的步骤执行就可以 1.选择站点:2.选择功能视图:3.选择IIS下面的目录浏览:4.在右上角的操作中选择“打开功能”:5.选择右边的禁用. 今 ...

  5. Ubuntu 16.04安装Git及GUI客户端

    1.通过APT源安装Git命令行工具 这里不建议通过源码进行安装,增加复杂程度,且最新版本的Git在各个方面都会修复,不至于出现不能用的状态. sudo add-apt-repository ppa: ...

  6. AdmBaseController 判断是否登录

    代码 using Service.IService; using System; using System.Collections.Generic; using System.Linq; using ...

  7. DirectFB编程

    一.简介 DirectFB是一个轻量级的提供硬件图形加速,输入设备处理和抽象的图形库,它集成了支持半透明的视窗系统以及在LinuxFramebuffer驱动之上的多层显示.它是一个用软件封装当前硬件无 ...

  8. EXPAT(XML解析库)

    一.简介 expat是一个由C语言编写的XML解析库.James Clark创建了这个库,现在是制定XML标准的W3组织的技术leader.现在的版本是2.0.2.0开始就由Clark Cooper领 ...

  9. MyIocp 测试截图

    根据 小猪的网络教程 学习了 IOCP 并且自己写了一个命令行版本的 客户端测试还是使用的小猪的代码 有兴趣学习IOCP的 建议去小猪的空间看看 代码思路都讲解的很清楚 推荐 http://blog. ...

  10. 换行符在HTML中直接替换为<br>

         #set($text=$!obj.getMeasure().replaceAll("\r\n","<br>"))     <td a ...