自定义View之开关

资源文件

首先我们需要有两个图片文件，分别是开关的背景和开关的滑块

自定义View

1.写一个类继承View

2.copy该类的全路径名在布局文件使用，

3.找到这个控件，设置初始信息

4.根据需求绘制这个界面内容

/**
 * Created by Administrator on 2017/9/12 0012.
 * email: apk2sf@163.com
 * QQ：337081267
 */
public class MyToggleView extends View {

    private Bitmap mSwitchBackgroundBitmap;
    private Paint mPaint;
    private Bitmap mSlideSourceBitmap;
    private boolean mToogleState;
    private float mCurrentX;
    private boolean isTouchMove;
    private OnStateChangeListener mStateChangeListener;

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

    public MyToggleView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MyToggleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        //创建一个画笔
        mPaint = new Paint();
    }

    /**
     * 添加背景
     *
     * @param switchBackground
     */
    public void setSwitchBackground(int switchBackground) {
        //把文件变为Bitmap
        mSwitchBackgroundBitmap = BitmapFactory.decodeResource(getResources(), switchBackground);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //测量的方法
        setMeasuredDimension(mSwitchBackgroundBitmap.getWidth(), mSwitchBackgroundBitmap.getHeight());
    }

    @Override
    protected void onDraw(Canvas canvas) {
        //绘制的方法
        canvas.drawBitmap(mSwitchBackgroundBitmap, 0, 0, mPaint);

        //判断是否是手指在滑动
        if (isTouchMove) {
            float newLeft = mCurrentX - mSlideSourceBitmap.getWidth() / 2;
//            canvas.drawBitmap(mSlideSourceBitmap, newLeft, 0, mPaint);

            int maxLeft = mSwitchBackgroundBitmap.getWidth()
                    - mSlideSourceBitmap.getWidth();

            // 限定滑块范围
            if (newLeft < 0) {
                newLeft = 0; // 左边范围
            } else if (newLeft > maxLeft) {
                newLeft = maxLeft; // 右边范围
            }

            canvas.drawBitmap(mSlideSourceBitmap, newLeft, 0, mPaint);

        } else {

            if (mToogleState) {
                canvas.drawBitmap(mSlideSourceBitmap, getWidth() - mSlideSourceBitmap.getWidth(), 0, mPaint);
            } else {
                canvas.drawBitmap(mSlideSourceBitmap, 0, 0, mPaint);
            }
        }

        super.onDraw(canvas);
    }

    /**
     * 设置滑块响应触摸事件
     */

    @Override
    public boolean onTouchEvent(MotionEvent event) {

        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                mCurrentX = event.getX();
                isTouchMove = true;

                break;
            case MotionEvent.ACTION_UP:
                mCurrentX = event.getX();

                isTouchMove = false;

                //根据抬起的位置设置开关值
                mToogleState = mCurrentX > mSwitchBackgroundBitmap.getWidth() / 2;

                //设置监听
                if (mStateChangeListener != null) {
                    mStateChangeListener.onStateChangeListener(mToogleState);
                }

                break;
            case MotionEvent.ACTION_MOVE:
                mCurrentX = event.getX();

                break;
            default:
                break;
        }

        Log.e("MyToggleView", "MyToggleView onTouchEvent()" + mCurrentX);

        invalidate();

        return true;
    }

    /**
     * 设置滑块
     *
     * @param slideSource
     */
    public void setSlideSource(int slideSource) {
        mSlideSourceBitmap = BitmapFactory.decodeResource(getResources(), slideSource);

    }

    /**
     * 设置开关状态
     *
     * @param toogleState
     */
    public void setToogleState(boolean toogleState) {
        mToogleState = toogleState;
    }

    public void setOnStateChangeListener(OnStateChangeListener onStateChangeListener) {
        this.mStateChangeListener = onStateChangeListener;

    }

    /**
     * 设置监听接口
     */
    public interface OnStateChangeListener {
        void onStateChangeListener(boolean toogleState);
    }
}