自定義控件SlidingButton(開關)

自定義控件重要的兩個知識點:1.View的繪製流程 2.事件分發

View的繪製流程:

首先分清是ViewGroup還是View


View (沒有孩子):
measure(onMeasure)----draw(onDraw)(其中會先調用onMeasure方法,然後間接調用measure(),其中括號中的方法類似)

ViewGroup(有孩子):

measure(onMeasure)(設置自己大小,給孩子測量)-----layout(onLayout給孩子進行佈局)---->draw(但是很少會draw)


首先來看看案例的效果圖



佈局文件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.administrator.b.MainActivity">

    <com.example.administrator.b.view.SlidingButton
        android:id="@+id/slidingButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:sb_check="true"
        app:sb_bg="@drawable/slide_switch_background"
        app:sb_btn="@drawable/slide_button_background"
        android:layout_centerInParent="true"/>

</RelativeLayout>

講背景開關圖片和按鈕圖片在界面上顯示

設置大小並調用onDrawer()方法講其畫出來顯示

//給自己設置大小
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        setMeasuredDimension(mSbBg.getWidth(),mSbBg.getHeight());
    }

    //設置佈局:長得怎麼樣
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawBitmap(mSbBg,0,0,new Paint());
//        mLeftOffset=20;
        canvas.drawBitmap(mSbBtn,mLeftOffset,0,new Paint());
    }

對外提供接口

public  OnSwitchListener mOnSwitchListener;

    public void setOnSwitchListener(OnSwitchListener onSwitchListener) {
        this.mOnSwitchListener = onSwitchListener;
    }

    public  interface  OnSwitchListener {
        void  onSwitch(boolean swich);
    }

觸摸事件使開關可以滑動,設置左右邊界和超過一半的處理,和一些細節的處理

@Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:
                mDownX = event.getX();
                break;

            case MotionEvent.ACTION_MOVE:
                mMoveX = event.getX();
                int dx = (int) (mMoveX - mDownX+0.5f);
                mLeftOffset+=dx;
                // 處理左右邊界
                if (mLeftOffset<0){
                    mLeftOffset=0;
                }else if (mLeftOffset>mMaxOffset){
                    mLeftOffset=mMaxOffset;
                }
                invalidate();//會去調用onDraw();只能在ui線程中調用,如果非要在非ui線程中調用,就直接調用postInvalidate()
                mDownX=mMoveX;
                break;

            case MotionEvent.ACTION_UP:
                boolean isPathHalf=mLeftOffset>mMaxOffset/2;
                if (isPathHalf){
                    mLeftOffset=mMaxOffset;
                    if (mOnSwitchListener!=null&&mCheck!=isPathHalf){
                        mOnSwitchListener.onSwitch(true);
                        mCheck=true;
                    }
                }else {
                    mLeftOffset=0;
                    if (mOnSwitchListener!=null&&mCheck!=isPathHalf){
                        mOnSwitchListener.onSwitch(false);
                        mCheck=false;
                    }
                }
                invalidate();
                break;

        }
        return true;//此處涉及到事件分發的知識點,只有返回true,執行完ACTION_DOWN後,ACTION_MOVE與ACTION_UP才能執行,否則這兩個將不會執行到
    }

public class MainActivity extends AppCompatActivity {

    private SlidingButton mSb;

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

        mSb = (SlidingButton) findViewById(R.id.slidingButton);
    
        mSb.setOnSwitchListener(new SlidingButton.OnSwitchListener() {
            @Override
            public void onSwitch(boolean swich) {
                if (swich){
                    Toast.makeText(MainActivity.this, "open", Toast.LENGTH_SHORT).show();
                }else {
                    Toast.makeText(MainActivity.this, "close", Toast.LENGTH_SHORT).show();
                }
            }
        });
    }
}


Demo下載地址:http://download.csdn.net/detail/k2514091675/9808836



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章