[android] 切換按鈕-自訂控制項

標籤：

準備兩張圖片，按鈕背景，上面的小開關

建立一個類MyToggleBtn，繼承View

實現三個構造方法，傳遞上下文，

實現構造方法，傳遞Context對象，在java代碼中執行個體化時主要使用這個

實現構造方法，傳遞Context對象，AttributeSet對象，在布局檔案中主要使用

 

View對象顯示在螢幕上，有幾個重要步驟

1.構造方法建立對象

2.測量view的大小 onSeasure(int,int)

3.確定view的位置，view自身有一些建議權，決定權在父view手中 onLayout()

4.繪製view的內容 onDraw(Canvas)

 

構造方法，初始化view，

調用BitmapFactory.decodeResurce()方法，把圖片資源轉成Bitmap對象，參數：Resource對象（getResources()），資源id

 

重寫onMesaure()方法，

不要調用父類

調用setMeasuredDimension()方法，參數：寬度，高度；調用背景Bitmap對象的getWidth()和getHeight()

 

重寫onDraw()方法，傳遞進來Canvas對象

調用Canvas對象的drawBitmap()方法，參數：Bitmap對象，左邊點（0），上邊點（0），Paint對象

擷取Paint對象，new出來

調用Paint對象的setAntiAlias()，設定消除鋸齒，參數：布爾值

 

 

滑動按鈕

滑動按鈕目前的位置，0，0，狀態是 關

canvas.drawBitmap(bitmapBtn, 0, 0, paint);

滑動按鈕的位置在，背景圖的寬度-滑動按鈕的寬度，0，狀態是 開

canvas.drawBitmap(bitmapBtn, 背景圖的寬度-滑動按鈕的寬度, 0, paint);

 

定義成員變數currentState儲存目前狀態，值：布爾值

調用setOnClickListener()方法，設定點擊事件，參數：this

當前類實現obClickListener介面，實現onClick()方法

切換目前狀態currentState=!currentState

 

判斷目前狀態

如果為真，滑動按鈕的左邊是背景圖的寬度-滑動按鈕的寬度

如果為假，滑動按鈕的左邊是0

調用invalidate()方法，重新整理當前視圖

MyToggleBtn.java

 

package com.tsh.myswitchbtn;import android.content.Context;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.Canvas;import android.graphics.Paint;import android.util.AttributeSet;import android.view.View;import android.view.View.OnClickListener;public class MyToggleBtn extends View implements OnClickListener {    //背景圖片    private Bitmap bitmapBackground;    //按鈕圖片    private Bitmap bitmapBtn;    private Paint paint;    /**     * 布局檔案中使用     * @param context     * @param attrs     */    public MyToggleBtn(Context context, AttributeSet attrs) {        super(context, attrs);        initView();    }    /**     * 初始化view     */    private void initView() {        bitmapBackground=BitmapFactory.decodeResource(getResources(), R.drawable.switch_background);        bitmapBtn=BitmapFactory.decodeResource(getResources(), R.drawable.slide_button);        paint=new Paint();        paint.setAntiAlias(true);        //點擊事件        setOnClickListener(this);    }    /**     * 計算大小     */    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        setMeasuredDimension(bitmapBackground.getWidth(), bitmapBackground.getHeight());    }    //目前狀態    private boolean currentState=false;    //滑動按鈕的當前left    private float slideBtnLeft=0;    /**     * 繪製view     */    @Override    protected void onDraw(Canvas canvas) {        //繪製背景        canvas.drawBitmap(bitmapBackground, 0, 0, paint);        //繪製滑動按鈕        canvas.drawBitmap(bitmapBtn, slideBtnLeft, 0, paint);    }    /**     * 點擊事件     */    @Override    public void onClick(View v) {        currentState=!currentState;        if(currentState==true){            slideBtnLeft=bitmapBackground.getWidth()-bitmapBtn.getWidth();        }else{            slideBtnLeft=0;        }        invalidate();    }}

 

布局：

<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"    tools:context="${relativePackage}.${activityClass}" >    <com.tsh.myswitchbtn.MyToggleBtn        android:layout_centerInParent="true"        android:id="@+id/my_toggle_btn"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        /></RelativeLayout>

 

[android] 切換按鈕-自訂控制項