第五章 用戶界面基礎(chǔ)(ImageButton)

參考資料:
《An?droid應(yīng)用程序開發(fā)》ISBN 9787302283164
參考軟件:
Android Studio、Eclipse+ADT、Android SDK、JDK
用戶界面基礎(chǔ)(接上節(jié)內(nèi)容)
四、ImageButton
要制作帶圖標(biāo)的按鈕,首先要在布局文件中定義ImageButton,然后通過setImageDrawable方法來設(shè)置要顯示的圖標(biāo)。
注意:
我們可以在布局文件中就直接設(shè)置按鈕的圖標(biāo),如
android:src=”@drawable/icon1″
我們也可以在程序中設(shè)置自定義圖標(biāo)
imgbtn3.setImageDrawable(getResources().getDrawable(R.drawable.icon2));
我們還可以使用系統(tǒng)自帶的圖標(biāo)
imgbtn4.setImageDrawable(getResources().getDrawable(android.R.drawable.sym_call_incoming));
設(shè)置完按鈕的圖標(biāo)后,需要為按鈕設(shè)置監(jiān)聽setOnClickListener,以此捕獲事件并處理
下面的例子講述的是由4個圖標(biāo)按鈕組成的布局,其中三個按鈕的圖標(biāo)是自定義的,第四個按鈕的圖標(biāo)是系統(tǒng)的,當(dāng)點擊按鈕1的時候,彈出dialog,當(dāng)點擊按鈕2的時候,點擊確定后,可以將按鈕2的圖標(biāo)變成按鈕3的圖標(biāo),當(dāng)點擊按鈕3的時候,按鈕3的圖標(biāo)變成了系統(tǒng)打電話的圖標(biāo),點擊按鈕4,顯示一個提示dialog
ImageButtonTest.java源代碼
package?org.loulijun.imagebutton;
?
import?android.app.Activity;
import?android.app.AlertDialog;
import?android.app.Dialog;
import?android.content.DialogInterface;
import?android.os.Bundle;
import?android.view.View;
import?android.widget.Button;
import?android.widget.ImageButton;
import?android.widget.TextView;
?
public?class?ImageButtonTest?extends?Activity?{
? ??/** Called when the activity is firstcreated. */
? ? ? ? TextViewtextview;
? ? ? ? ImageButtonimgbtn1;
? ? ? ? ImageButtonimgbtn2;
? ? ? ? ImageButtonimgbtn3;
? ? ? ? ImageButtonimgbtn4;
? ??@Override
? ??public?void?onCreate(Bundle savedInstanceState) {
? ? ? ??super.onCreate(savedInstanceState);
? ? ? ?setContentView(R.layout.main);
?
? ? ? ?textview=(TextView)findViewById(R.id.textview);
? ? ? ??//分別取得4個ImageButton對象
? ? ? ?imgbtn1=(ImageButton)findViewById(R.id.imagebutton1);
? ? ? ?imgbtn2=(ImageButton)findViewById(R.id.imagebutton2);
? ? ? ?imgbtn3=(ImageButton)findViewById(R.id.imagebutton3);
? ? ? ?imgbtn4=(ImageButton)findViewById(R.id.imagebutton4);
?
? ? ? ??//分別為ImageButton設(shè)置圖標(biāo)
? ? ? ??//imgbtn1已經(jīng)在main.xml布局中設(shè)置了圖標(biāo),所以就不在這里設(shè)置了(設(shè)置圖標(biāo)即可在程序中設(shè)置,也可在布局文件中設(shè)置)
? ? ? ?imgbtn2.setImageDrawable(getResources().getDrawable(R.drawable.icon));//在程序中設(shè)置圖標(biāo)
? ? ? ?imgbtn3.setImageDrawable(getResources().getDrawable(R.drawable.icon2));
? ? ? ?imgbtn4.setImageDrawable(getResources().getDrawable(android.R.drawable.sym_call_incoming));//設(shè)置系統(tǒng)圖標(biāo)
?
? ? ? ??//下面為各個按鈕設(shè)置事件監(jiān)聽
? ? ? ?imgbtn1.setOnClickListener(new?Button.OnClickListener()
? ? ? ? {
? ? ? ? ?? ? ? ? ? ? ??@Override
? ? ? ? ?? ? ? ? ? ? ??public?void?onClick(View v) {
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ??// TODO Auto-generated method stub
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?Dialog dialog=new?AlertDialog.Builder(ImageButtonTest.this)
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setTitle("提示")
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setMessage("我是ImageButton1")
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setPositiveButton("確定",new?DialogInterface.OnClickListener() {
?
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ??@Override
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ??public?void?onClick(DialogInterface dialog,?int?which) {
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? ? ? ? ??// TODO Auto-generated method stub
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? ? ? ? ??//相應(yīng)的處理操作
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? }
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?}).create();
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?dialog.show();
? ? ? ? ?? ? ? ? ? ? ? }
?
? ? ? ? });
?
? ? ? ? imgbtn2.setOnClickListener(newButton.OnClickListener()
? ? ? ? {
? ? ? ? ?? ? ? ? ? ? ??@Override
? ? ? ? ?? ? ? ? ? ? ??public?void?onClick(View v) {
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ??// TODO Auto-generated method stub
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?Dialog dialog=new?AlertDialog.Builder(ImageButtonTest.this)
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setTitle("提示")
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setMessage("我是ImageButton2,我要使用ImageButton3的圖標(biāo)")
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setPositiveButton("確定",new?DialogInterface.OnClickListener() {
?
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ??@Override
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ??public?void?onClick(DialogInterface dialog,?int?which) {
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? ? ? ? ??// TODO Auto-generated method stub
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? ? ? ? ?imgbtn2.setImageDrawable(getResources().getDrawable(R.drawable.icon2));
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? }
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?}).create();
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?dialog.show();
? ? ? ? ?? ? ? ? ? ? ? }
?
? ? ? ? });
?
? ? ? ?imgbtn3.setOnClickListener(new?Button.OnClickListener()
? ? ? ? {
? ? ? ? ?? ? ? ? ? ? ??@Override
? ? ? ? ?? ? ? ? ? ? ??public?void?onClick(View v) {
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ??// TODO Auto-generated method stub
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?Dialog dialog=new?AlertDialog.Builder(ImageButtonTest.this)
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setTitle("提示")
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setMessage("我是ImageButton3,我想使用系統(tǒng)打電話的圖標(biāo)")
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setPositiveButton("確定",new?DialogInterface.OnClickListener() {
?
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ??@Override
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ??public?void?onClick(DialogInterface dialog,?int?which) {
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? ? ? ? ??// TODO Auto-generated method stub
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? ? ? ? ?imgbtn3.setImageDrawable(getResources().getDrawable(android.R.drawable.sym_action_call));
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? }
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?}).create();
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?dialog.show();
? ? ? ? ?? ? ? ? ? ? ? }
?
? ? ? ? });
?
? ? ? ?imgbtn4.setOnClickListener(new?Button.OnClickListener()
? ? ? ? {
? ? ? ? ?? ? ? ? ? ? ??@Override
? ? ? ? ?? ? ? ? ? ? ??public?void?onClick(View v) {
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ??// TODO Auto-generated method stub
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?Dialog dialog=new?AlertDialog.Builder(ImageButtonTest.this)
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setTitle("提示")
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setMessage("我是使用的系統(tǒng)圖標(biāo)")
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?.setPositiveButton("確定",new?DialogInterface.OnClickListener() {
?
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ??@Override
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ??public?void?onClick(DialogInterface dialog,?int?which) {
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? ? ? ? ??// TODO Auto-generated method stub
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? ? ? ? ??//相應(yīng)的處理操作
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?? ? ? ? }
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?}).create();
? ? ? ? ?? ? ? ? ? ? ? ? ? ? ?dialog.show();
? ? ? ? ?? ? ? ? ? ? ? }
?
? ? ? ? });
? ? }
}
布局文件main.xml
<?xml version="1.0"?encoding="utf-8"?>
<LinearLayout?xmlns:android="http://schemas.android.com/apk/res/android"
? ??android:orientation="vertical"
? ??android:layout_width="fill_parent"
? ??android:layout_height="fill_parent"
? ? >
<TextView
? ? ? ??android:id="@+id/textview"
? ??android:layout_width="fill_parent"
? ??android:layout_height="wrap_content"
? ??android:text="ImageButton測試案例"
? ? />
<ImageButton
? ? ? ??android:id="@+id/imagebutton1"
? ? ? ??android:layout_width="wrap_content"
? ? ? ??android:layout_height="wrap_content"
? ? ? ??android:src="@drawable/icon1"
/>
<ImageButton
? ? ? ??android:id="@+id/imagebutton2"
? ? ? ??android:layout_width="wrap_content"
? ? ? ??android:layout_height="wrap_content"
/>
<ImageButton
? ? ? ??android:id="@+id/imagebutton3"
? ? ? ??android:layout_width="wrap_content"
? ? ? ??android:layout_height="wrap_content"
/>
<ImageButton
? ? ? ??android:id="@+id/imagebutton4"
? ? ? ??android:layout_width="wrap_content"
? ? ? ??android:layout_height="wrap_content"
/>
</LinearLayout>
運行效果如下:

點擊第一個按鈕后

點擊確定后,點擊第二個按鈕

點擊確定,此時會看到按鈕二的圖標(biāo)編程和按鈕三的圖標(biāo)一樣了

點擊按鈕三

點擊確定后,發(fā)現(xiàn)按鈕三的圖標(biāo)變成了系統(tǒng)打電話的圖標(biāo)

點擊按鈕四

?