APP專案 New_ChangeMoney
學習重點：1. 如何優化APP 2. 使用者介面中下拉式選單組件如何使用 3. 如何使用介面配置中組件，當作畫面編排的填充物
Embedded Files
情境主題
優化專案 ChangeMoney，使其成為一款更易於操作的行動裝置用 APP New_ChangeMoney。
情境演示-僅供參考
優化的基本方向
ChangeMoney專案無法從 APP 介面輸入匯率
ChangeMoney專案無法直接看出輸入金額與換算結果的幣別是甚麼？
換算按鈕需要兩個嗎？
製作流程
1.建立專案
專案 -> 新增專案 -> 名稱：New_ChangeMoney
2.畫面編排
組件面板 -> 使用者介面 -> 標籤 A
介面配置 -> 水平配置 * 2 BC
使用者介面 -> 下拉式選單、文字輸入盒 DE
介面配置 -> 水平配置 * 2 FG
使用者介面 -> 文字輸入盒、文字輸入盒 HI
介面配置 -> 水平配置 J
使用者介面 -> 按鈕、素材(箭頭) KL
介面配置 -> 水平配置 M
使用者介面 -> 文字輸入盒、文字輸入盒 NO
工作面板(Screen1)
組件列表
組件屬性
Screen1
應用說明 幣值換算
水平對齊 居中3
A.APP_標題
寬度 80比例
文字 臺日幣兌換試算APP
文字對齊 居中1
B.填充物1
高度 6像素
寬度 填滿
C.水平配置_試算金額
水平對齊 居中3
垂直對齊 居中2
高度 40像素
寬度 250像素
D.下拉幣別
高度 填滿
提示 下拉幣別選單
E.試兑金額
字體大小 18
高度 填滿
寬度 140像素
提示 輸入試兑金額
文字對齊 居中1
僅限數字 V
F.填充物2
高度 6像素
寬度 填滿
G.水平配置_匯率
水平對齊 居中3
垂直對齊 居中2
高度 40像素
寬度 250像素
H.匯率幣別
背景顏色 粉色
字體大小 18
高度 填滿
寬度 填滿
文字對齊 居中1
Readonly V
I.匯率比例
背景顏色 粉色
字體大小 18
高度 填滿
寬度 140像素
提示 輸入匯率
文字對齊 居中1
僅限數字 V
J.填充物3
高度 6像素
寬度 填滿
K.兌換鈕
字體大小 22
文字 兌換試算
文字對齊 居中1
L.箭頭_下
高度 用比例自行調整大小
寬度 用比例自行調整大小
圖片 下拉選擇用哪一張
M.水平配置_試兌結果
水平對齊 居中3
垂直對齊 居中2
高度 40像素
寬度 250像素
N.結果幣別
背景顏色 淺灰色
字體大小 18
高度 填滿
寬度 填滿
文字對齊 居中1
Readonly V
O.結果幣值
背景顏色 淺灰色
字體大小 18
高度 填滿
寬度 140像素
文字對齊 居中1
僅限數字 V
Readonly V
L.素材
上傳箭頭圖片
3.程式設計
4.測試修正
請參考測試 App 的環境和方法單元
Page updated
Report abuse