SwipeRefresh 各種實現上拉，下拉刷新
SwipeRefresh
基于原生的SwipeRefreshLayout 做了封裝處理
此項目中包括種：
-
1.原生SwipeRefreshLayout（上拉可通過滾動監聽實現）
-
2.自定義支持上拉刷新的組件
-
3.自定義支持ViewPage的刷新組件VPSwipeRefreshLayout
-
4.RecyclerView+SwpieRefreshLayout實現下拉刷新效果同時實現上拉功能
主界面
1.原生SwipeRefreshLayout（上拉可通過滾動監聽實現）
除了OnRefreshListener接口外，SwipRefreshLayout中還有一些其他重要的方法，具體如下：
1、setOnRefreshListener(SwipeRefreshLayout.OnRefreshListener listener):設置手勢滑動監聽器。2、setProgressBackgroundColor(int colorRes):設置進度圈的背景色（已經棄用） setProgressBackgroundColorSchemeResource （可以）。 setProgressBackgroundColorSchemeColor（Color c） (可以) 3、setColorSchemeResources(int… colorResIds):設置進度動畫的顏色。 4、setRefreshing(Boolean refreshing):設置組件的刷洗狀態，顯示或者隱藏刷新進度條 5、setSize(int size):設置進度圈的大小，只有兩個值：DEFAULT、LARGE 6、postDelayed(new Runable(),long min) 設置刷新延遲時間 7、isRefreshing():檢查是否處于刷新狀態</pre>
下拉刷新
布局，具體內容如下：
<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:id="@+id/swipeLayout" > <ListView android:id="@+id/mylist" android:layout_width="match_parent" android:layout_height="wrap_content"/> </android.support.v4.widget.SwipeRefreshLayout>Activity核心代碼如下：
swipeRefreshLayout = (SwipeRefreshLayout)findViewById(R.id.swipeLayout); /*加載的漸變動畫*/ swipeRefreshLayout.setColorSchemeResources(R.color.swipe_color_1, R.color.swipe_color_2, R.color.swipe_color_3, R.color.swipe_color_4); swipeRefreshLayout.setSize(SwipeRefreshLayout.LARGE);; swipeRefreshLayout.setProgressBackgroundColor(R.color.swipe_background_color); //swipeRefreshLayout.setPadding(20, 20, 20, 20); //swipeRefreshLayout.setProgressViewOffset(true, 100, 200); //swipeRefreshLayout.setDistanceToTriggerSync(50); swipeRefreshLayout.setProgressViewEndTarget(true, 100); swipeRefreshLayout.setOnRefreshListener(new OnRefreshListener() { @Override public void onRefresh() { new Thread(new Runnable() { @Override public void run() { data.clear(); for(int i=0;i<20;i++){ data.add("SwipeRefreshLayout下拉刷新"+i); } try { Thread.sleep(5000); } catch (InterruptedException e) { e.printStackTrace(); } mHandler.sendEmptyMessage(1); } }).start(); } }); //handler private Handler mHandler = new Handler(){ @Override public void handleMessage(Message msg) { super.handleMessage(msg); switch (msg.what) { case 1: swipeRefreshLayout.setRefreshing(false); adapter.notifyDataSetChanged(); //swipeRefreshLayout.setEnabled(false); break; default: break; } } };
- 原生實現上拉效果
通過監聽滾動事件，對listview添加底部的組件實現上拉
implements AbsListView.OnScrollListener {···
···
/**
* 對listview添加底部的組件實現上拉
*/
footerView = getLayoutInflater().inflate(R.layout.refresh_footview_layout, null);
lv.addFooterView(footerView);
/**
* 設置滾動監聽
*/
lv.setOnScrollListener(this);
/**
* 重寫滾動方法
* @param view
* @param scrollState
*/
@Override
public void onScrollStateChanged(AbsListView view, int scrollState) {
if (adapter.getCount() == visibleLastIndex && scrollState == SCROLL_STATE_IDLE) {
Toast.makeText(this, "加載更多完成", Toast.LENGTH_SHORT).show();
footerView.setVisibility(View.GONE);
/*在此處加載更多數據*/
// new LoadDataThread().start();
}else {
footerView.setVisibility(View.VISIBLE);
// Toast.makeText(this, "加載更多...", Toast.LENGTH_SHORT).show();
}
}
2.自定義支持上拉刷新的組件
上拉刷新
實現下拉和上拉監聽
···AppCompatActivity implements SwipeRefreshLayout.OnRefreshListener,
RefreshLayout.OnLoadListener {
···
下拉和原先一樣用法：
//下拉監聽
swipeLayout.setOnRefreshListener(this);
//上拉監聽
swipeLayout.setOnLoadListener(this);
/**
* 上拉刷新
*/
@Override
public void onRefresh() {
swipeLayout.postDelayed(new Runnable() {
@Override
public void run() {
// 更新數據 更新完后調用該方法結束刷新
list.clear();
for (int i = 0; i < 8; i++) {
HashMap<String, String> map = new HashMap<String, String>();
map.put("itemImage", i + "刷新");
map.put("itemText", i + "刷新");
list.add(map);
}
adapter.notifyDataSetChanged();
swipeLayout.setRefreshing(false);
}
}, 2000);
}
/**
* 加載更多
*/
@Override
public void onLoad() {
swipeLayout.postDelayed(new Runnable() {
@Override
public void run() {
// 更新數據 更新完后調用該方法結束刷新
swipeLayout.setLoading(false);
for (int i = 1; i < 10; i++) {
HashMap<String, String> map = new HashMap<String, String>();
map.put("itemImage", i + "更多");
map.put("itemText", i + "更多");
list.add(map);
}
adapter.notifyDataSetChanged();
}
}, 2000);
}
- 自定義組件如下：
/**
* Created by huangshuyuan on 2017/3/9.
* email:hshuuyuan@foxmail.com
* version:v1.0
* <p>
* 自定義view
*/
/**
* 繼承自SwipeRefreshLayout,從而實現滑動到底部時上拉加載更多的功能.
*/
public class RefreshLayout extends SwipeRefreshLayout implements
OnScrollListener {
/**
* 滑動到最下面時的上拉操作
*/
private int mTouchSlop;
/**
* listview實例
*/
private ListView mListView;
/**
* 上拉監聽器, 到了最底部的上拉加載操作
*/
private OnLoadListener mOnLoadListener;
/**
* ListView的加載中footer
*/
private View mListViewFooter;
/**
* 按下時的y坐標
*/
private int mYDown;
/**
* 抬起時的y坐標, 與mYDown一起用于滑動到底部時判斷是上拉還是下拉
*/
private int mLastY;
/**
* 是否在加載中 ( 上拉加載更多 )
*/
private boolean isLoading = false;
/**
* @param context
*/
public RefreshLayout(Context context) {
this(context, null);
}
@SuppressLint("InflateParams")
public RefreshLayout(Context context, AttributeSet attrs) {
super(context, attrs);
mTouchSlop = ViewConfiguration.get(context).getScaledTouchSlop();
mListViewFooter = LayoutInflater.from(context).inflate(
R.layout.listview_footer, null, false);
}
@Override
protected void onLayout(boolean changed, int left, int top, int right,
int bottom) {
super.onLayout(changed, left, top, right, bottom);
// 初始化ListView對象
if (mListView == null) {
getListView();
}
}
/**
* 獲取ListView對象
*/
private void getListView() {
int childs = getChildCount();
if (childs > 0) {
View childView = getChildAt(0);
if (childView instanceof ListView) {
mListView = (ListView) childView;
// 設置滾動監聽器給ListView, 使得滾動的情況下也可以自動加載
mListView.setOnScrollListener(this);
Log.d(VIEW_LOG_TAG, "### 找到listview");
}
}
}
/*
* (non-Javadoc)
*
* @see android.view.ViewGroup#dispatchTouchEvent(android.view.MotionEvent)
*/
@Override
public boolean dispatchTouchEvent(MotionEvent event) {
final int action = event.getAction();
switch (action) {
case MotionEvent.ACTION_DOWN:
// 按下
mYDown = (int) event.getRawY();
break;
case MotionEvent.ACTION_MOVE:
// 移動
mLastY = (int) event.getRawY();
break;
case MotionEvent.ACTION_UP:
// 抬起
if (canLoad()) {
loadData();
}
break;
default:
break;
}
return super.dispatchTouchEvent(event);
}
/**
* 是否可以加載更多, 條件是到了最底部, listview不在加載中, 且為上拉操作.
*
* @return
*/
private boolean canLoad() {
return isBottom() && !isLoading && isPullUp();
}
/**
* 判斷是否到了最底部
*/
private boolean isBottom() {
if (mListView != null && mListView.getAdapter() != null) {
return mListView.getLastVisiblePosition() == (mListView
.getAdapter().getCount() - 1);
}
return false;
}
/**
* 是否是上拉操作
*
* @return
*/
private boolean isPullUp() {
return (mYDown - mLastY) >= mTouchSlop;
}
/**
* 如果到了最底部,而且是上拉操作.那么執行onLoad方法
*/
private void loadData() {
if (mOnLoadListener != null) {
// 設置狀態
setLoading(true);
//
mOnLoadListener.onLoad();
}
}
/**
* @param loading
*/
public void setLoading(boolean loading) {
isLoading = loading;
if (isLoading) {
mListView.addFooterView(mListViewFooter);
} else {
mListView.removeFooterView(mListViewFooter);
mYDown = 0;
mLastY = 0;
}
}
/**
* @param loadListener
*/
public void setOnLoadListener(OnLoadListener loadListener) {
mOnLoadListener = loadListener;
}
@Override
public void onScrollStateChanged(AbsListView view, int scrollState) {
}
@Override
public void onScroll(AbsListView view, int firstVisibleItem,
int visibleItemCount, int totalItemCount) {
// 滾動時到了最底部也可以加載更多
if (canLoad()) {
loadData();
}
}
/**
* 設置刷新
*/
public static void setRefreshing(SwipeRefreshLayout refreshLayout,
boolean refreshing, boolean notify) {
Class<? extends SwipeRefreshLayout> refreshLayoutClass = refreshLayout
.getClass();
if (refreshLayoutClass != null) {
try {
Method setRefreshing = refreshLayoutClass.getDeclaredMethod(
"setRefreshing", boolean.class, boolean.class);
setRefreshing.setAccessible(true);
setRefreshing.invoke(refreshLayout, refreshing, notify);
} catch (NoSuchMethodException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
}
}
/**
* 加載更多的監聽器
*/
public static interface OnLoadListener {
public void onLoad();
}
}
3.自定義支持ViewPage的刷新組件VPSwipeRefreshLayout
支持viewpager刷新
- 原生SwipeRefreshLayout會存在以下問題：
1、 SwipeRefreshLayout會吃掉ViewPager的滑動事件。
2、 SwipeRefreshLayout需要套在ScrollView和ListView上的時候才表現的比較友好，在其他ViewGroup上有點問題
- 重寫后的SwipeRefreshLayout，直接復制到項目就可以使用了。
public class VpSwipeRefreshLayout extends SwipeRefreshLayout {
private float startY;
private float startX;
// 記錄viewPager是否拖拽的標記
private boolean mIsVpDragger;
private final int mTouchSlop;
public VpSwipeRefreshLayout(Context context, AttributeSet attrs) {
super(context, attrs);
mTouchSlop = ViewConfiguration.get(context).getScaledTouchSlop();
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
int action = ev.getAction();
switch (action) {
case MotionEvent.ACTION_DOWN:
// 記錄手指按下的位置
startY = ev.getY();
startX = ev.getX();
// 初始化標記
mIsVpDragger = false;
break;
case MotionEvent.ACTION_MOVE:
// 如果viewpager正在拖拽中，那么不攔截它的事件，直接return false；
if(mIsVpDragger) {
return false;
}
// 獲取當前手指位置
float endY = ev.getY();
float endX = ev.getX();
float distanceX = Math.abs(endX - startX);
float distanceY = Math.abs(endY - startY);
// 如果X軸位移大于Y軸位移，那么將事件交給viewPager處理。
if(distanceX > mTouchSlop && distanceX > distanceY) {
mIsVpDragger = true;
return false;
}
break;
case MotionEvent.ACTION_UP:
case MotionEvent.ACTION_CANCEL:
// 初始化標記
mIsVpDragger = false;
break;
}
// 如果是Y軸位移大于X軸，事件交給swipeRefreshLayout處理。
return super.onInterceptTouchEvent(ev);
}
}
4.RecyclerView+SwpieRefreshLayout實現下拉刷新效果同時實現上拉功能
RecyclerView+SwpieRefreshLayout
RecyclerView實現的列表，默認情況下面是不帶下拉刷新和上拉記載更多效果的，但是我在我們的實際項目當中，為了提高用戶體驗，這種效果一般都需要實現
SwipeRefreshLayout本身自帶下拉刷新的效果，那么我們可以選擇在RecyclerView布局外部嵌套一層SwipeRefreshLayout布局即可，具體布局文件如下:
?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_recycle_view_refresh"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.hsy.refresh.ui.RecycleViewRefreshActivity">
<include
layout="@layout/common_top_bar_layout"
android:visibility="gone" />
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/demo_swiperefreshlayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scrollbars="vertical">
<android.support.v7.widget.RecyclerView
android:id="@+id/demo_recycler"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</android.support.v7.widget.RecyclerView>
</android.support.v4.widget.SwipeRefreshLayout>
</LinearLayout>
在Activity中引用這個布局并初始化
@Override
protected void onCreate(Bundle savedInstanceState) {
//去除系統標題
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_recycle_view_refresh);
ButterKnife.bind(this);
initView();
}
/*RecyclerView 管理器*/
private LinearLayoutManager linearLayoutManager;
MyRecyclerViewAdapter adapter;
private int lastVisibleItem;//記錄滾動位置
/**
* 初始化組件
*/
private void initView() {
topBarTitle.setText("RecyclerView 刷新");
//設置刷新時動畫的顏色，可以設置4個
swiperefreshLayout.setProgressBackgroundColorSchemeResource(android.R.color.white);
swiperefreshLayout.setColorSchemeResources(android.R.color.holo_blue_light,
android.R.color.holo_red_light, android.R.color.holo_orange_light,
android.R.color.holo_green_light);
// 這句話是為了，第一次進入頁面的時候顯示加載進度條
swiperefreshLayout.setProgressViewOffset(false, 0, (int) TypedValue
.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 24, getResources()
.getDisplayMetrics()));
//設置豎直方向
linearLayoutManager = new LinearLayoutManager(this);
linearLayoutManager.setOrientation(OrientationHelper.VERTICAL);
//設置管理器
recylerview.setLayoutManager(linearLayoutManager);
//添加分隔線
recylerview.addItemDecoration(new AdvanceDecoration(this, OrientationHelper.VERTICAL));
recylerview.setAdapter(adapter = new MyRecyclerViewAdapter(this));
/*實現下拉*/
swiperefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
List<String> newDatas = new ArrayList<String>();
for (int i = 0; i < 5; i++) {
int index = i + 1;
newDatas.add("new item" + index);
}
adapter.addItem(newDatas);/*添加數據*/
swiperefreshLayout.setRefreshing(false);
Toast.makeText(RecycleViewRefreshActivity.this, "更新了五條數據...", Toast.LENGTH_SHORT).show();
}
}, 3000);
}
});
/**
* 添加滾動監聽，實現上拉刷新
*/
recylerview.setOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
//當滾動到底部時刷新數據
if (newState == RecyclerView.SCROLL_STATE_IDLE && lastVisibleItem + 1 == adapter.getItemCount()) {
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
List<String> newDatas = new ArrayList<String>();
for (int i = 0; i < 5; i++) {
int index = i + 1;
newDatas.add("more item" + index);
}
adapter.addMoreItem(newDatas);
swiperefreshLayout.setRefreshing(false);
}
}, 1000);
}
}
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
//獲取滾動的最后位置
lastVisibleItem = linearLayoutManager.findLastVisibleItemPosition();
}
});
}
實現下拉刷新用SwipeRefreshLayout 自帶的進度條， 上拉刷新用類似ListView的刷新 提示“加載中”等信息。
我們可以給RecyclerView 也添加一個類似FooterView的item。
我們在Adapter中實現：
/**
* RecyclerView的適配器
*/
class MyRecyclerViewAdapter extends RecyclerView.Adapter<MyRecyclerViewAdapter.ViewHolder> {//自定義viewHoder
List<String> datas;
Context context;
/*加載更多*/
private static final int TYPE_ITEM = 0;
private static final int TYPE_FOOTER = 1;
public MyRecyclerViewAdapter(Context context) {
this.context = context;
/*初始化數據*/
this.datas = new ArrayList<String>();
for (int i = 0; i < 20; i++) {
int index = i + 1;
datas.add("item" + index);
}
/*addItem(datas);*/
}
//自定義的ViewHolder，持有每個Item的的所有界面元素
public class ViewHolder extends RecyclerView.ViewHolder {
public ViewHolder(View view) {
super(view);
}
}
//自定義的ViewHolder，持有每個Item的的所有界面元素
public class ItemViewHolder extends ViewHolder {
public TextView item_tv;
public ItemViewHolder(View view) {
super(view);
item_tv = (TextView) view.findViewById(R.id.text);
}
}
/**
* 底部view
*/
class FooterViewHolder extends ViewHolder {
public FooterViewHolder(View view) {
super(view);
}
}
/**
* 綁定布局文件
*
* @param parent
* @param viewType
* @return
*/
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if (viewType == TYPE_FOOTER) {
final View view = LayoutInflater.from(context).inflate(R.layout.refresh_footview_layout, parent, false);
// view.setLayoutParams(new RecyclerView.LayoutParams(RecyclerView.LayoutParams.MATCH_PARENT,
// RecyclerView.LayoutParams.WRAP_CONTENT));
FooterViewHolder viewHolder = new FooterViewHolder(view);
return viewHolder;
} else if (viewType == TYPE_ITEM) {
final View view = LayoutInflater.from(context).inflate(R.layout.item_recycler_layout, parent, false);
//這邊可以做一些屬性設置，甚至事件監聽綁定
//view.setBackgroundColor(Color.RED);
ItemViewHolder viewHolder = new ItemViewHolder(view);
return viewHolder;
}
return null;
}
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
if (holder instanceof ItemViewHolder) {
//設置數據
((ItemViewHolder) holder).item_tv.setText(datas.get(position));
((ItemViewHolder) holder).item_tv.setTag(position);
}
}
/*返回每一項的類型*/
@Override
public int getItemViewType(int position) {
// 最后一個item設置為footerView
if (position + 1 == getItemCount()) {
return TYPE_FOOTER;
} else {
return TYPE_ITEM;
}
}
// RecyclerView的count設置為數據總條數+ 1（footerView）
@Override
public int getItemCount() {
return datas.size() + 1;
}
//添加數據
public void addItem(List<String> newDatas) {
//mTitles.add(position, data);
//notifyItemInserted(position);
newDatas.addAll(datas);
datas.removeAll(datas);
datas.addAll(newDatas);
notifyDataSetChanged();
}
/**
* 添加更多數據
*
* @param newDatas
*/
public void addMoreItem(List<String> newDatas) {
datas.addAll(newDatas);
adapter.notifyDataSetChanged();
}
}
refresh_footview_layout
<?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:gravity="center_horizontal">
<ProgressBar
android:id="@+id/progressBar"
style="?android:attr/progressBarStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/refresh_text" />
</LinearLayout>
item_recycler_layout
<?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">
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
本文由用戶 bm34d6r9 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！