zoukankan      html  css  js  c++  java
  • google官方的下拉刷新+自定义上拉加载更多

    转载请标注转载:http://blog.csdn.net/oqihaogongyuan/article/details/50949118        

      google官方的下拉刷新+自定义上拉加载更多   

         现在很多app都是使用的自定义的下拉刷新上拉加载更多,然而google官方为我们提供了下拉刷新操作,我在之前的博客中有撰文针对

      自定义下拉刷新操作并提供源码下载 传送门    自定义下拉刷新及上拉加载更多

      google官方的下拉刷新 传送门       google官方的下拉刷新组件的详细介绍及示例下载

    google官方为我们提供了下拉刷新,我们自己增加自定义的上拉加载更多,这样相互结合使用,就出现了一款新的下拉刷新和上拉加载更多的组件,非常推荐在app中增加这中效果。先来看看效果如何,如下gif图,是不是给人耳目一新的感觉呢,最下面提供示例代码供下载学习。

     

    1、自定义listView,因为google为我们提供能下拉刷新的组件

    [html] view plain copy
     在CODE上查看代码片派生到我的代码片
    1. android.support.v4.widget.SwipeRefreshLayout  

       因此我们只需要为自定的listView添加上拉“ 加载更多 ”的功能。

    自定义上拉加载更多的listView代码如下:

    [java] view plain copy
     在CODE上查看代码片派生到我的代码片
    1. package com.example.myfirst.pulltorefreshlist;  
    2.   
    3. import android.content.Context;  
    4. import android.util.AttributeSet;  
    5. import android.view.View;  
    6. import android.widget.AbsListView;  
    7. import android.widget.ListView;  
    8.   
    9. /** 
    10.  * 上拉加载更多的listView,配合Google官方的下拉刷新使用 
    11.  * Created by chengguo on 2016/3/21. 
    12.  */  
    13. public class LoadMoreListView extends ListView implements AbsListView.OnScrollListener {  
    14.   
    15.   
    16.     private static final String TAG = "RefreshListView";  
    17.     /** 
    18.      * 底部加载更多部分 
    19.      */  
    20.     private boolean isScrollToBottom;//判断是不是滑到了底部  
    21.     private View footerView; //底部的footer   view  
    22.     private int footerViewHeight; //底部view的高度  
    23.     private boolean isLoadingMore = false; //判断是不是"加载更多"  
    24.   
    25.     /** 
    26.      * listview的接口,监听listview的下来刷新和上拉加载更多 
    27.      */  
    28.     private OnRefreshListener mOnRefreshListener;  
    29.   
    30.   
    31.     public LoadMoreListView(Context context) {  
    32.         super(context);  
    33.     }  
    34.   
    35.     public LoadMoreListView(Context context, AttributeSet attrs) {  
    36.         super(context, attrs);  
    37.         initFooterView();  
    38.         this.setOnScrollListener(this);  
    39.     }  
    40.   
    41.   
    42.     /** 
    43.      * 初始化底部view 
    44.      */  
    45.     private void initFooterView() {  
    46.         footerView = View.inflate(getContext(), R.layout.footer_layout, null);  
    47.         //设置(0,0)以便系统测量footerView的宽高  
    48.         footerView.measure(0, 0);  
    49.         footerViewHeight = footerView.getMeasuredHeight();  
    50.         footerView.setPadding(0, -footerViewHeight, 0, 0);  
    51.         this.addFooterView(footerView);  
    52.     }  
    53.   
    54.     /** 
    55.      * 监听listview滚动的状态变化,如果滑到了底部,就“加载更多..." 
    56.      */  
    57.     @Override  
    58.     public void onScrollStateChanged(AbsListView view, int scrollState) {  
    59.   
    60.         if (scrollState == SCROLL_STATE_IDLE || scrollState == SCROLL_STATE_FLING) {  
    61.             if (isScrollToBottom && !isLoadingMore) {  
    62.                 isLoadingMore = true;  
    63.                 footerView.setPadding(0, 0, 0, 0);  
    64.                 this.setSelection(this.getCount());  
    65.   
    66.                 if (mOnRefreshListener != null) {  
    67.                     mOnRefreshListener.onLoadingMore();  
    68.                 }  
    69.             }  
    70.         }  
    71.     }  
    72.   
    73.     /** 
    74.      * 监听listview滚动的状态变化,判断当前是不是滑到了底部 
    75.      * 
    76.      * @param view 
    77.      * @param firstVisibleItem 
    78.      * @param visibleItemCount 
    79.      * @param totalItemCount 
    80.      */  
    81.     @Override  
    82.     public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {  
    83.         if (getLastVisiblePosition() == (totalItemCount - 1)) {  
    84.             isScrollToBottom = true;  
    85.         } else {  
    86.             isScrollToBottom = false;  
    87.         }  
    88.   
    89.     }  
    90.   
    91.     /** 
    92.      * 设置监听接口,当为 
    93.      * 
    94.      * @param listener 
    95.      */  
    96.     public void setOnRefreshListener(OnRefreshListener listener) {  
    97.         mOnRefreshListener = listener;  
    98.     }  
    99.   
    100.   
    101.     /** 
    102.      * 为外界提供的方法,当Activity中的加载更多数据加载完后,就调用这个方法来隐藏底部的footerView 
    103.      */  
    104.     public void loadMoreComplete() {  
    105.         footerView.setPadding(0, -footerViewHeight, 0, 0);  
    106.         isLoadingMore = false;  
    107.     }  
    108.   
    109.     /** 
    110.      * 设置接口,供外界实现,监听listview的刷新和加载更多的状态 
    111.      */  
    112.     public interface OnRefreshListener {  
    113.         /** 
    114.          * 上拉加载更多 
    115.          */  
    116.         void onLoadingMore();  
    117.     }  
    118. }  

      2、activity的layout.xml文件如下:

    [html] view plain copy
     在CODE上查看代码片派生到我的代码片
    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="match_parent"  
    5.     android:orientation="vertical">  
    6.   
    7.     <android.support.v4.widget.SwipeRefreshLayout  
    8.         android:id="@+id/swipe_google_and_loadmore_refresh_layout"  
    9.         android:layout_width="match_parent"  
    10.         android:layout_height="match_parent">  
    11.   
    12.         <com.example.myfirst.pulltorefreshlist.LoadMoreListView  
    13.             android:id="@+id/google_and_loadmore_refresh_listview"  
    14.             android:layout_width="match_parent"  
    15.             android:layout_height="match_parent">  
    16.   
    17.         </com.example.myfirst.pulltorefreshlist.LoadMoreListView>  
    18.   
    19.     </android.support.v4.widget.SwipeRefreshLayout>  
    20. </LinearLayout>  

        

        3、主activity的代码如下,也有非常详细的代码注释,非常简单,这样一款google下拉刷新+自定义上拉加载更多就诞生了。

    [java] view plain copy
     在CODE上查看代码片派生到我的代码片
    1. package com.example.myfirst.pulltorefreshlist;  
    2.   
    3. import android.app.Activity;  
    4. import android.os.Bundle;  
    5. import android.os.Handler;  
    6. import android.support.v4.widget.SwipeRefreshLayout;  
    7.   
    8. import java.util.ArrayList;  
    9.   
    10. /** 
    11.  * google下拉刷新和自定义上拉加载更多的activity 
    12.  * Created by chengguo on 2016/3/21. 
    13.  */  
    14. public class GoogleAndLoadMoreActivity extends Activity implements SwipeRefreshLayout.OnRefreshListener, LoadMoreListView.OnRefreshListener {  
    15.     private SwipeRefreshLayout swipeRefreshLayout;  
    16.     private LoadMoreListView loadMoreListView;  
    17.     //对象数据集合  
    18.     private ArrayList<ListViewItem> items;  
    19.     //listview的数据加载器adapter  
    20.     private RefreshListAdapter adapter;  
    21.   
    22.     @Override  
    23.     protected void onCreate(Bundle savedInstanceState) {  
    24.         super.onCreate(savedInstanceState);  
    25.         setContentView(R.layout.google_and_loadmor_refreshing_aty);  
    26.   
    27.         initView();  
    28.         initEvent();  
    29.         initData();  
    30.     }  
    31.   
    32.     /** 
    33.      * 初始化列表数据 
    34.      */  
    35.     private void initData() {  
    36.         items = new ArrayList<ListViewItem>();  
    37.   
    38.         //这里只是模拟10个列表项数据,在现实开发中,listview中的数据都是从服务器获取的。  
    39.         for (int i = 0; i < 10; i++) {  
    40.             ListViewItem item = new ListViewItem();  
    41.             item.setUserImg(R.mipmap.ic_launcher);  
    42.             item.setUserName("seven" + i);  
    43.             item.setUserComment("这是google官方一个下拉刷新ListView+自定义ListView上拉加载跟多");  
    44.             items.add(item);  
    45.         }  
    46.   
    47.         //为listview配置adapter  
    48.         adapter = new RefreshListAdapter(GoogleAndLoadMoreActivity.this, items);  
    49.         loadMoreListView.setAdapter(adapter);  
    50.     }  
    51.   
    52.     /** 
    53.      * 给控件添加事件 
    54.      */  
    55.     private void initEvent() {  
    56.         swipeRefreshLayout.setOnRefreshListener(this);  
    57.   
    58.         //设置圆圈进度条的背景颜色  
    59. //        swipeRefreshLayout.setProgressBackgroundColorSchemeColor(  
    60. //                getResources().getColor(R.color.colorPrimary));  
    61.   
    62.         //设置进度条变化的颜色  
    63.         swipeRefreshLayout.setColorSchemeResources(  
    64.                 R.color.firstColor,  
    65.                 R.color.secondColor,  
    66.                 R.color.thirdColor,  
    67.                 R.color.forthColor);  
    68.     }  
    69.   
    70.     /** 
    71.      * 初始化界面控件 
    72.      */  
    73.     private void initView() {  
    74.         swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipe_google_and_loadmore_refresh_layout);  
    75.         loadMoreListView = (LoadMoreListView) findViewById(R.id.google_and_loadmore_refresh_listview);  
    76.         loadMoreListView.setOnRefreshListener(this);  
    77.     }  
    78.   
    79.     /** 
    80.      * 触发了下拉刷新事件,就会执行onRefresh()方法,这样就能在这个 
    81.      * 方法中去执行网络获取最新的数据,然后再刷新到listview上面 
    82.      */  
    83.     @Override  
    84.     public void onRefresh() {  
    85.         //因为本例中没有从网络获取数据,因此这里使用Handler演示4秒延迟来从服务器获取数据的延迟现象,以便于大家  
    86.         // 能够看到listView正在刷新的状态。大家在现实使用时只需要使用run(){}方法中的代码就行了。  
    87.         Handler handler = new Handler();  
    88.         handler.postDelayed(new Runnable() {  
    89.             @Override  
    90.             public void run() {  
    91.                 //获取最新的list数据  
    92.                 setRefreshData();  
    93.                 //通知界面显示,  
    94.                 adapter.notifyDataSetChanged();  
    95.                 // 通知listview刷新数据完毕,让listview停止刷新  
    96.                 swipeRefreshLayout.setRefreshing(false);  
    97.             }  
    98.         }, 6000);  
    99.     }  
    100.   
    101.     /** 
    102.      * 模拟加载刷新数据 
    103.      */  
    104.     private void setRefreshData() {  
    105.         //这里只是模拟3个列表项数据,在现实开发中,listview中的数据都是从服务器获取的。  
    106.         for (int i = 0; i < 3; i++) {  
    107.             ListViewItem item = new ListViewItem();  
    108.             item.setUserImg(R.mipmap.ic_launcher);  
    109.             item.setUserName("seven" + i);  
    110.             item.setUserComment("这是一个下拉刷新,上拉加载更多的ListView");  
    111.             items.add(item);  
    112.         }  
    113.     }  
    114.   
    115.     /** 
    116.      * ”加载更多“ 的回调接口方法 
    117.      */  
    118.     @Override  
    119.     public void onLoadingMore() {  
    120.   
    121.         //因为本例中没有从网络获取数据,因此这里使用Handler演示4秒延迟来从服务器获取数据的延迟现象,以便于大家  
    122.         // 能够看到listView正在刷新的状态。大家在现实使用时只需要使用run(){}方法中的代码就行了。  
    123.         Handler handler = new Handler();  
    124.         handler.postDelayed(new Runnable() {  
    125.             @Override  
    126.             public void run() {  
    127.                 //获取最新的list数据  
    128.                 setRefreshData();  
    129.                 //通知界面显示,  
    130.                 adapter.notifyDataSetChanged();  
    131.                 // 通知listview刷新数据完毕,让listview停止刷新,取消加载跟多  
    132.                 loadMoreListView.loadMoreComplete();  
    133.             }  
    134.         }, 6000);  
    135.     }  
    136. }  


        点击打开链接下载示例,免积分

  • 相关阅读:
    (网页)中的简单的遮罩层
    (后端)shiro:Wildcard string cannot be null or empty. Make sure permission strings are properly formatted.
    (网页)jQuery的时间datetime控件在AngularJs中使用实例
    Maven Myeclipse 搭建项目
    MyBatis 环境搭建 (一)
    java 常用方法
    XML 基础
    JS BOM
    js 事件
    js 的使用原则
  • 原文地址:https://www.cnblogs.com/lenkevin/p/5750708.html
Copyright © 2011-2022 走看看