自定義android控制開始或暫停的按鈕

最近的一些個人小作品經常要用到一些控制開始或者暫停的圖片按鈕（類似音樂播放軟件控制音樂播放或暫停的按鈕），現放出來給大家分享下。

主要功能：點擊一次就更換為另一種狀態，再點擊一次就更換回原來的狀態。

首先，我們需要一個layout文件

control_button.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    
</LinearLayout>

一個簡單的LinearLayout布局文件，當然，如果你要RelativeLayout也行，這個因個人愛好而設置，對后面的功能實現不會產生多大的影響。

接着，定義一個resourse文件，用來定義一些Button的屬性。

ChangeButton.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="ChangeButton">
        <attr name="start" format="reference" />
        <attr name="stop" format="reference" />
    </declare-styleable>
</resources>

給Button定義兩個屬性，一個是表示開始的狀態，另一個表示結束的狀態。

接下來就是最關鍵的部分了（自我認為挺關鍵的）

創建一個類繼承LinearLayout（這個看你的layout文件是用哪種布局，因為我上面使用LinearLayout,所以就繼承LinearLayout）

ChangeButton.java

package view;
import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.LinearLayout;

public class ChangeButton extends LinearLayout {
    /**
     * 命名空間
     */
    private static String NAMESPACE = "http://schemas.android.com/apk/res/com.cmb.music";
    /**
     * 存放第一張圖片在R文件中的Int值，默認為0
     */
    private int startImage = 0;
    /**
     * 存放第二張圖片在R文件中的Int值，默認為0
     */
    private int stopImage = 0;
    /**
     * 判斷處於哪個狀態，默認為false
     */
    private boolean isStart = false;
    
    /**
     * 構造函數1
     * @param context
     */
    public ChangeButton(Context context) {
        super(context);
        initView();
    }
    
    /**
     * 構造函數2
     * @param context
     */
    public ChangeButton(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView();
    }
    
    /**
     * 構造函數2
     * @param context
     */
    public ChangeButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        // 獲取圖片的Int值
        startImage = attrs.getAttributeResourceValue(NAMESPACE, "start", R.drawable.start);
        stopImage = attrs.getAttributeResourceValue(NAMESPACE, "stop", R.drawable.stop);
        initView();
    }
    
    public boolean isStart(){
        return isStart;
    }
    /**
     * 初始化函數
     */
    private void initView(){
        View.inflate(getContext(), R.layout.item_control_button, this);
        this.setClickable(true);
        if(stopImage == 0){
            return ;
        }else{
            setIsStart(isStart);
        }
    }
    /**
     * 通過傳進一個boolean值，設置按鈕的狀態
     * @param isStart 設置開始或者暫停的狀態
     */
    public void setIsStart(boolean isStart){
        this.isStart = isStart;
        if(isStart){
            this.setBackgroundResource(startImage);
        }
        else{
            this.setBackgroundResource(stopImage);
        }
    }
}

關於命名空間，就是http://schemas.android.com/apk/res/+包名，不懂得請先看看xml里面關於命名空間的相關資料，這里就不再說明。
startImage，stopImage，正如注釋所講的就是狀態圖片在R文件中的int值，用於接收用戶自己定義的兩張圖片。

對於三個構造函數，

第一個構造函數是在該組件沒有屬性沒有樣式時調用的，這里我們不用到。

第二個構造函數是當該組件在聲明時調用了樣式時調用的，這里我們也用不到。

第三個構造函數是在該組件在聲明時只有屬性時調用的，我們主要用到的就是這個函數。

在第三個構造函數中，用我們前面定義的startImage和stopImage接收start和stop屬性。

寫完這個類，我們的按鈕就基本完成了，將它放入main_layout.xml文件中試試。

main_layout.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:cmb="http://schemas.android.com/apk/res/com.example.changebutton"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.changebutton.MainActivity" >

    <com.example.changebutton.ChangeButton
        android:id="@+id/btn_control"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_centerInParent="true"
        cmb:start="@drawable/start_selector"
        cmb:stop="@drawable/stop_selector" >
    </com.example.changebutton.ChangeButton>

</RelativeLayout>

不要忘了命名空間哦，這個很重要。

接下來，在MainActivity.java文件里面配置一下

MainActivity.java

package com.example.changebutton;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.View.OnClickListener;

public class MainActivity extends ActionBarActivity {

    ChangeButton mChangeButton;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mChangeButton = (ChangeButton) findViewById(R.id.btn_control);
        mChangeButton.setOnClickListener(new OnClickListener() {
            
            @Override
            public void onClick(View v) {
                mChangeButton.setIsStart(!mChangeButton.isStart());
            }
        });
    }
    
}

按鈕完成，現在可以測測看了。

 

 

總結：第一次寫博客，心里有點小緊張，有錯誤的地方希望大家能幫我指出。

附上源代碼：http://pan.baidu.com/s/1cdW84A