ListView的滑动删除

转载请注明：http://blog.youkuaiyun.com/lovemy_baby/article/details/51199640

源码下载：http://download.youkuaiyun.com/detail/lovemy_baby/9496784

当我们使用QQ的时候我们都知道，一些聊天信息是怎么删除的，但是我们应该怎么做去完成这样的效果呢，今天我就带大家看看这样一个简单的例子，当然这是借鉴一个大神的案例，大家也可以看一下他的博客：http://blog.youkuaiyun.com/lmj623565791/article/details/22961279 

好啦，我们言归正传，先让大家看看效果图吧：

大家一看是不是觉得很难看的？其实我也不知道这个是怎么回事，但是popupWindow确实是没有在ListView的框中，但是不影响，好啦，我们就看看代码吧：

首先是delete_btn.xml:

<?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="match_parent"
    android:orientation="vertical" >
    <Button
        android:id="@+id/id_item_btn"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:text="删除"
        />
</LinearLayout>

很简单就是一个Button按钮，侧拉显示删除ListView的作用

然后是mian.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
     >


    <com.itheima.listviewhtwo.QQListView
        android:id="@+id/id_listview"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        ></com.itheima.listviewhtwo.QQListView>


</RelativeLayout>

对于自定义控件的方法，如果大家不明白的话，可以给我评论，也可以上网搜索，这里就不再详解了

下面我们就来看看主要代码了

首先是QQListView.java代码：

package com.itheima.listviewhtwo;


import android.R.integer;
import android.content.Context;
import android.util.AttributeSet;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewConfiguration;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.PopupWindow;


public class QQListView extends ListView{

private static final String TAG = "QQlistView";

private int touchSlop;

private boolean isSliding;//是否响应滑动

private int xDown;

private int yDown;

private int xMove;

private int yMove;

private LayoutInflater mInflater;//添加view到容器

private PopupWindow mPopupWindow;//前面有对popupWindow的详细介绍

private int mPopupWindowWidth;

private int mPopupWindowHeight;

private Button mDelBtn;

private DelButtonClickListener mListener;

private View mCurrentView;//手指触摸的View

private int mCurrentViewPos;//手指触摸的位置


public QQListView(Context context, AttributeSet attrs) {
super(context, attrs);

mInflater=LayoutInflater.from(context);
touchSlop=ViewConfiguration.get(context).getScaledTouchSlop();
View view=mInflater.inflate(R.layout.delete_btn, null);
mDelBtn=(Button)view.findViewById(R.id.id_item_btn);
mPopupWindow=new PopupWindow(view, LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);

mPopupWindow.getContentView().measure(0, 0);
mPopupWindowWidth=mPopupWindow.getContentView().getWidth();
mPopupWindowHeight=mPopupWindow.getContentView().getHeight();


}
public boolean dispatchTouchEvent(MotionEvent event){
int action=event.getAction();
int x=(int) event.getX();
int y=(int)event.getY();
switch (action) {
case MotionEvent.ACTION_DOWN:

xDown=x;
yDown=y;
if (mPopupWindow.isShowing()) {
dismissPopWindow();
return false;
}
mCurrentViewPos=pointToPosition(xDown, yDown);//获得手指按下时的位置
View view=getChildAt(mCurrentViewPos-getFirstVisiblePosition());//获得当前手指按下时的item
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(event);
}
@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);
}
//隐藏PopupWindow
private void dismissPopWindow()
{
if (mPopupWindow != null && mPopupWindow.isShowing())
{
mPopupWindow.dismiss();
}
}


public void setDelButtonClickListener(DelButtonClickListener listener)
{
mListener = listener;
}


interface DelButtonClickListener
{
public void clickHappend(int position);
}


}

简单的说就是获取点击的初始位置和最终位置，当获得的长度dx的值大于触发事件发生的长度，时间发生，当手指离开后，事件结束。下面我们简单分析一下主要代码

首先是初始化位置：

private int touchSlop;//响应长度

private boolean isSliding;//是否响应滑动

private int xDown;

private int yDown;

private int xMove;

private int yMove;

然后是一些主要的控件和时间处理：

private LayoutInflater mInflater;//添加view到容器

private PopupWindow mPopupWindow;//前面有对popupWindow的详细介绍

private int mPopupWindowWidth;

private int mPopupWindowHeight;

private Button mDelBtn;

private DelButtonClickListener mListener;

private View mCurrentView;//手指触摸的View

private int mCurrentViewPos;//手指触摸的位置

popupWindow在上一节我们已经大致说了一下这里就不做过多的解释：

然后就是自定义触摸事件：

public boolean dispatchTouchEvent(MotionEvent event){
int action=event.getAction();
int x=(int) event.getX();
int y=(int)event.getY();
switch (action) {
case MotionEvent.ACTION_DOWN:

xDown=x;
yDown=y;
if (mPopupWindow.isShowing()) {
dismissPopWindow();
return false;
}
mCurrentViewPos=pointToPosition(xDown, yDown);//获得手指按下时的位置
View view=getChildAt(mCurrentViewPos-getFirstVisiblePosition());//获得当前手指按下时的item
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(event);
}

然后是触摸事件：

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);
}

//隐藏PopupWindow
private void dismissPopWindow()
{
if (mPopupWindow != null && mPopupWindow.isShowing())
{
mPopupWindow.dismiss();
}
}

这些就不做过多的解释，接下来我们就看看ListView的主代码mainActivity.java：

package com.itheima.listviewhtwo;


import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;


import com.itheima.listviewhtwo.QQListView.DelButtonClickListener;


import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.Toast;


public class MainActivity extends Activity {

private QQListView mListView;
private ArrayAdapter<String> mAdapter;
private List<String> mDatas;


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

mListView=(QQListView)findViewById(R.id.id_listview);
mDatas=new ArrayList<String>(Arrays.asList("HelloWorld", "Welcome", "Java", "Android", "Servlet", "Struts",
"Hibernate", "Spring", "HTML5", "Javascript", "Lucene"));
mAdapter=new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1,mDatas);
mListView.setAdapter(mAdapter);
mListView.setDelButtonClickListener(new DelButtonClickListener() {

@Override
public void clickHappend(int position) {
Toast.makeText(MainActivity.this, position + " : " + mAdapter.getItem(position), 1).show();
mAdapter.remove(mAdapter.getItem(position));
}
});
mListView.setOnItemClickListener(new OnItemClickListener() {


@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
Toast.makeText(MainActivity.this, position + " : " + mAdapter.getItem(position), 1).show();
}
});
}


}

关于侧拉的方式style在下面的源码中会有解释，欢迎大家的下载。