我們平時在使用手機app時，常常會發現當我們按下某個按鈕時相應按鈕會發生變化，當我們鬆手時又恢復了原來的樣子。或是，當你連續單擊同一個按鈕，會實現不同的功能。剛開始的時候感覺很神奇，那麼現在我們來揭開她的面紗，經過下面的學習我相信你也可以輕輕鬆鬆將其拿下！
一、單擊效果
首先看下將要實現的效果：
Android爲實現圖片按鈕按下的效果有兩種方式可以實現：一是增加代碼，二配置XML。
1.方式一：增加代碼實現
(1)main.xml佈局文件：通過android:src屬性設置初始背景圖片
<ImageButton
android:id="@+id/speak"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/speak" />
(2)在ImageButtonTest.java中
爲ImageButton註冊一個事件監聽器，然後根據事件動作爲ImageButton更改不同的背景圖片。
ImageButton btn=(ImageButton)findViewById(R.id.speak);
btn.setOnTouchListener(new OnTouchListener(){
@Override
public boolean onTouch(View v, MotionEvent event) {
if(event.getAction() == MotionEvent.ACTION_DOWN) //按下重新設置背景圖片
{
((ImageButton)v).setImageDrawable(getResources().getDrawable(R.drawable.speaking));
}
else if(event.getAction() == MotionEvent.ACTION_UP) //鬆手恢復原來圖片
{
((ImageButton)v).setImageDrawable(getResources().getDrawable(R.drawable.speak));
}
return false;
}
});
2.方式二：配置XML實現
Android中的按鈕有三種狀態—默認，被點擊，被選中。所以，如果要改變按鈕的外觀，需要對這三種情況都做出修改，也許在以往，我們最容易想到的就是，手動監聽按鈕的選中和點擊事件，然後寫代碼來替換按鈕的背景，但是在android中，我們不需要這麼麻煩，android早就替我們想好了解決方案，那就是selector資源。如果我們要實現按鈕的三種背景，只需在res/drawable目錄中建立這樣一個XML文件：
(1)在/res/drawable目錄下增加一個imagepress.xml文件，用於設置觸發按鈕時顯示不同的圖片效果
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="false" android:drawable="@drawable/speak"/>
<item android:state_focused="true" android:drawable="@drawable/speaking"/>
<item android:state_pressed="true" android:drawable="@drawable/speaking"/>
</selector>
注意：資源imagepress.xml文件可以存放到drawable目錄，也可以存放到layout目錄。
(2)在main.xml中配置ImageButton
<LinearLayout 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" >
<ImageButton
android:id="@+id/speak"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/imagepress" />
</LinearLayout>
注意：當使用XML來實現該效果時，ImageButton配置無需使用android:src屬性設置圖片而是使用android:background屬性指定我們設計好的imagepress.xml資源。
二、雙擊效果
所謂雙擊效果，即當第一次點擊按鈕與第二次點擊按鈕，不僅可以更換按鈕的背景圖片並且可以在一次按鈕被按下後所實現的功能是不同的。下面，我們通過selector資源來說實現按鈕背景效果更改。
1.第一次按下ImageButton圖片資源/res/drawable/firstpress.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_window_focused="false" android:drawable="@drawable/speaking"/>
<item android:state_focused="false" android:drawable="@drawable/speaking"/>
<item android:state_pressed="true" android:drawable="@drawable/speaking"/>
</selector>
2.再次按下ImageButton圖片資源/res/drawable/secondpress.xml(默認狀態)
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_window_focused="false" android:drawable="@drawable/speak"/>
<item android:state_focused="false" android:drawable="@drawable/speak"/>
<item android:state_pressed="true" android:drawable="@drawable/speak"/>
</selector>
注意：
android:drawable 放一個drawable資源
android:state_pressed 是否按下，如一個按鈕觸摸或者點擊。
android:state_focused 是否取得焦點，比如用戶選擇了一個文本框。
android:state_hovered 光標是否懸停，通常與focused state相同，它是4.0的新特性
android:state_selected 被選中，它與focus state並不完全一樣，如一個list view 被選中的時候，它裏面的各個子組件可能通過方向鍵，被選中了。
android:state_checkable 組件是否能被check。如：RadioButton是可以被check的。
android:state_checked 被checked了，如：一個RadioButton可以被check了。
android:state_enabled 能夠接受觸摸或者點擊事件
android:state_activated 被激活(這個麻煩舉個例子，不是特明白)
android:state_window_focused 應用程序是否在前臺，當有通知欄被拉下來或者一個對話框彈出的時候應用程序就不在前臺了
如果有多個item，那麼程序將自動從上到下進行匹配，最先匹配的將得到應用。（不是通過最佳匹配）
3.在MainActivity.java中爲定義的ImageButton註冊一個事件監聽器，並定義一個boolean類型標誌用來判定上一次使用的是那種背景資源並完成用戶自定義功能。
boolean pressPictureFlag=false;
final ImageButton btn=(ImageButton)findViewById(R.id.speak);
btn.setOnTouchListener(new OnTouchListener()/*按下與鬆手屬於兩個事件*/
{
@Override
public boolean onTouch(View v, MotionEvent event)
{
if(event.getAction() == MotionEvent.ACTION_DOWN)
{
if(pressPictureFlag==false)
{
btn.setBackgroundResource(R.drawable.pressd);
/*..................
功能代碼1*/
pressPictureFlag=true;
}
else
{
btn.setBackgroundResource(R.drawable.imagepress);
/*..................
功能代碼2*/
pressPictureFlag=false;
}
}
else if(event.getAction() == MotionEvent.ACTION_UP)
{
Toast.makeText(ImageButtonTetst.this, "操作成功！", Toast.LENGTH_SHORT).show();
}
return false;
}
});
注意：我們每次觸碰一次ImageButton會產生兩個事件，即按下事件和鬆手事件，而非只有一個事件。所以，在通過pressPictureFlag標識判定爲btn組件設置哪個背景資源時，主要是在按下這個事件實現，鬆手這個事件也必須實現但是可以不做任何事情或者彈出一些通知信息即可。
4.源碼舉例
實現一個ImageButton，當單擊btn按鈕時，btn背景資源改變並文本編輯框可編輯(默認不可編輯)；當再次單擊btn按鈕時，btn背景資源恢復原狀此時文本編輯框不可編輯。
(1)/src/MainActivity.java
package com.example.android_ui_imagebutton;
import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.EditText;
import android.widget.ImageButton;
import android.widget.Toast;
public class ImageButtonTetst extends Activity {
boolean pressPictureFlag=false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
final ImageButton btn=(ImageButton)findViewById(R.id.speak);
final EditText edit = (EditText)findViewById(R.id.edit);
btn.setOnTouchListener(new OnTouchListener(){ /*按下與鬆手屬於兩個事件*/
@Override
public boolean onTouch(View v, MotionEvent event)
{
if(event.getAction() == MotionEvent.ACTION_DOWN)
{
if(pressPictureFlag==false)
{
btn.setBackgroundResource(R.drawable.pressd);
edit.setFocusable(true);
edit.setFocusableInTouchMode(true);
edit.requestFocus();
pressPictureFlag=true;
}
else
{
btn.setBackgroundResource(R.drawable.imagepress);
edit.setFocusable(false);
pressPictureFlag=false;
}
}
else if(event.getAction() == MotionEvent.ACTION_UP)
{
Toast.makeText(ImageButtonTetst.this, "操作成功！", Toast.LENGTH_SHORT).show();
}
return false;
}
});
}
}
(2)main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<EditText
android:id="@+id/edit"
android:layout_width="match_parent"
android:layout_height="100dp"
android:focusable="false" />
<ImageButton
android:id="@+id/speak"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/speak" />
</LinearLayout>
(3)/res/drawable/secondpress.xml、/res/drawable/firstpress.xml見1、2.
注意：如果main.xml佈局文件中ImageButton使用android:src屬性設置圖片資源，那麼在Java程序中使用setImageResource(sector資源)。如果使用android:background屬性設置圖片資源，那麼在Java程序中使用setBackGround(sector資源)。
