延續前一章按鈕事件的應用範例重新設計一個具有背景圖的按鈕，讓按鈕有美觀的背景圖片，只是這次不使用先前的Button Widget，而是改以ImageButton Widget來顯示。
將按鈕背景圖預先Import至Drawable裏（*.png圖形文件），利用這些圖片，作爲ImageButton的背景圖。爲了做對照，我們另外在Layout配置一個“一般按鈕”，運行結果畫面中，可以明顯看出圖片按鈕與一般按鈕在外觀上的差異。
一般來說，要設置ImageButton背景圖有許多方法，此程序使用的方法是ImageButton.setImage- Resource()，需要傳遞的參數即是res/drawable/下面的Resource ID，除了設置背景圖片的方法外，程序需要用到onFocusChange與onClick等按鈕事件作爲按鈕事件單擊之後的處理，最後通過TextView來顯示目前圖片按鈕的狀態爲onClick、onFocus，或offFocus，並且同步更新按鈕的背景圖，讓User有動態交互的感覺。
src/irdc.ex04_02/EX04_02.java
主程序構造三個對象ImageButton、Button與TextView，並在ImageButton上設置onFocus ChangeListener與onClickListener，並實現Image Button圖片的置換。
ImageButton.setOnFocusChangeListener()是處理User單擊圖片按鈕之後需要處理的關鍵，當單擊圖片按鈕的瞬間，以ImageButton.setImageResource()來更換背景圖片。
/* import程序略 */
import android.view.View.OnClickListener;
import android.view.View.OnFocusChangeListener;
public class EX04_02 extends Activity
{
/*聲明三個對象變量(圖片按鈕,一般按鈕,與TextView)*/
private ImageButton mImageButton1;
private Button mButton1;
private TextView mTextView1;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
/*通過findViewById構造三個對象*/
mImageButton1 =(ImageButton) findViewById(R.id.myImageButton1);
mButton1=(Button)findViewById(R.id.myButton1);
mTextView1 = (TextView) findViewById(R.id.myTextView1);
/*通過OnFocusChangeListener來響應ImageButton的onFous事件*/
mImageButton1.setOnFocusChangeListener(new OnFocusChangeListener()
{
public void onFocusChange(View arg0, boolean isFocused)
{
// TODO Auto-generated method stub
/*若ImageButton狀態爲onFocus改變ImageButton的圖片
* 並改變textView的文字*/
if (isFocused==true)
{
mTextView1.setText("圖片按鈕狀態爲:Got Focus");
mImageButton1.setImageResource(R.drawable.iconfull);
}
/*若ImageButton狀態爲offFocus改變ImageButton的圖片
*並改變textView的文字*/
else
{
mTextView1.setText("圖片按鈕狀態爲:Lost Focus");
mImageButton1.setImageResource(R.drawable.iconempty);
}
}
});
/*通過onClickListener來響應ImageButton的onClick事件*/
mImageButton1.setOnClickListener(new OnClickListener()
{
public void onClick(View v)
{
// TODO Auto-generated method stub
/*若ImageButton狀態爲onClick改變ImageButton的圖片
* 並改變textView的文字*/
mTextView1.setText("圖片按鈕狀態爲:Got Click");
mImageButton1.setImageResource(R.drawable.iconfull);
}
});
/*通過onClickListener來響應Button的onClick事件*/
mButton1.setOnClickListener(new OnClickListener()
{
public void onClick(View v)
{
// TODO Auto-generated method stub
/*若Button狀態爲onClick改變ImageButton的圖片
* 並改變textView的文字*/
mTextView1.setText("圖片按鈕狀態爲:Lost Focus");
mImageButton1.setImageResource(R.drawable.iconempty);
}
});
}
}
除了在運行時用onFocus()與onClick()事件來設置按鈕背景圖片外，Android的MVC設計理念可以讓程序運行之際初就以xml定義的方式來初始化ImageButton的背景圖，這僅需先將圖片導入res/drawable。
設置方法爲在res/drawable下自行定義一個xml，主要針對按鈕的state_focused、state_pressed與drawable屬性作設置，如下所示：
drawable/advancedbutton.xml
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_focused="true"
android:state_pressed="false"
android:drawable="@drawable/btnfocused" />
<item
android:state_focused="true"
android:state_pressed="true"
android:drawable="@drawable/btnfocusedpressed" />
<item
android:state_focused="false"
android:state_pressed="true"
android:drawable="@drawable/btnpressed" />
<item android:drawable="@drawable/btndefault" />
</selector>
然後，在main.xml中將advancedbutton賦值給Button組件中background的屬性。
layout/main.xml
<Button
android:id="@+id/myButton1"
android:background="@drawable/advancedbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android