100道iOSApp謎題 #20 訂飲料 App(1),上傳資料到後台
作業題目:
- 使用Dynamic Table View顯示飲料清單
- 把飲料Menu的文字檔拉進Assets裏面
- 在viewDidLoad裡把Menu的內容讀出來存在Array裏面
- 把飲料內容顯示在TableView上
2. 使用Static Table View製作飲料訂購單
- 在Menu點選飲料後,會自動把飲料名稱設定到訂購單中
做法:在DrinksTableViewController裡透過prepare把選到的飲料名稱傳到DrinkDetailTableViewController裏面
- 在DrinkDetailTableViewController的viewDidLoad把飲料名稱顯示出來
3. 送出飲料訂購單(doneButton)
- 先檢查名字有沒有填寫,若沒有就跳出提醒視窗
- 提醒視窗的實作:
- 將SegmentedController的index轉成字串:
這裡自定義一個function將index轉成字串,由於字串不同,所以使用closure來做變化:
- 是否加購珍珠則由Switch表示
- 最後就建立一個Order物件存放所有飲料細項
- 送出訂單後顯示進行中
上傳訂單的實作內容寫在OrderController的class裏面,這邊只需要將剛產生的新訂單當作參數傳進去(第93行)。呼叫postOrder之後,會在背景執行上傳的動作,此時會進入第99行~第103行,建立一個ActivityIndicator顯示在畫面上,表示目前訂單正在上傳中。當postOrder執行完畢之後,會執行第94行~第97行,跳出提醒視窗表示訂購完成。按下OK之後就呼叫popViewController回到飲料Menu的頁面。
- 上傳訂單(使用SheetDB)
連結SheetDB的步驟:
用Google帳號註冊登入SheetDB
新增一個Google Sheet並在第一列設定資料名稱
資料名稱和自定義的型別的property是一樣的
將Google Sheet設爲公開
將Google Sheet連結貼到SheetDB中
複製API連結放進程式碼中
參考API Documentation
- 使用POST新增資料
- @escaping的運用
postOrder
的參數有兩個,一個是要上傳訂單order,另一個是上傳結束後要執行的動作,這邊使用到closure: @escaping (String, String) -> Void
,在 uploadTask
執行結束時,呼叫 completion
並傳入 (String, String)
兩個參數,這兩個參數就會對應到呼叫postOrder時所定義的 (title, msg)
,接着就執行 in
後面的程式,也就是呼叫showAlert
。
同樣地 showAlert
也有自定義一個closure會在 okAction
結束時被呼叫:
4. 下載上傳的訂單
- 使用GET取得資料
在OrderListTableViewController的 viewDidLoad()
裏面呼叫 fetchOrders
下載訂單資料,下載還在進行時會顯示 activityIndicator
,下載結束後會得到訂單列表 orders
,呼叫 reloadData()
將訂單更新到TableView上。(和UI有關的動作要放在 DispatchQueue.main.async
裡執行)
5. 顯示訂單資料