[Swift] #5 ㄟ！你渴不渴 — 訂飲料 App

渴了就喝可不可

你渴不渴是一個設計用來團購飲料的 App，使用者可於登入後選擇飲料並送出訂單，接著從團購明細查看所有參與團購的用戶們的訂單。

本次作業請求了天使下凡協助開發，這是共同開發者帳號：

Inés Jo - Medium

以下是這款精美 App 的堅強開發陣容：

流程設計：天使
畫面排版與操作邏輯：天使
打醬油：巴黎人
資料來源：可不可

Screenshot

基本操作

啟動 App 時會先到登入頁面，這時需要輸入使用者名稱。

登入頁面須驗證名稱，限 2 至 6 個中英文字。

因為巴黎人沒那麼多時間記住別人的名字，特地要求天使限制只能輸入 2 至 6 個中英文字。名稱使用正規表達式來驗證是否合法，可參考LoginViewController。

天使：「喔！沒辦法！聖潔的天使需要呼應信徒的要求。」

登入後的初始頁面，中間較大的區塊是期間限定分類的飲料，下方的小區塊則是經典茶飲分類的飲料。

這個頁面天使用了神技：兩個 CollectionView，這意味著世上只有兩種生物：一是天使，再來是其他生物。CollectionView 的 Delegate 共用了 CollectionViewDataSource 的方法以及 IBSegueAction，可參考 HomeViewController。

經典茶飲中有四個小分類分別為：單品茶、調茶、雲蓋以及歐蕾，點擊這四個按鈕切換經典茶品的分類。

透過按按鈕可以動態替換 table 的 data source，就像世上的人總是在變，但美麗的天使卻是永恆不變的。

點擊畫面上任一款飲料，進入飲品選購頁面，左右滑動選擇飲料的尺寸、甜度與冰塊。

App 一打開的時候自 Assets 的 Data set 載入所有飲料的資料，為了能全域拿到這些資料，將其放到靜態類別 Models\GlobalConfig 中的成員變數 。

選定飲料的規格後，按下送出訂單即完成訂購，並提示訂單已送出。

所有請求 API 的程式碼包裝成 class，並使用了委派模式（Delegate），可參考 Services\HttpClient、Protocols\HttpDelegate。另外用於API JSON 編碼解碼的物件都放在 Http 目錄下。

由初始頁面右上方點擊團購明細按鈕，可以檢閱團購清單。資料尚未載入時顯示讀取中的動畫。

載入資料完成後將顯示總杯數與金額。用戶名稱的外框形狀會隨機改變。

若尚未有任何訂單時，顯示暫無訂單之提示。

操作影片

GitHub 連結

GitHub — thinklikes/kebuke

結論

約十年前巴黎人剛踏入社會，那時候工作地點是在公司二樓，二樓辦公室只有我跟另一位同事，一共兩個人。而樓下辦公室除了有公司的內勤職員外，還有關係企業的夥伴一起租用辦公室。

公司位在一個偏僻的地方，附近也沒有任何超商，每天都是關係企業的夥伴幫我們訂便當，那時他們也常常訂飲料，而我老是因為某些緣故，總是沒有跟到團，也許是太邊緣了 （T^T）。

後來有一次去訂便當時剛好他們在填飲料單，逮到機會的我三步併作兩步，跟一陣風似地終於順利訂到了一杯飲料 — “珍珠奶茶”。喜孜孜的我高興地走回辦公室，期待飲料的到來。

一陣電話鈴聲響起，話筒另一邊告知飲料來了，但因為正忙著想說晚點再去拿；等我過去拿的時候只剩一杯“綠茶”。頓時開始懷疑是不是我有問題，後來發現是有人拿錯，也收到退款了，只是肥宅的午後就這樣被破壞了。