iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 16
1
Mobile Development

iOS APP 使用Swift打造一個外送平台APP (以foodpanda、Uber Eats為例) 系列 第 17

[Day 16] Swift 餐廳詳細餐單資訊實作 (一)

簡要

上一篇已經將下拉特效實作好
這篇要做一些簡單的設置
並且將上篇的特效也添加進來
還有一些小細節需要控制
來看看原生 Uber eat下方如何實作

首頁 tableView

這裏需要將tableView跳轉到餐廳資訊
之前的tableView介紹好像沒寫到cell點擊事件
這次順便介紹一下
今天一直寫錯無法執行
我目前使用的是得是Swift 5.0
使用didSelectRowAtIndexPath一直沒辦法實作
後面去看一下原來簡化成 didSelectRowAt
大家可以試試看

錯誤

func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
  
}

正確

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath){

}

pushViewController

pushViewController是navigationController的一種跳轉方式
跳轉到不同的controller裡面
可以選擇是否要動畫
之前是可以重寫動畫
但此篇不會實作部分 簡單運用就可以了
只要跳轉到我們詳細餐廳資訊 controller

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath){
    self.navigationController?.pushViewController(DetailViewController(), animated: true)
}

Demo

navigationBar + tabBar 隱藏顯示

原生的餐廳詳細資訊裡面
是沒有 navigationBar + tabBar
因為我們底層已經有新增
如果跳轉過去的頁面
是不需要這兩個Bar的話是可以隱藏的
避免有時候需要上面或下面的Bar
先來看如果沒隱藏的狀態

因為上面的Bar也會吃到高度
會造成其他UI跑版
所以在設計的時候記得在viewWillAppear設置
這樣進入的時候就會先隱藏
不會有延遲

navigationBar

//隱藏
navigationController?.setNavigationBarHidden(true, animated: animated)

//顯示
navigationController?.setNavigationBarHidden(false, animated: animated)

tabBar

//隱藏
self.tabBarController?.tabBar.isHidden = true

//顯示
self.tabBarController?.tabBar.isHidden = true

餐廳詳細資訊 tableView

這裏與上一篇程式碼一樣
幾乎沒有改變
只有客製化cell有改變
tableView相關看這裡
[Day 15] Swift TableView 下拉放大頂部圖片 下拉放大封面照 (下)

客製化cell

https://ithelp.ithome.com.tw/upload/images/20191001/201122710sAPZT6lmi.png

全部完成以後來執行一下
Demo


上一篇
[Day 15] Swift TableView 下拉放大頂部圖片 下拉放大封面照 (下)
下一篇
[Day 17] Swift 餐廳詳細餐單資訊實作 (二) - tableView header 控制
系列文
iOS APP 使用Swift打造一個外送平台APP (以foodpanda、Uber Eats為例) 31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言