仿qq向左滑動刪除 案例 詳解

1 首先我們創建一個安卓項目，然後創建SwipeLayout讓它繼承FrameLayout，初始化方法
}

public SwipeLayout(Context context, AttributeSet attrs) {
		this(context, attrs,0);
	}

	public SwipeLayout(Context context) {
		this(context,null);
	}
	public SwipeLayout(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		mDragHelper=ViewDragHelper.create(this,1.5f,MCallBack());//主要就是對<span style="font-family: Arial, Helvetica, sans-serif;">ViewDragHelper進行控制來實現左右滑動的 </span>
	}

        Callback MCallBack() {
		return new Callback() {
			
@Override
public boolean tryCaptureView(View arg0, int arg1) {
return true;
}
//設置移動範圍
@Override
public int clampViewPositionHorizontal(View child, int left, int dx) {
return left;
}
			}

<strong>2 第二部重寫觸摸時的方法</strong>

<pre name="code" class="java">@Override
	public boolean onInterceptTouchEvent(MotionEvent ev) {
		return mDragHelper.shouldInterceptTouchEvent(ev);
	}
    @Override
    public boolean onTouchEvent(MotionEvent event) {
    	mDragHelper.processTouchEvent(event);
    	return true;
    }

3.第三步

<pre name="code" class="java">public class MainActivity extends Activity {

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

對mainActivity的xml文件我們要配置如下

<pre name="code" class="java"><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.exampledelete.SwipeLayout
        android:id="@+id/sl"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:background="#44000000"
        android:minHeight="60dp" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/tv_call"
                android:layout_width="60dp"
                android:layout_height="match_parent"
                android:background="#666666"
                android:gravity="center"
                android:text="Call"
                android:textColor="#ffffff" />

            <TextView
                android:id="@+id/tv_del"
                android:layout_width="60dp"
                android:layout_height="match_parent"
                android:background="#ff0000"
                android:gravity="center"
                android:text="Delete"
                android:textColor="#ffffff" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#44ffffff"
            android:gravity="center_vertical"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/iv_image"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:layout_marginLeft="15dp"
                android:src="@drawable/head_1" />

            <TextView
                android:id="@+id/tv_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="15dp"
                android:text="Name" />
        </LinearLayout>
    </com.exampledelete.SwipeLayout>

</RelativeLayout>

這個時候你跑這個項目就可以實現視圖的左右滑動，但是隻是滑動而已沒有其他的什麼軟用。

</pre><pre name="code" class="java">

所以我們現在開始處理細節的問題

1.首先我們要重現onlayout方法來來給我們的佈局定位。

 @Override
    protected void onLayout(boolean changed, int left, int top, int right,
int bottom) {
super.onLayout(changed, left, top, right, bottom);
        LayoutView(false);
    }


private void LayoutView(boolean isopen) {
Rect frontRect = getFrontRect(isopen);
frontView.layout(frontRect.left, frontRect.top, frontRect.right, frontRect.bottom);
Rect BackRect = getbackRect(frontRect);
backView.layout(BackRect.left, BackRect.top, BackRect.right, BackRect.bottom);
// 調整順序, 把mFrontView前置
bringChildToFront(frontView);
}
    
    private Rect getbackRect(Rect frontRect) {
int left = frontRect.right;
return new Rect(left,0, left+mRange, height);
}


private Rect getFrontRect(boolean isopen) {
int left = 0;
if(isopen){
left=-mRange;
}
return new Rect(left,0, left+width, height);
}

     //在xml加載完畢的時候獲取他的兩個孩子視圖
@Override
    protected void onFinishInflate() {
super.onFinishInflate();
   frontView = getChildAt(1);
   backView = getChildAt(0);
    }

     //獲取到視圖的寬和高
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);
    width = frontView.getMeasuredWidth();
    height = frontView.getMeasuredHeight();
    mRange = backView.getMeasuredWidth();
    } 

</pre><pre name="code" class="java">

2，處理滑動的時候兩個視圖的連接性和牽連性

  <pre name="code" class="java"> Callback MCallBack() {
		return new Callback() {
			
			@Override
			public boolean tryCaptureView(View arg0, int arg1) {
				return true;
			}
			//設置移動範圍
			@Override
			public int clampViewPositionHorizontal(View child, int left, int dx) {
				if(child==frontView){
					if(left>0){
						left=0;
					}else if(left<-mRange){
						left=-mRange;
					}
				}else if(child==backView){
					if(left>width){
						left=width;
					}else if(left<width-mRange){
						left=width-mRange;
					}
				}
				return left;
			}
			@Override
			public void onViewPositionChanged(View changedView, int left,
					int top, int dx, int dy) {
				super.onViewPositionChanged(changedView, left, top, dx, dy);
				if(changedView==frontView){
					backView.offsetLeftAndRight(dx);
				}else if(changedView==backView){
					frontView.offsetLeftAndRight(dx);
				}
				// 兼容老版本
				invalidate();
			}
			
			
		};
	}

這個時候就實現了我們的左劃刪除的效果了

附上源碼：http://download.csdn.net/detail/iblue007/9051167