Android 自定义实现开关按钮

在开发我们经常会使用到自定义实现控件， 今天呢就跟大家说一说switch开关按钮的自定义实现。

为了大家的方便，直接把代码贴出来，不想那么麻烦自己去写的朋友可以直接copy到你们的项目中使用哦，颜色、大小都可以根据自己的需求改一改就行啦!

下面呢就是整个自定义类的代码：

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.ValueAnimator;
import android.animation.ValueAnimator.AnimatorUpdateListener;
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.RectF;
import android.os.Bundle;
import android.os.Looper;
import android.os.Parcelable;
import android.support.v4.view.MotionEventCompat;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.AccelerateDecelerateInterpolator;

public class SlideSwitcher extends View {

    public static final int SHAPE_RECT = 1;
    public static final int SHAPE_CIRCLE = 2;
    private static final int RIM_SIZE = 4;
    private static final int DEFAULT_OPEN_COLOR = 0xFFC80000;
    private static final int DEFAULT_CLOSE_COLOR = 0xFFD0D0D0;
    
    // 4 attributes
    private int openColor;
    private int closeColor;
    private boolean isOpen;
    private int shape;

    // varials of drawing
    private Paint paint;
    private Rect backRect;
    private Rect frontRect;
    private RectF frontCircleRect;
    private RectF backCircleRect;
    private int alpha;
    private int maxLeft;
    private int minLeft;
    private int frontRectLeft;
    private int frontRectLeftBegin = RIM_SIZE;
    private int eventStartX;
    private int eventLastX;
    private int diffX = 0;
    private boolean slideable = true;
    private SlideListener mSlideListener;

    public interface SlideListener {
        void onStatusChanged(SlideSwitcher view, boolean isOpen);
    }

    public SlideSwitcher(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        paint = new Paint();
        paint.setAntiAlias(true);

        openColor = DEFAULT_OPEN_COLOR;
        closeColor = DEFAULT_CLOSE_COLOR;
        isOpen = false;
        shape = SHAPE_CIRCLE;
    }

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

    public SlideSwitcher(Context context) {
        this(context, null);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        int width = measureDimension(280, widthMeasureSpec);
        int height = measureDimension(140, heightMeasureSpec);
        if (shape == SHAPE_CIRCLE) {
            if (width < height) width = height * 2;
        }
        setMeasuredDimension(width, height);
        initDrawingVal();
    }

    private void initDrawingVal() {
        int width = getMeasuredWidth();
        int height = getMeasuredHeight();

        backCircleRect = new RectF();
        frontCircleRect = new RectF();
        frontRect = new Rect();
        backRect = new Rect(0, 0, width, height);
        minLeft = RIM_SIZE;
        if (shape == SHAPE_RECT)
            maxLeft = width / 2;
        else
            maxLeft = width - (height - 2 * RIM_SIZE) - RIM_SIZE;
        if (isOpen) {
            frontRectLeft = maxLeft;
            alpha = 255;
        } else {
            frontRectLeft = RIM_SIZE;
            alpha = 0;
        }
        frontRectLeftBegin = frontRectLeft;
    }

    private int measureDimension(int defaultSize, int measureSpec) {
        int result;
        int specMode = MeasureSpec.getMode(measureSpec);
        int specSize = MeasureSpec.getSize(measureSpec);
        if (specMode == MeasureSpec.EXACTLY) {
            result = specSize;
        } else {
            result = defaultSize; // UNSPECIFIED
            if (specMode == MeasureSpec.AT_MOST) {
                result = Math.min(result, specSize);
            }
        }
        return result;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        if (shape == SHAPE_RECT) {
            paint.setColor(closeColor);
            canvas.drawRect(backRect, paint);
            paint.setColor(openColor);
            paint.setAlpha(alpha);
            canvas.drawRect(backRect, paint);
            frontRect
                    .set(frontRectLeft, RIM_SIZE, frontRectLeft + getMeasuredWidth() / 2 - RIM_SIZE, getMeasuredHeight() - RIM_SIZE);
            paint.setColor(Color.WHITE);
            canvas.drawRect(frontRect, paint);
        } else {
            // draw circle
            int radius;
            radius = backRect.height() / 2;
            paint.setColor(closeColor);
            backCircleRect.set(backRect);
            canvas.drawRoundRect(backCircleRect, radius, radius, paint);
            paint.setColor(openColor);
            paint.setAlpha(alpha);
            canvas.drawRoundRect(backCircleRect, radius, radius, paint);
            frontRect.set(frontRectLeft, RIM_SIZE, frontRectLeft + backRect.height() - 2 * RIM_SIZE, backRect.height() - RIM_SIZE);
            frontCircleRect.set(frontRect);
            paint.setColor(Color.WHITE);
            canvas.drawRoundRect(frontCircleRect, radius, radius, paint);
        }
    }

