國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
19
表 2-10：Android 上實作 AbsoluteLayout 元件佈局。
<AbsoluteLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation=" vertical"
android:layout_weight="fill_parent"
android:layout_height="fill_parent" >
<EditText
android:layout_weight="fill_paren"
android:layout_height="wrap_content" />
<Button
android:layout_x ="250px"
android:layout_y ="40px"
android:layout_weight="70px"
android:layout_height="wrap_content"
android:text="Button" />
</ AbsoluteLayout >
圖 2-7：AbsoluteLayout。
2.4 Android 元件介紹
一個活動(Activity)上會所有的按鈕(Button)、文字(Text)、勾選框(CheckBox)等元件稱為 視圖(View)，View 之上其實會有一個佈局(Layout)去控制所有 View 的位置及其他特性，
一個簡單應用程式(Android Application)組件包含關係是 Application > Activity > Layout >
View。Android 可以由 Java 程式碼控制 Button 與 Text 等在 Activity 上的顯示和效果，
也可以透過編寫 XML 檔的方式實現，Eclipse 在編輯時提供一個圖形化介面(Graphical Interface)方便用戶設計所有元件的位置，同一時間 Eclipse 會產生對應的 XML 文件。圖 2-8 為 Android 元件的繼承關係圖，以下會介紹深色區塊的元件的功能與實作的效果。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
20
TextView
Button EditText
CompoundButton
ImageButton View
ImageView
CheckButton RadioButton
ViewGroup
AdapterView
AbsSpinner
ListView Spinner GridView
圖 2-8：Android 元件的繼承關係圖。
2.4.1 按鈕(Button)
Button 元件介面定義是透過 XML 所宣告並設定相關屬性而呈現，在處理 Button 的事件 上是由 Java 程式碼所控制，其中觸發事件是透過 Button.ClickListener 控制。表 2-11 為 Button 在 XML 中的宣告方式，圖 2-9 為螢幕上顯示的效果。
表 2-11：Android 上實作 Button 元件。
<Button android:layout_weight="wrap_content"
android:layout_height="wrap_content"
android:text="Click me!" />
圖 2-9：Button 元件。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
21
2.4.2 單選對話框(RadioButton)
RadioButton 繼承了 Button 按鈕，因此它們都可以直接使用 Button 支持的各種屬性和方 法。但與普通按鈕不同的是它們多了一個可選中的功能。RadioButton 和 CheckBox 都可 額外指定一個 android:checked 屬性，該屬性用於指定 RadioButton 和 CheckBox 初始時 是否被選中。RadioButton 的特點在於，能選擇選項中的其中一個。因此 RadioButton 通 常要與 RadioGroup 一起使用，用於定義一組單選按鈕。RadioButton 元件介面定義是透 過 XML 所宣告並設定相關屬性而呈現，在處理 RadioButton 的事件上是由 Java 程式碼 所控制，其中觸發事件是透過 RadioGroup.OnCheckedChangeListener 控制。表 2-12 為 RadioButton 在 XML 中的宣告方式，圖 2-10 為螢幕上顯示的效果。
表 2-12：Android 上實作 RadioButton 元件。
<RadioGroup android:orientation="horizontal"
android:layout_gravity ="center_horizontal"
android:id="@id/radioGroup"/>
<RadioButton android:layout_weight="wrap_content"
android:layout_height="wrap_content"
android:text="Man"/>
<RadioButton android:layout_weight="wrap_content"
android:layout_height="wrap_content"
android:text="Woman"/>
</ RadioGroup>
圖 2-10：RadioButton 元件。
2.4.3 多選對話框(CheckBox)
CheckBox 同 RadioButton 都繼承了 Button 按鈕，因此可直接使用 Button 支持的各種屬 性和方法。CheckBox 可額外指定一個 android:checked 屬性，該屬性用於指定 CheckBox 初始時是否被選中。CheckBox 的特點在於，能選擇多個項目；與 RadioButton 的不同之
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
22
處在於，只能選擇其中一個。CheckBox 元件介面定義是透過 XML 所宣告並設定相關屬 性而呈現，在處理 CheckBox 的事件上是由 Java 程式碼所控制，其中觸發事件是透過 CompoundButton.OnCheckedChangeListener 控制。表 2-13 為 CheckBox 在 XML 中的宣 告方式，圖 2-11 為螢幕上顯示的效果。
表 2-13：Android 上實作 CheckBox 元件。
<CheckBox android:layout_weight="wrap_content"
android:layout_height="wrap_content"
android:text="Man"/>
<CheckBox android:layout_weight="wrap_content"
android:layout_height="wrap_content"
android:text="Woman"/>
圖 2-11：CheckBox 元件。
2.4.4 表單顯示(ListView)
ListView 可以顯示多筆資料項目讓使用者瀏覽、選擇與執行後續的操作。ListView 的使 用需要搭配調配器(Adapter)，而 Adapter 的用途是用於連接資料和 ListView。它除了會 用在 ListView 中，另外也會用在下拉式選單(Spinner)的元件中。在處理 ListView 的事件 上是由 Java 程式碼所控制，其中觸發事件是透過 AdapterView.OnItemClickListener()控 制。表 2-14 為 ListView 在 XML 中的宣告方式，圖 2-12 為螢幕上顯示的效果。
表 2-14：Android 上實作 ListView 元件。
<ListView android:layout_weight="fill_parent"
android:layout_height="fill_parent"
android:id="@+id/listView"
android:text="@string/……" />
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
23
圖 2-12：ListView 元件。
2.4.5 文字顯示(TextView)
TextView 是一個主要用於處理文字的 View。表 2-15 為 ListView 在 XML 中的宣告方 式，圖 2-12 為螢幕上顯示的效果。
表 2-15：Android 上實作 TextView 元件。
<TextView android:layout_weight="wrap_content"
android:layout_height="wrap_content"
android:text="@string/……" />
圖 2-13：TextView 元件。
2.4.6 文字對話框(EditText)
EditText 繼承了 TextView 以及它所有的功能，是一個主要用於處理輸入資料的部分。
表 2-16 為 ListView 在 XML 中的宣告方式，圖 2-14 為螢幕上顯示的效果。
表 2-16：Android 上實作 TextView 元件。
<EditText android:layout_weight="wrap_content"
android:layout_height="wrap_content" />
圖 2-14：EditText 元件。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
24
2.4.7 下拉式選單(Spinner)
Spinner 是 ViewGroup 的間接子類別，因此在資料的使用上需要透過調配器(Adapter)進 行封裝才能使用。Spinner 具有一些選中選項的觸發事件，由於本身並沒有定義這些事 件，均繼承自間接父類別 AdapterView。常用的事件有：
• AdapterView.OnItemCLickListener(列表項目被點擊時觸發)，
• AdapterView.OnItemLongClickListener(列表項目被長按時觸發)，
• AdapterView.OnItemSelectedListener(列表項目被選擇時觸發)。
由於處理 Spinner 元件的過程較繁雜，因此 Android 官方有提供一套基本的 ArrayAdapter 以及 android.R.layout.simple_spinner_item，方便使用者採用預設的樣式實作。
表 2-17 為 Spinner 在 XML 中的宣告方式，圖 2-15 為螢幕上顯示的效果。
表 2-17：Android 上實作 Spinner。
<Spinner android:layout_weight="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/……"
android:text="@string/……"/>
圖 2-15：Spinner 元件。
2.4.8 圖像視圖(ImageView)
ImageView 圖像視圖，直接繼承自 View 類，它的主要功能是用於顯示圖片。實際上它 不僅僅可以用來顯示圖片，任何 Drawable【32】的對象都可以使用 ImageView 來顯示，
例如：利用 ImageView 顯示動畫。 ImageView 可以適用於任何佈局中，並且 Android 為