Jollen's email: jollen # jollen.org

more: Jollen's Consulting | Jollen's Wiki

« Jollen 的 Android 教學,#13: 快顯訊息 android.widget.Toast | Home | Linux 2.6.30 釋出 »

Jollen 的 Android 教學,#14: 什麼是對話盒 (Dialog)?如何建立對話盒?

jollen 發表於 June 10, 2009 2:56 PM

最少的元件、最舒適的介面

自從有了圖形化應用程式之後,對話盒(dialog)一直是元老級的元件(widget);智慧型手機開始流行後,對話盒仍然是手機介面的重要圖形元件。

在Apple的iPhone問世後,觸控螢幕(touch screen)一直是智慧型手機的標準規格,因此傳統的滑鼠點擊(click)式介面,並不完全適合手指觸控的操作方式,再加上手機觸控螢幕尺吋較小,因此手機應用程式的介面設計,已經與傳統的桌面環境相當不同。

Android的元件庫考量了小尺吋的觸控螢幕,在基本元件的設計上,Android也為使用者做了很體貼的考量。以Android手機應用程式來說,經常使用的元件已經不再像過去的點擊式系統那麼多又複雜;以使用性的角度來看,常被使用的元件如下:

* 選單(Menu)
* 對話盒(Dialog)
* 快顯訊息(Toast)

使用以上三個元件,以及其「變化形」,就能建構一個好用的應用程式介面;再加上Android針對上述的手機操作特性,對其元件庫做了很好的使用設計,因此使用很少的元件,也能提供使用者一個舒適好用的操作介面。

何謂對話盒?

對話盒,故名其思,是一個讓應用程式與使用者「對話」的元件。應用程式透過對話盒與使用者進行下述的對話:

* 詢問問題:使用者回答 Yes/No
* 詢問偏好:使用者選擇自已偏好的項目,可以是單選,也可以是複選
* 說明狀態:讓使用者知道應用程式目前的狀態,例如:顯示「處理中」、「載入中」等訊息

Android提供的對話盒物件為android.app.Dialog,實作上繼承自Dialog的AlertDialog物件是最基本的對話盒物件。使用AlertDialog對話盒,可以詢問使用者問題,也可以詢問使用者偏好。接下來介紹AlertDialog對話盒的設計方法。

建立AlertDialog對話盒

延續「HelloMenu」範例,現在我們想要加入以下的使用情境:

* 使用者按下Menu鍵
* 使用者觸壓 “New Message” 選項
* 出現對話盒、詢問使用者 “Yes/No”

由以上的使用情境來看,應該在onOptionsItemSelected()裡判斷到R.id.new_message項目時,在UI上建立一個對話盒。以下是修改後的onOptionsItemSelected()完整程式碼,完整範例名稱為HelloAlertDialog:

public boolean onOptionsItemSelected(MenuItem item) {
    	int item_id = item.getItemId();
    	
    	switch (item_id){
    		case R.id.new_message: 
	    	        AlertDialog.Builder builder = new AlertDialog.Builder(this);
	    	        
	    	        builder.setMessage("Also post your message to Twitter?");
	    	        builder.setCancelable(false);
	    	        
	    	        builder.setPositiveButton("Yes", new DialogInterface.OnClickListener() {
	    	        	public void onClick(DialogInterface dialog, int id) {
	    	        	}
	    	        });
	    	        
	    	        builder.setNegativeButton("No", new DialogInterface.OnClickListener() {
	    	        	public void onClick(DialogInterface dialog, int id) {
	    	        	}
	    	        });   
	    	        
	    	        AlertDialog alert = builder.create();
	    	        alert.show();
    			break;
    		case R.id.quit: 
                Toast.makeText(
                        this,
                        "Going to quit.",
                        Toast.LENGTH_LONG).show();    			
    			break;
    		default: return false;
    	}
    	return true;
 }

dialog-1.png
圖1: Android的AlertDialog對話盒

產生AlertDialog物件的說明:

1. 產生AlertDialog.builder物件(dialog builder),這是一個用來建立對話盒內容的產生器物件

2. 設定dialog builder的顯示訊息-builder.setMessage()

3. 設定對話盒能不能被「取消」-builder.setCancelable()

4. 利用dialog builder在對話盒裡產生二個按鈕「Yes與No」-builder.setPositiveButton()與builder.setNegativeButton()
使用dialog builder來建立AlertDialog物件,AlertDialog是真正的對話盒物件-builder.create()

5. 將AlertDialog顯示在UI上-alert.show()

產生「Yes按鈕」的程式如下:

builder.setPositiveButton("Yes", new DialogInterface.OnClickListener() {
	public void onClick(DialogInterface dialog, int id) {
		}
});

呼叫builder.setPositiveButton()方法建立一個「正面(Yes)」的按鈕,參數說明如下:

1. 第一個參數:顯示在按鈕上的文字
2. 第二個參數:指定 click listener

每一個按鈕都需要一個click listener,當使用者觸壓按鈕時,click listener便被回呼。android.content.DialogInterface類別提供click listener物件。

--jollen

引用通告

如果您想引用這篇文章到您的Blog,
請複製下面的鏈接,並放置到您發表文章的相應界面中。

http://www.jollen.org/cgi-bin/mt3/mt-tb.cgi/637

發表一個評論

(您發表的意見將被立即接受,但需要一點時間與後端伺服器做同步,您的留言才會顯示在網站上。為避免 spam 攻撃,按「發表」後請輸入帳號密碼。使用者帳號:「nospam」、密碼:「nospam」。)

[Top] Copyright (C) 2006,2010 www.jollen.org.
All rights reserved. All content licensed under Creative Commons License.