SwipeRefreshLayout–Google官方提出的下拉刷新控件,广泛应用在各种APP中。一直想弄一个既能支持下拉刷新,又能够上拉加载,同时还能实现类似于QQ的滑动删除效果。上网找了很多资料,最后达到了下面的效果:

参考资料:
SwipeRefreshLayout的上拉加载与下拉刷新:
http://blog.csdn.net/u012036813/article/details/38959507
Listview的滑动删除:
http://blog.csdn.net/lmj623565791/article/details/22961279
Android事件传递机制:
http://blog.csdn.net/yanzi1225627/article/details/22592831
接下来看看具体实现过程。
1.界面布局:
<com.example.swiperefreshlayoutdemo.RefreshLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/swipe_container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.example.swiperefreshlayoutdemo.QQListView
android:id="@+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</com.example.swiperefreshlayoutdemo.QQListView>
</com.example.swiperefreshlayoutdemo.RefreshLayout>
因为要实现上拉加载以及滑动删除,所以用的都是自定义的RefreshLayout以及Listview。
2.代码实现:
SwipeRefreshLayout的上拉加载实现有两种方法,一种是实现滑动监听,当滑动到底部时实现加载更多功能;一种是通过事件传递机制监听上拉动作,然后实现加载更多功能。先看第一种加载原理:
自定义的SwipeRefreshLayout:
public class RefreshLayout extends SwipeRefreshLayout implements OnScrollListener {
private ListView mListView;
private OnLoadListener mOnLoadListener;
private View mListViewFooter;
private boolean isLoading = false;
public RefreshLayout(Context context) {
this(context, null);
}
public RefreshLayout(Context context, AttributeSet attrs) {
super(context, attrs);
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);
if (mListView == null) {
getListView();
}
}
private void getListView() {
int childs = getChildCount();
if (childs > 0) {
View childView = getChildAt(0);
if (childView instanceof ListView) {
mListView = (ListView) childView;
mListView.setOnScrollListener(this);
}
}
}
public void setLoading(boolean loading) {
isLoading = loading;
if (isLoading) {
mListView.addFooterView(mListViewFooter);
} else {
mListView.removeFooterView(mListViewFooter);
}
}
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 (mListView.getLastVisiblePosition() == mListView.getAdapter()
.getCount() - 1 && isLoading == false) {
setLoading(true);
mOnLoadListener.onLoad();
}
}
public interface OnLoadListener {
public void onLoad();
}
}
注释写的很清楚,实现滑动监听,然后初始化listview,写好加载任务接口与方法。在滑动监听方法里面,有几个参数注意一下:
firstVisibleItem 表示在当前屏幕显示的第一个listItem在整个listView里面的位置(下标从0开始)
visibleItemCount表示在现时屏幕可以见到的ListItem(部分显示的ListItem也算)总数
totalItemCount表示ListView的ListItem总数
listView.getLastVisiblePosition()表示在现时屏幕最后一个ListItem (最后ListItem要完全显示出来才算)在整个ListView的位置(下标从0开始)
刚开始只判断是否滑动到了最底部,没有对加载状态进行判断,导致程序运行崩溃,在最底部加载数据时会一直加载。后来加上判断,默认不加载数据,isLoading==false,滑动到最底部加载数据时,设置为true,当加载完成以后,设置为false,加载完毕。
接下来是第二种加载原理:
public class RefreshLayout extends SwipeRefreshLayout {
private ListView mListView;
private OnLoadListener mOnLoadListener;
private View mListViewFooter;
private boolean isLoading = false;
private int mYDown;
private int mLastY;
private int mTouchSlop;
public RefreshLayout(Context context) {
this(context, null);
}
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);
if (mListView == null) {
getListView();
}
}
private void getListView() {
int childs = getChildCount();
if (childs > 0) {
View childView = getChildAt(0);
if (childView instanceof ListView) {
mListView = (ListView) childView;
}
}
}
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 ((mYDown - mLastY) >= mTouchSlop && isLoading == false) {
setLoading(true);
mOnLoadListener.onLoad();
}
break;
default:
break;
}
return super.dispatchTouchEvent(event);
}
public void setLoading(boolean loading) {
isLoading = loading;
if (isLoading) {
mListView.addFooterView(mListViewFooter);
} else {
mListView.removeFooterView(mListViewFooter);
}
}
public void setOnLoadListener(OnLoadListener loadListener) {
mOnLoadListener = loadListener;
}
public interface OnLoadListener {
public void onLoad();
}
}
初始化数据都一样,不同的是记录了两个Y坐标,一个按下,一个抬起,用来判断滑动到底部时的上拉动作。getScaledTouchSlop是一个距离,表示滑动的时候,手的移动要大于这个距离才开始移动控件。如果小于这个距离就不触发移动控件,如viewpager就是用这个距离来判断用户是否翻页。
然后就是通过事件传递机制,拿到view的三个动作:
MotionEvent.ACTION_DOWN 按下View,是所有事件的开始
MotionEvent.ACTION_MOVE 滑动事件
MotionEvent.ACTION_UP 与down对应,表示抬起
当滑动的距离大于或者等于要求距离并且加载状态为false时,开始设置状态,加载数据,原理和上面一样。
接下里就是MainActivity的相关代码:
public class MainActivity extends Activity implements OnRefreshListener,
OnLoadListener {
private RefreshLayout swipeLayout;
private QQListView listView;
private MyAdapter adapter;
private List<Integer> list = new ArrayList<Integer>();
private int y = 11;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
setData();
setListener();
}
private void initView() {
swipeLayout = (RefreshLayout) findViewById(R.id.swipe_container);
swipeLayout.setOnRefreshListener(this);
swipeLayout.setColorScheme(android.R.color.holo_blue_bright,
android.R.color.holo_green_light,
android.R.color.holo_orange_light,
android.R.color.holo_red_light);
}
private void setData() {
list = new ArrayList<>();
for (int i = 3; i < 12; i++) {
list.add(i);
}
listView = (QQListView) findViewById(R.id.list);
adapter = new MyAdapter(this, list);
listView.setAdapter(adapter);
listView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View arg1,
int position, long arg3) {
Toast.makeText(getApplicationContext(),
"这是第" + String.valueOf(position + 1) + "项",
Toast.LENGTH_SHORT).show();
}
});
listView.setDelButtonClickListener(new DelButtonClickListener() {
@Override
public void clickHappend(int position) {
list.remove(position);
refresh();
}
});
}
private void setListener() {
swipeLayout.setOnRefreshListener(this);
swipeLayout.setOnLoadListener(this);
}
@Override
public void onRefresh() {
swipeLayout.postDelayed(new Runnable() {
@Override
public void run() {
list.clear();
y = 12;
for (int i = 0; i < 13; i++) {
list.add(i);
}
refresh();
swipeLayout.setRefreshing(false);
}
}, 1000);
}
@Override
public void onLoad() {
swipeLayout.postDelayed(new Runnable() {
@Override
public void run() {
y++;
list.add(y);
refresh();
swipeLayout.setLoading(false);
}
}, 1000);
}
private void refresh() {
adapter.setList(list);
adapter.notifyDataSetChanged();
}
}
实现自带的下拉刷新接口方法以及我们自己定义的上拉加载方法,然后在各自的方法里进行业务操作,我这里模拟的是简单数字刷新。到这里,SwipeRefreshLayout的下拉刷新与上拉加载已经完成。最后就是SwipeRefreshLayout的滑动删除。
这里的滑动删除参考的是鸿洋的这篇博客,代码注释,讲解都很详细:
http://blog.csdn.net/lmj623565791/article/details/22961279
滑动删除item原理就是通过回调拿到item的position,然后执行删除操作,更新适配器即可。难点就是解决上拉加载与下拉刷新操作与listview侧滑删除操作冲突的问题
@Override
public boolean dispatchTouchEvent(MotionEvent ev) {
int action = ev.getAction();
int x = (int) ev.getX();
int y = (int) ev.getY();
switch (action) {
case MotionEvent.ACTION_DOWN:
xDown = x;
yDown = y;
/**
* 如果当前popupWindow显示,则直接隐藏,然后屏蔽ListView的touch事件的下传
*/
if (mPopupWindow.isShowing()) {
dismissPopWindow();
return false;
}
mCurrentViewPos = pointToPosition(xDown, yDown);
View view = getChildAt(mCurrentViewPos - getFirstVisiblePosition());
mCurrentView = view;
break;
case MotionEvent.ACTION_MOVE:
xMove = x;
yMove = y;
int dx = xMove - xDown;
int dy = yMove - yDown;
/**
* 判断是否是从右到左的滑动
*/
if (xMove < xDown && Math.abs(dx) > touchSlop
&& Math.abs(dy) < touchSlop) {
isSliding = true;
}
break;
}
return super.dispatchTouchEvent(ev);
}
@Override
public boolean onTouchEvent(MotionEvent ev) {
int action = ev.getAction();
/**
* 如果是从右到左的滑动才相应
*/
if (isSliding) {
switch (action) {
case MotionEvent.ACTION_MOVE:
int[] location = new int[2];
mCurrentView.getLocationOnScreen(location);
mPopupWindow
.setAnimationStyle(R.style.popwindow_delete_btn_anim_style);
mPopupWindow.update();
mPopupWindow.showAtLocation(mCurrentView, Gravity.LEFT
| Gravity.TOP, location[0] + mCurrentView.getWidth(),
location[1] + mCurrentView.getHeight() / 2
- mPopupWindowHeight / 2);
mDelBtn.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (mListener != null) {
mListener.clickHappend(mCurrentViewPos);
mPopupWindow.dismiss();
}
}
});
break;
case MotionEvent.ACTION_UP:
isSliding = false;
}
return true;
}
return super.onTouchEvent(ev);
}
事件分发机制原理:在dispatchTouchEvent进行事件分发的时候,如果PopupWindow正在显示,则屏蔽ListView的滚动以及Item的点击,并让PopupWindow隐藏;如果PopupWindow没有显示,才会进行事件的分发。并且在onTouchEvent中返回true,表示消费当前滑动事件。
最后截图的时候比较卡,效果还是不错的。