BMI App.

Presentation on theme: "BMI App."— Presentation transcript:

1 BMI App

2 實驗二: BMI App 實驗主題: 實驗目的: 環境需求: 建立一個計算身高體重的BMI值的Single View App
藉由實驗程式了解Storyboard可視化介面的使用以及 程式如何撰寫可以跟UI物件互動 切換鍵盤模式，使用IOS內建的數字輸入鍵盤 環境需求: Xcode 本實驗會提交一個可以輸入身高及體重的APP，輸入時身高體重數值時會切換IOS內建的數字鍵盤，輸入完身高體重後利用IBAction來觸發函式，函式中會去抓取身高及體重的數值，並計算BMI值 1

3 BMI App 範例 輸入身高體重，計算BMI並提醒過重或過輕
本實驗會提交一個可以輸入身高及體重的APP，輸入時身高體重數值時會切換IOS內建的數字鍵盤，輸入完身高體重後利用IBAction來觸發函式，函式中會去抓取身高及體重的數值，計算BMI值後，提醒使用者是否過重或是過輕 2

4 使用Xcode開發IOS App store 中搜尋Xcode並安裝執行Xcode
開發IOS 手機程式需要使用Xcode，若沒有Xcode可以在Mac 作業系統中的App store上輸入Xcode 免費下載安裝 3

5 創建專案 選擇Create a new Xcode project 開啟Xcode，並選擇第二個選項: 創建新專案 4

6 創建專案 選擇Single View Application 選擇創建單頁的App模板，Single View Application 5

7 創建專案 專案命名為BMI 將此專案命名為BMI。 6

8 介面拉取 在Main.storyboard可視化介面中，拖拉右側Label至畫面中 拖拉右側Label至Main.storyboard中 7

9 介面拉取 接著拖拉Text Field 至畫面中 拖拉右側TextField至Main.storyboard中 8

10 介面拉取 五個Label，兩個Text Field，一個Button的介面
最後拉好介面，共有五個Label，分別為身高、體重、BMI、BMI的值、以及顯示是否符合標準結果的Label，以及兩個文字輸入欄位Text Field用來輸入身高及體重的值，最後還有一個按鈕來觸發計算BMI的動作 9

11 撰寫程式 對身高及體重的Text Field，按右鍵拖拉到ViewController.h 中
或是按住Ctrl及左鍵拖拉到ViewController.h 中 開啟右上角的雙視窗，左邊為Main.Storyboard，右邊為ViewController.h，為了能在之後取到使用者所輸入的身高及體重數值，要將身高及體重文字輸入欄位連接到ViewController.h 中 10

12 撰寫程式 拖拉後產生的變數，分別取名為Height、Weight，BMI、Result
拖拉後，會自動根據被拖拉的對象，產生相對應型態的變數，例如在拖拉的是TextField ，就會自動產生IBOutlet UITextField 變數，總共拖拉兩個Text Field 及兩個 Label。 11

13 撰寫程式 接著拖拉”開始計算”Button到ViewController.m當中並取名為Excute
為了能讓按鈕按下以後的事件去執行相對應的函式，可以直接拖拉按鈕到ViewController.m當中並命名為Excute，產生一個IBAction類別的Excute函式，用來計算BMI值 12

14 撰寫程式 簡單的撰寫程式碼將取得的身高體重並計算
撰寫此函式計算BMI值，先抓取身高及體重的字串，利用關鍵字self，就可以簡單提取剛剛拖拉所產生的變數，Height、Weight、BMI、Result，在Height、Weight變數後使用Object-C呼叫函式的方式，隔一個空格打上內建函式Text，就會取得此Text Field裡面的字串，再呼叫floatValue函式，將字串轉為浮點數字。 這裡取得BMI數值為體重除以身高的平方，並且判斷是否低於18.5或是高於24，分別代表過輕或是過重，若在兩者之間則是BMI值剛剛好符合標準。 13

15 撰寫程式 記得將Text Field輸入改為Decimal pad數字鍵盤
將Keyboard型態改為Decimal pad 數字輸入來輸入身高及體重 14

16 撰寫程式 左上角選擇好模擬器並點選三角形按鈕，執行程式
要執行程式，只要在左上角選擇是要在設備或是模擬器上執行即可，接著點選三角形按鈕執行程式。 15

17 BMI App DEMO 輸入身高體重，計算BMI並提醒過重或過輕 範例檔案: BMI
這樣就完成了，執行時就會跑出我們的BMI APP，只要輸入身高及體重就會幫使用者測量BMI值及判斷使用者當前BMI是否符合標準了! 16