介紹android的UI設計，包含EditText, ImageView, ImageButton, RadioButton，以及UI的事件觸發處理。

1. Android 程式設計(2)
講師:王瑋毅

2. 概要
• Android的UI設計
• EditText
• ImageView
• ImageButton
• RadioButton

3. Android UI – EditText(1/2)
• EditText 繼承自TextView，主要是用來讓使用
者輸入一些訊息

4. Android UI – EditText(2/2)
• EditText 的inputType屬性，常用整理如表格
屬性 功能描述
android:inputType=“none” 無。
android:inputType=“text” 任何字元。
android:inputType=“textCapCharacters” 全部字母大寫。
android:inputType=“textCapWords” 第一個字母大寫。
android:inputType=“textAutoCorrect” 自動修正。
android:inputType=“textMultiLine” 多行輸入。
android:inputType=“textEmailAddress” 電子郵件地址。
android:inputType=“textPassword” 密碼。
android:inputType=“number” 數字。
android:inputType=“phone” 電話鍵盤。

5. Android UI – ImageView(1/3)
• ImageView主要功能就是在畫面上顯示圖片

6. Android UI – ImageView(2/3)
• 設定ImageView 觸碰事件，按下時會變色

7. Android UI – ImageView(3/3)
• ScaleType屬性介紹，在圖片和ImageView大小不匹配時使用
屬性 功能描述
android:scaleType=“center” 當圖片比ImageView大時，會將圖片中央部分取出
來顯示。圖片比ImageView小時，會將圖片置中顯
示。
android:scaleType=“center
Crop”
當圖片比ImageView大/小時，會依圖片等比例縮放，
並置中顯示。
android:scaleType=“centerI
nside”
當圖片比ImageView大時，圖片等比例縮小，並置
中顯示。圖片比ImageView小時，圖片不縮放，並
置中顯示。
android:scaleType=“fitStart” 當圖片比ImageView大/小時，依圖片等比例縮放，
並置中靠上顯示。
android:scaleType=“fitEnd” 當圖片比ImageView大/小時，依圖片等比例縮放，
並置中靠下顯示。
android:scaleType=“fitXY” 圖片照ImageView大小顯示，延展顯示圖片，圖片
填滿ImageView。

8. Android UI – ImageButton(1/2)
• ImageButton 可顯示一個被點擊的圖片按鈕

9. Android UI – ImageButton(2/2)
• 設定ImageButton 點擊事件

10. Android UI – RadioButton(1/2)
• RadioButton 是一個單選按鈕，通常和
RadioGroup一起用
• RadioGroup 裡的RadioButton只會選出一個

11. Android UI – RadioButton(2/2)
• 在Activity 宣告onSelect這個方法，取得選擇事件

12. 謝謝大家