Android使用者介面設計：基本按鈕

標籤：介面設計   layout   android應用   

Android使用者介面設計：基本按鈕

本文向你展示了在你的Android應用程式中建立一個簡單的Button或ImageButton控制項的步驟。首先，你會學到如何向你的布局檔案中添加按鈕控制項。然後你會學習如何用兩種方法處理使用者對按鈕的點擊。最後，我們討論Android中按鈕控制項一些其它的可用特性。

第1步：建立Android應用程式

我們從建立Android程式開始。你平常一樣完成你的Android應用。一旦你已經建立項目並可以運行，決定你希望向什麼樣的螢幕添加Button控制項。可能你就簡單地建立了一個使用預設活動和布局(main.xml)的新Android項目。這個教程將使用這種情況作例子。一旦你建立了你的Android項目，你就可以繼續學習這篇文章了。

第2步：使用Button控制項

Android SDK包含兩個在你的布局中可以使用的簡單按鈕控制項：Button（android.widget.Button）和ImageButton（android.widget.ImageButton）。這些控制項的功能很相似因此我們幾乎可以一併地的討論它們。這兩個控制項不相同的地方基本上就是外觀上；Button控制項有一個文字標籤，而ImageButton使用一個可繪製的映像資源來代替。Button使用的一個很好的例子應該是一個簡單的帶有“儲存”文字標籤的按鈕。ImageButton使用的一個很好的例子可能是音樂播放器按鈕的集合，包括播放P, 暫停 以及停止。

這裡是一個樣本螢幕，包括一個Button控制項（左邊）和一個ImageButton控制項（右邊）。

Android SDK還包含了一些其它更不為人知的從上面兩個基本按鈕類型繼承來的類按鈕控制項，包括CompoundButton，RadioButton，ToggleButton，和ZoomButton。要瞭解這些控制項的更多資訊，查看Android文檔。你也可以通過繼承合適的類並實現控制項行為來建立自訂控制項。

第3步：向布局添加Button控制項

Button控制項通常都被作為活動的布局資源檔一部分。比如，要添加一個Button控制項到與你程式相關的main.xml布局資源中，你必須編輯布局檔案。你可使用Eclipse的布局資源設計器，或者直接編輯XML。像按鈕這樣的控制項也可以通過程式動態地建立並在運行時添加到你的螢幕上。簡單地通過它的類來建立合適的控制項並將它添加到你的活動中的布局。

要添加一個Button控制項到布局資源檔，開啟/res/layout/main.xml布局檔案，它是你的Android項目的一部分。點擊你想要為其添加Button控制項的LinearLayout （或者父級布局控制項，比如RelativeLayout或FrameLayout）。在Eclipse中，你可以點擊Outline標籤中的父級布局，然後使用綠色加號按鈕添加一個新的控制項。選擇你要添加的控制項——在這個例子中是Button控制項。

要配置Button控制項的外觀，選中該控制項並通過在屬性標籤中改變屬性值來調節控制項的屬性。下面是一些你會想知道的特別的屬性：

• 使用id屬性給Button或ImageButton一個唯一的名字;
• 使用文字屬性設定Button控制項上要顯示的文字；
• 使用src屬性設定ImageButton控制項上要顯示的圖片。
• 將控制項的布局高度和布局寬度屬性設定為wrap_content.
• 設定任何其它屬性來調整控制項的外觀。比如，使用文本顏色，文字大小和文本樣式屬性來調整Button的字型。

下面是用來產生前段中展示的螢幕的布局資源檔的內容。它包括三個控制項。

RelativeLayout組織螢幕上的控制項，也就是兩個子控制項，一個Button和一個ImageButton，如下：

<pre name="code"><?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center"> <Button android:id="@+id/Button01" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello" android:minHeight="92dp" android:textSize="22dp" android:onClick="onMyButtonClick"></Button> <ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/skater" android:id="@+id/ImageButton01" android:layout_toRightOf="@+id/Button01"></ImageButton> </RelativeLayout> </pre>

第4步：處理點擊

現在，如果你運行你的程式，按鈕控制項顯示出來了，但是如果你點擊它們不會有任何反應。現在應該來處理控制項上的點擊事件了。有好幾種方法可以做到。

讓我們從簡單的方法開始吧。Button和ImageButton控制項有一個叫onClick的屬性（在屬性面板裡叫“On Click”）。你可以通過這個屬性設定要處理點擊事件的方法名，然後在你的活動中實現這個方法。比如，你可以將你的Button控制項屬性設定為onMyButtonClick。在XML中，這個屬性將如下所示：

android:onClick="onMyButtonClick"

然後，在你的活動類，你需要實現這個方法。它應該是一個帶有單個參數（一個View對象）的公有的void方法。例如，下面的按鈕點擊實現了當Button控制項被點擊時在螢幕產生一個訊息框：

public void onMyButtonClick(View view) { Toast.makeText(this, "Button clicked!", Toast.LENGTH_SHORT).show(); }

當你點擊這個Button控制項，onMyButtonClick()方法被調用，在螢幕上顯示一個訊息。你的Button按鈕能做什麼就取決於你自己了。顯示了當點擊Button按鈕時訊息是如何展示的：

第5步：處理點擊——實現OnClickListener

實現點擊事件處理的另一種方法是使用setOnClickListener()方法向你的按鈕控制項註冊一個新的View.OnClickListener。這種方式代替了將你布局資源中的按鈕控制項的On Click屬性設定為一個你必須實現的方法的方式，你可以在你的活動中動態地做這些事情。雖然這可能看起來有很多額外的代碼要寫，但至少理解它是非常重要的，因為在一些控制項上點擊不是需要處理的唯一事件。我們將要向你展示的程式應用了其它的事件，比如長按。

要使用這個方法，你必須更新你的活動類以註冊控制項點擊事件。通常情況下通過你的活動的onCreate()方法來實現。使用findViewById()方法找到控制項然後使用它的setOnClickListener()方法來定義當它被點擊時的行為。你將需要自己去實現介面的onClick()方法。比如，下面的代碼（位於活動的onCreate()方法中）為我們的ImageButton控制項註冊了一個點擊處理器。

ImageButton myImageButton = (ImageButton) findViewById(R.id.ImageButton01); myImageButton.setOnClickListener(new View.OnClickListener() { public void onClick(View v) { Toast.makeText(BasicButtonActivity.this, "ImageButton clicked!", Toast.LENGTH_SHORT).show(); } });

同樣地，你可以使用這個技術來實現長按點擊處理，通過使用控制項的setOnLongClickListener()方法。

總結

按鈕控制項在Android程式中經常會用到。在這個快速教程中你學習了如何建立兩種不同的Android按鈕控制項：Button和ImageButton。你也學習了實現這些類型按鈕控制項的按鈕點擊事件處理的幾種方法。（註：原文RockUX–WEB 點此查看英文。）

http://mobile.51cto.com/design-254382.htm