android自定义滑动开关控件，自定义view

我们都知道Android4.0以上才带有滑动开关Switch，那么在4.0以下呢，很多人会选择用CheckBox，放两张图片，但是这样子只能点击，效果不太好，所以我就自定义了滑动开关WiperSwitch这么一个控件，下面先把截图贴上吧，这蹩脚的图片真戳啊，大家可以自己换三张图片

package com.example.wiperswitch;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;

/**
 *
 * @author xiaanming
 *
 */
public class WiperSwitch extends View implements OnTouchListener{
    private Bitmap bg_on, bg_off, slipper_btn;
    /**
     * 按下时的x和当前的x
     */
    private float downX, nowX;

    /**
     * 记录用户是否在滑动
     */
    private boolean onSlip = false;

    /**
     * 当前的状态
     */
    private boolean nowStatus = false;

    /**
     * 监听接口
     */
    private OnChangedListener listener;


    public WiperSwitch(Context context) {
        super(context);
        init();
    }

    public WiperSwitch(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public void init(){
        //载入图片资源
        bg_on = BitmapFactory.decodeResource(getResources(), R.drawable.on_btn);
        bg_off = BitmapFactory.decodeResource(getResources(), R.drawable.off_btn);
        slipper_btn = BitmapFactory.decodeResource(getResources(), R.drawable.white_btn);

        setOnTouchListener(this);
    }

    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Matrix matrix = new Matrix();
        Paint paint = new Paint();
        float x = 0;

        //根据nowX设置背景，开或者关状态
        if (nowX < (bg_on.getWidth()/2)){
            canvas.drawBitmap(bg_off, matrix, paint);//画出关闭时的背景
        }else{
            canvas.drawBitmap(bg_on, matrix, paint);//画出打开时的背景
        }

        if (onSlip) {//是否是在滑动状态,
            if(nowX >= bg_on.getWidth())//是否划出指定范围,不能让滑块跑到外头,必须做这个判断
                x = bg_on.getWidth() - slipper_btn.getWidth()/2;//减去滑块1/2的长度
            else
                x = nowX - slipper_btn.getWidth()/2;
        }else {
            if(nowStatus){//根据当前的状态设置滑块的x值
                x = bg_on.getWidth() - slipper_btn.getWidth();
            }else{
                x = 0;
            }
        }

        //对滑块滑动进行异常处理，不能让滑块出界
        if (x < 0 ){
            x = 0;
        }
        else if(x > bg_on.getWidth() - slipper_btn.getWidth()){
            x = bg_on.getWidth() - slipper_btn.getWidth();
        }

        //画出滑块
        canvas.drawBitmap(slipper_btn, x , 0, paint);
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        switch(event.getAction()){
        case MotionEvent.ACTION_DOWN:{
            if (event.getX() > bg_off.getWidth() || event.getY() > bg_off.getHeight()){
                return false;
            }else{
                onSlip = true;
                downX = event.getX();
                nowX = downX;
            }
            break;
        }
        case MotionEvent.ACTION_MOVE:{
            nowX = event.getX();
            break;
        }
        case MotionEvent.ACTION_UP:{
            onSlip = false;
            if(event.getX() >= (bg_on.getWidth()/2)){
                nowStatus = true;
                nowX = bg_on.getWidth() - slipper_btn.getWidth();
            }else{
                nowStatus = false;
                nowX = 0;
            }

            if(listener != null){
                listener.OnChanged(WiperSwitch.this, nowStatus);
            }
            break;
        }
        }
        //刷新界面
        invalidate();
        return true;
    }



    /**
     * 为WiperSwitch设置一个监听，供外部调用的方法
     * @param listener
     */
    public void setOnChangedListener(OnChangedListener listener){
        this.listener = listener;
    }


    /**
     * 设置滑动开关的初始状态，供外部调用
     * @param checked
     */
    public void setChecked(boolean checked){
        if(checked){
            nowX = bg_off.getWidth();
        }else{
            nowX = 0;
        }
        nowStatus = checked;
    }


    /**
     * 回调接口
     * @author len
     *
     */
    public interface OnChangedListener {
        public void OnChanged(WiperSwitch wiperSwitch, boolean checkState);
    }


}

用法是，先定义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.example.wiperswitch.WiperSwitch
        android:id="@+id/wiperSwitch1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />


</RelativeLayout>

新建一个Activity

package com.example.wiperswitch;


import android.app.Activity;
import android.os.Bundle;
import android.util.Log;

import com.example.wiperswitch.WiperSwitch.OnChangedListener;

public class MainActivity extends Activity implements OnChangedListener {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //实例化WiperSwitch
        WiperSwitch wiperSwitch = (WiperSwitch)findViewById(R.id.wiperSwitch1);

        //设置初始状态为false
        wiperSwitch.setChecked(false);

        //设置监听
        wiperSwitch.setOnChangedListener(this);
    }


    @Override
    public void OnChanged(WiperSwitch wiperSwitch, boolean checkState) {
        Log.e("log", "" + checkState);
    }


}

代码全部上完了，写的不好的地方欢迎大牛指点！

哦，忘记了还有三张蹩脚的图片没传

 转载声明：http://chenkechao123.blog.163.com/blog/static/13833264820122125244145/

分享到：