[Swift 教學] Swift 訂飲料App (附程式碼)

swiftOrderApp

最近參加了彼得潘的iOS App程式設計入門,此篇將會利用Firebase Database串接Swift來打造訂飲料App,如果對Swift開發有興趣的朋友,推薦參加Peter的課程唷!

此次的相關代碼放置於:https://github.com/hsuanchi/Swift_Demo/tree/master/orderAppExample

一. 最終App畫面:

二. 架構:

可以分成三個Scene,分別是Menu、訂購飲料和訂單資料

  • Menu Scene
    • ViewController
    • MenuListTableViewCell
  • 訂購飲料 Scene
    • OrderMaxTableViewController
  • 訂單資料 Scene
    • ShowOrderTableViewController

頁面一:Menu Scene

1.首先用struct來定義Menu頁內清單的型別

2.因為UIViewController中無法拉Label,所以建立UITableViewCell來針對介面中的Label設定Outlet,並寫了update func來更新表單中的資料,詳細設定如下:

3.設定UIViewController內Sections和Cell行數,以及Cell要傳入的資料

4.最後用prepare將所選到的cell資料傳遞到下個頁面

頁面二:訂購飲料 Scene

訂購飲料
訂購飲料

1.利用setCellData(with: cellData!)來接收上一頁傳遞來的資料,並用cellData.名稱來取得細項

2.當使用者點擊送出訂單按鈕時,先判斷是否都有填入資料,如果判斷成功將會把資料送到Firebase Database,然後再利用self.performSegue(withIdentifier: “sendOrderDB”, sender: nil)來將畫面跳轉至下一個頁面

頁面三:訂單資料 Scene

1.從Firebase中撈取過去下單資料,並append進list中,再撈完資料後利用DispatchQueue.main.async{self.tableView.reloadData()}來讓tableView reload,這樣就可以顯示出所有訂單的資料囉!

2.讓使用者點擊cell後,可以移除此筆訂單;可以看到alert這邊是在定義待會跳出來的視窗畫面,而addAction裡面刪除db資料庫資料和刪除List 內資料,是在使用者按下確認後開始進行的動作

相關延伸閱讀:

[Swift 教學] Swift 訂飲料App 結束囉,感謝收看,有關Max行銷誌的最新文章,都會發佈在Max的Facebook粉絲專頁,如果想看最新更新,還請您按讚或是追蹤唷!

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *