android實現自定義SwichButton

圖片對應的名稱：
無色長條:switch_frame;
白色圓點:switch_btn_pressed;
左白右紅的長條:switch_bottom;
黑色長條:switch_mask.
那我們就用這幾張圖片來實現類似的效果吧。
代碼：
SwitchButton類：

package com.example.switchbutton;  

import android.content.Context;  
import android.graphics.Bitmap;  
import android.graphics.BitmapFactory;  
import android.graphics.Canvas;  
import android.graphics.Paint;  
import android.graphics.PorterDuff.Mode;  
import android.graphics.PorterDuffXfermode;  
import android.graphics.Rect;  
import android.graphics.RectF;  
import android.util.AttributeSet;  
import android.view.MotionEvent;  
import android.view.View;  

public class SwitchButton extends View implements android.view.View.OnClickListener{  
    private Bitmap mSwitchBottom, mSwitchThumb, mSwitchFrame, mSwitchMask;  
    private float mCurrentX = 0;  
    private boolean mSwitchOn = true;//開關默認是開着的  
    private int mMoveLength;//最大移動距離  
    private float mLastX = 0;//第一次按下的有效區域  

    private Rect mDest = null;//繪製的目標區域大小  
    private Rect mSrc = null;//截取源圖片的大小  
    private int mDeltX = 0;//移動的偏移量  
    private Paint mPaint = null;  
    private OnChangeListener mListener = null;  
    private boolean mFlag = false;  

    public SwitchButton(Context context) {  
        this(context, null);  
        // TODO Auto-generated constructor stub  
    }  

    public SwitchButton(Context context, AttributeSet attrs) {  
        this(context, attrs, 0);  
        // TODO Auto-generated constructor stub  
    }  

    public SwitchButton(Context context, AttributeSet attrs, int defStyle) {  
        super(context, attrs, defStyle);  
        // TODO Auto-generated constructor stub  
        init();  
    }  