    @SuppressLint("ClickableViewAccessibility")
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (slideable == false)
            return super.onTouchEvent(event);
        int action = MotionEventCompat.getActionMasked(event);
        switch (action) {
            case MotionEvent.ACTION_DOWN:
                eventStartX = (int) event.getRawX();
                break;
            case MotionEvent.ACTION_MOVE:
                eventLastX = (int) event.getRawX();
                diffX = eventLastX - eventStartX;
                int tempX = diffX + frontRectLeftBegin;
                tempX = (tempX > maxLeft ? maxLeft : tempX);
                tempX = (tempX < minLeft ? minLeft : tempX);
                if (tempX >= minLeft && tempX <= maxLeft) {
                    frontRectLeft = tempX;
                    alpha = (int) (255 * (float) tempX / (float) maxLeft);
                    invalidateView();
                }
                break;
            case MotionEvent.ACTION_UP:
                int wholeX = (int) (event.getRawX() - eventStartX);
                frontRectLeftBegin = frontRectLeft;
                boolean toRight;
                toRight = (frontRectLeftBegin > maxLeft / 2 ? true : false);
                if (Math.abs(wholeX) < 3) {
                    toRight = !toRight;
                }
                moveToDest(toRight);
                break;
            default:
                break;
        }
        return true;
    }

    /**
     * draw again
     */
    private void invalidateView() {
        if (Looper.getMainLooper() == Looper.myLooper()) {
            invalidate();
        } else {
            postInvalidate();
        }
    }

    public void setSlideListener(SlideListener listener) {
        this.mSlideListener = listener;
    }

    public void moveToDest(final boolean toRight) {
        ValueAnimator toDestAnim = ValueAnimator.ofInt(frontRectLeft, toRight ? maxLeft : minLeft);
        toDestAnim.setDuration(300);
        toDestAnim.setInterpolator(new AccelerateDecelerateInterpolator());
        toDestAnim.start();
        toDestAnim.addUpdateListener(new AnimatorUpdateListener() {

            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                frontRectLeft = (Integer) animation.getAnimatedValue();
                alpha = (int) (255 * (float) frontRectLeft / (float) maxLeft);
                invalidateView();
            }
        });
        toDestAnim.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                if (toRight) {
                    isOpen = true;
                    frontRectLeftBegin = maxLeft;
                } else {
                    isOpen = false;
                    frontRectLeftBegin = minLeft;
                }

                if (mSlideListener != null)
                    mSlideListener.onStatusChanged(SlideSwitcher.this, isOpen);
            }
        });
    }

    public void setOpen(boolean isOpen) {
        setOpen(isOpen, false);
    }

    public void setOpen(boolean isOpen, boolean invokListener) {
        this.isOpen = isOpen;
        initDrawingVal();
        invalidateView();
        if (invokListener && mSlideListener != null) mSlideListener.onStatusChanged(this, isOpen);
    }

    public void setShapeType(int shapeType) {
        this.shape = shapeType;
    }

    public void setSlideable(boolean slideable) {
        this.slideable = slideable;
    }

    @Override
    protected void onRestoreInstanceState(Parcelable state) {
        if (state instanceof Bundle) {
            Bundle bundle = (Bundle) state;
            this.isOpen = bundle.getBoolean("isOpen");
            state = bundle.getParcelable("instanceState");
        }
        super.onRestoreInstanceState(state);
    }

    @Override
    protected Parcelable onSaveInstanceState() {
        Bundle bundle = new Bundle();
        bundle.putParcelable("instanceState", super.onSaveInstanceState());
        bundle.putBoolean("isOpen", this.isOpen);
        return bundle;
    }
}

下面呢是在布局中使用（注意：**要改成你们自己的包名路径哦!）

//在布局中使用
 <com.***.SlideSwitcher
                android:id="@+id/switch_btn"
                android:layout_width="48dp"
                android:layout_height="28dp"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true" />

到这里就OK了，哈哈，是不是很简单呢！如果对你有那么一丢丢帮助的话，我就很开心啦！
喜欢的话就赞一个哟！谢谢啦！