5.2 Android 平台專屬導引精靈
5.2.3 Android 使用者介面元件
國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
62
圖 5-6:Review 顯示。
5.2.3 Android 使用者介面元件
Android 實作的轉換元件有:ATextView、AEditText、ARadioButton、ACheckbox、ASpinner、
Border、FileBrowser 和驗證工具 Validation 共八個類別進行定義,其中 AComponent 是 定義一個 Android 使用者介面元件的父類別。在此定義使用者介面元件,其主要是用來 具體呈現 Android 導引精靈頁面上進行資料收集的方法,專注於 Android 程式中常被使 用到的元件轉換為主,以下將會介紹幾個我們定義的 Android 使用者介面元件類別,隨 之附上 M2T 介面轉換的程式碼:
• ATextView:在導引精靈頁面上顯示一段文字。經過 M2T 轉換之後,每一 ATextView
‧
• AEditText:定義一個允許使用者進行編輯的單行(textfield)或多行(textarea)的文字或數 字編輯區塊,區塊長度可以透過 AEditText 的屬性加以定義。區別單行和多行的文字 輸入採用 EditText 在 XML 中的屬性 android:singleLine。若將其設為 true 將產生可進 行編輯的單行文字區塊,反之亦然。在 AEditText 內的屬性 reg 用來轉換從 PIM 過來 的 regular expression 字串,用來驗證使用者輸入正確與否,ATextView 與 AEditText 的 轉換的程式碼如圖 5-7 所示。
-text : string ATextView
-name : string -validate : string -reg : string
AEditText
android:text="«(componentset.components.get(0) as ATextView).text»"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/«"your_"+(componentset.components.get(1) as AEditText).name»"
android:singleLine="true"
android:singleLine="false"/>
圖 5-7:TextInput 於 Android 程式碼轉換(M2T)示意圖。
• ARadioButton:定義一個 ARadioButton 的物件,會對應至一個 Android 的 RadioGroup 與 RadioButton 兩個類別物件,在 RadioButton 裡的每一個選項都必須透過 Item 類別 定義,ARadioButton 轉換的程式碼如圖 5-8 所示。
‧
-name : string -title : string -value : string
ARadioButton -text : string
ATextView
readiobutton
<TextView
style="@style/WizardFormLabel"
android:text="«(componentset.components.get(0) as ATextView).text»"
android:id="@+id/«componentset.name»"/>
«IF (multicomponent instanceof ARadioButton) && (multicomponent as ARadioButton).title != null»
<RadioButton
android:id="@+id/«(multicomponent as ARadioButton).value»«componentvalue»"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="«(multicomponent as ARadioButton).title»"/>
«ENDIF»
«ENDFOR»
</RadioGroup>
PSM
-title : string -value : string
Item
-items 0..* 1
圖 5-8:AradioButton 於 Android 程式碼轉換(M2T)示意圖。
• ACheckBox:定義一個 ACheckbox 的物件,會對應至一個 Android 的 Checkbox 類別 物件,在 ACheckBox 裡的每一個選項都必須透過 Item 類別定義,ACheckBox 轉換的 程式碼如圖 5-9 所示。
-name : string -title : string -value : string
AChekBox -text : string
ATextView
checkbox
<TextView
style="@style/WizardFormLabel"
android:text="«(componentset.components.get(0) as ATextView).text»"
android:id="@+id/«componentset.name»"/>
<CheckBox
android:id="@+id/«(multicomponent as ACheckBox).value»«componentvalue»"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="«(multicomponent as ACheckBox).title»"/>
PSM
-title : string -value : string
Item
-items 1 0..*
圖 5-9:AcheckBox 於 Android 程式碼轉換(M2T)示意圖。
• ASpinner:定義一個下拉式選單的框架,會對應至一個 Android 的 Spinner 類別物件,
在 Aspinner 下拉是選項中的子元素都必須透過 Item 類別進行個別定義,ASpinner 轉 換的程式碼如圖 5-10 所示。
‧
-name : string-title : string -value : string
ASpinner -text : string
ATextView
dropdownmenu
<TextView
style="@style/WizardFormLabel"
android:text="«(componentset.components.get(0) as ATextView).text»"
android:id="@+id/«componentset.name»"/> -title : string
-value : string Item
-items 0..* 1
圖 5-10:Aspinner 於 Android 程式碼轉換(M2T)示意圖。
• Border:透過 XML 定義一個有邊線的矩形外框,將同一性質的問題以集合的方式呈 現。由於 Android 沒有 Border 的樣式可供選擇,因此必須另外設計外框樣式,Border 轉換的程式碼如圖 5-11 所示。
Border
-name : string AComponentSet
-subsets 1
0..*
-text : string ATextView
<TextView
style="@style/WizardFormLabel"
android:text="«(componentset.components.get(0) as ATextView).text»"
android:id="@+id/«componentset.name»"/>
<LinearLayout
style="@style/WizardLayoutStyle"
android:background="@drawable/borders">
«FOR subset:(componentset.components.get(1) as Border).subsets»
«layoutCompile(subset,componentvalue)»
• AFileBrowser:與上述幾個類別不同,此類別並不屬於 Android 元件的任何一部份,
但還是以 Android Button 元件來進行設計,主要功能是當使用者觸發此 AFileBrowser
‧
-text : string ATextView
AFileBrowser
filebrowser
<Button
android:id="@+id/btn«componentset.name»"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="«(componentset.components.get(0) as ATextView).text»"/>
<ImageView
android:id= "@+id/iv«componentset.name»"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
PSM
圖 5-12:AfileBrowser 於 Android 程式碼轉換(M2T)示意圖。
• Validation:用於驗證資料,藉由此類別描述 Android 導引精靈的輔助方法,目的是為 了增加文字對話框的邏輯運算,經常用來比對密碼是否輸入正確…等。而在 AEditText 中加入格式的規範(reg 屬性),以 Regular expression 的方式限制使用者輸入的字串,
如圖 5-13 所示。
-check_value : string -check_method : string
Validation
«IF (componentset.components.get(1) as AEditText).validate != null»
&& TextUtils.equals(mData.getString(
«validate_left((componentset.components.get(1) as AEditText) .validate.check_method)»_DATA_KEY),
mData.getString(«validate_right((componentset.components.get(1) as AEditText).validate.check_method)»_DATA_KEY))
«ENDIF»
«IF (componentset.components.get(1) as AEditText).reg != null»
&& Pattern.compile("«(componentset.components.get(1) as AEditText).reg»") .matcher(mData.getString(«(componentset.components.get(1) as AEditText).name»
_DATA_KEY)).matches()
«ENDIF»
-name : string -validate : string -reg : string
AEditText
-validate 0..1 1
PSM
圖 5-13:Validation 於 Android 程式碼轉換(M2T)示意圖。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
67