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

时间:2023-03-09 16:26:50
google官方的下拉刷新+自定义上拉加载更多

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

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

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

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

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

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

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

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

  1. android.support.v4.widget.SwipeRefreshLayout

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

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

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

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

  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. <android.support.v4.widget.SwipeRefreshLayout
  7. android:id="@+id/swipe_google_and_loadmore_refresh_layout"
  8. android:layout_width="match_parent"
  9. android:layout_height="match_parent">
  10. <com.example.myfirst.pulltorefreshlist.LoadMoreListView
  11. android:id="@+id/google_and_loadmore_refresh_listview"
  12. android:layout_width="match_parent"
  13. android:layout_height="match_parent">
  14. </com.example.myfirst.pulltorefreshlist.LoadMoreListView>
  15. </android.support.v4.widget.SwipeRefreshLayout>
  16. </LinearLayout>

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

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

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