    /** 
     * 初始化相關資源 
     */  
    public void init() {  
        mSwitchBottom = BitmapFactory.decodeResource(getResources(),  
                R.drawable.switch_bottom);  
        mSwitchThumb = BitmapFactory.decodeResource(getResources(),  
                R.drawable.switch_btn_pressed);  
        mSwitchFrame = BitmapFactory.decodeResource(getResources(),  
                R.drawable.switch_frame);  
        mSwitchMask = BitmapFactory.decodeResource(getResources(),  
                R.drawable.switch_mask);  
        setOnClickListener(this);  
        setOnTouchListener(new OnTouchListener() {  

            @Override  
            public boolean onTouch(View v, MotionEvent event) {  
                // TODO Auto-generated method stub  
                return false;  
            }  
        });  

        mMoveLength = mSwitchBottom.getWidth() - mSwitchFrame.getWidth();  
        mDest = new Rect(0, 0, mSwitchFrame.getWidth(), mSwitchFrame.getHeight());  
        mSrc = new Rect();  
        mPaint = new Paint();  
        mPaint.setAntiAlias(true);  
        mPaint.setAlpha(255);  
        mPaint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));  
    }  

    @Override  
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {  
        // TODO Auto-generated method stub  
        setMeasuredDimension(mSwitchFrame.getWidth(), mSwitchFrame.getHeight());  
    }  

    @Override  
    protected void onDraw(Canvas canvas) {  
        // TODO Auto-generated method stub  
        super.onDraw(canvas);  
        if (mDeltX > 0 || mDeltX == 0 && mSwitchOn) {  
            if(mSrc != null) {  
                mSrc.set(mMoveLength - mDeltX, 0, mSwitchBottom.getWidth()  
                    - mDeltX, mSwitchFrame.getHeight());  
            }   
        } else if(mDeltX < 0 || mDeltX == 0 && !mSwitchOn){  
            if(mSrc != null) {  
                mSrc.set(-mDeltX, 0, mSwitchFrame.getWidth() - mDeltX,  
                    mSwitchFrame.getHeight());  
            }  
        }   

<span style="white-space:pre">        </span>//這兒是離屏緩衝，自己感覺類似雙緩衝機制吧  
        int count = canvas.saveLayer(new RectF(mDest), null, Canvas.MATRIX_SAVE_FLAG  
                | Canvas.CLIP_SAVE_FLAG | Canvas.HAS_ALPHA_LAYER_SAVE_FLAG  
                | Canvas.FULL_COLOR_LAYER_SAVE_FLAG  
                | Canvas.CLIP_TO_LAYER_SAVE_FLAG);  

        canvas.drawBitmap(mSwitchBottom, mSrc, mDest, null);  
        canvas.drawBitmap(mSwitchThumb, mSrc, mDest, null);  
        canvas.drawBitmap(mSwitchFrame, 0, 0, null);  
        canvas.drawBitmap(mSwitchMask, 0, 0, mPaint);  
        canvas.restoreToCount(count);  
    }  

    @Override  
    public boolean onTouchEvent(MotionEvent event) {  
        // TODO Auto-generated method stub  
        switch (event.getAction()) {  
        case MotionEvent.ACTION_DOWN:  
            mLastX = event.getX();  
            break;  
        case MotionEvent.ACTION_MOVE:  
            mCurrentX = event.getX();  
            mDeltX = (int) (mCurrentX - mLastX);  
            // 如果開關開着向左滑動，或者開關關着向右滑動（這時候是不需要處理的）  
            if ((mSwitchOn && mDeltX < 0) || (!mSwitchOn && mDeltX > 0)) {  
                mFlag = true;  
                mDeltX = 0;  
            }  

            if (Math.abs(mDeltX) > mMoveLength) {  
                mDeltX = mDeltX > 0 ? mMoveLength : - mMoveLength;  
            }  
            invalidate();  
            return true;  
        case MotionEvent.ACTION_UP:  
            if (Math.abs(mDeltX) > 0 && Math.abs(mDeltX) < mMoveLength / 2) {  
                mDeltX = 0;  
                invalidate();  
                return true;  
            } else if (Math.abs(mDeltX) > mMoveLength / 2 && Math.abs(mDeltX) <= mMoveLength) {  
                mDeltX = mDeltX > 0 ? mMoveLength : -mMoveLength;  
                mSwitchOn = !mSwitchOn;  
                if(mListener != null) {  
                    mListener.onChange(this, mSwitchOn);  
                }  
                invalidate();  
                mDeltX = 0;  
                return true;  
            } else if(mDeltX == 0 && mFlag) {  
                //這時候得到的是不需要進行處理的，因爲已經move過了  
                mDeltX = 0;  
                mFlag = false;  
                return true;  
            }  
            return super.onTouchEvent(event);  
        default:  
            break;  
        }  
        invalidate();  
        return super.onTouchEvent(event);  
    }  

    public void setOnChangeListener(OnChangeListener listener) {  
        mListener = listener;  
    }  

    public interface OnChangeListener {  
        public void onChange(SwitchButton sb, boolean state);  
    }  

    @Override  
    public void onClick(View v) {  
        // TODO Auto-generated method stub  
        mDeltX = mSwitchOn ? mMoveLength : -mMoveLength;  
        mSwitchOn = !mSwitchOn;  
        if(mListener != null) {  
            mListener.onChange(this, mSwitchOn);  
        }  
        invalidate();  
        mDeltX = 0;  
    }  
}  

package com.example.switchbutton;  


import com.example.switchbutton.SwitchButton.OnChangeListener;  

import android.app.Activity;  
import android.os.Bundle;  
import android.util.Log;  
import android.view.Menu;  
import android.widget.Toast;  

public class MainActivity extends Activity {  

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

        SwitchButton sb = (SwitchButton) findViewById(R.id.wiperSwitch1);  
        sb.setOnChangeListener(new OnChangeListener() {  

            @Override  
            public void onChange(SwitchButton sb, boolean state) {  
                // TODO Auto-generated method stub  
                Log.d("switchButton", state ? "開":"關");  
                Toast.makeText(MainActivity.this, state ? "開":"關", Toast.LENGTH_SHORT).show();  
            }  
        });  
    }  

    @Override  
    public boolean onCreateOptionsMenu(Menu menu) {  
        // Inflate the menu; this adds items to the action bar if it is present.  
        getMenuInflater().inflate(R.menu.main, menu);  
        return true;  
    }  
}  

<LinearLayout 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"  
    android:orientation="vertical"  
    android:paddingBottom="@dimen/activity_vertical_margin"  
    android:paddingLeft="@dimen/activity_horizontal_margin"  
    android:paddingRight="@dimen/activity_horizontal_margin"  
    android:paddingTop="@dimen/activity_vertical_margin" >  

    <ImageView  
        android:id="@+id/imageView"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content" />  
    <com.example.switchbutton.SwitchButton  
        android:id="@+id/wiperSwitch1"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:layout_marginLeft="100dip" />  
</LinearLayout>