黑马程序员技术交流社区
标题: swift实作app 交流分享五（資料傳遞) [打印本页]
作者: Kuhoku 时间: 2015-6-24 12:59
标题: swift实作app 交流分享五（資料傳遞)
本帖最后由 Kuhoku 于 2015-6-24 13:02 编辑
一行代码一场梦，大家好我是阿达，到目前为止我们已经可以选取一间餐厅显示他的相片，可是我们来想像一下，如果可以显示更多的细节，会不会更好呢？
今天阿达跟大家分享的部分有以下几点：
- 改善Food Pin App的细节以及显示更多的资讯。
- 自订导览列的外观
首先，我们就先来看看如何调整细节视图吧！
我们要准备在表格上列出餐厅资讯，包含名称、型态与位置的资讯。餐厅图片会移到上面一点的位置。
到Storyboard裡面，我們從元件褲裡面選取出 TableView，並拖曳到細節控制器（Detail View Controller），放在 View 下面，設定尺寸設定:
width: 320
height:568
完成了之后看到画面应该是如下图：
好的接下来就是选取表格视图，在属性检阅器中设定 prototype cell 为1
如此一来会将 prototype cell 加入表格视图中。
接下来我们把左手边栏位里面的 image view 放在 tableViewCell 上面
完成之后看起来就像这个样子
在属性检阅器选取表格视图cell 并设定识别码 ( Identifier) 为 『Cell』
再把栏位的高度设定为 36 。
接下来我们从元件库里面拖曳两个 label 到cell里面，一个命名为 『Field』，一个命名为『Value』 ,字体使用 『Avenir Next Medium，大小为14点。
座标位址跟大小其实就看个人喜欢，不过在这里阿达还是附上来给大家参考
Field :
X : 17 , Y : 8 , width : 70 , height : 20
Value :
X : 95 , Y : 8 , width : 210 , height : 20
好了，接下来我们要建立一个新的类别来控制我们的Cell ，按下快捷键command + N 之后选择 『Cocoa Touch Class 』之后继续，并且将它命名为『DetailTableViewCell』，将它设定为UITableViewCell。
选取刚建立的 DetailTableViewCell.swift，加入两个变数给Field以及 Value。当然，别忘记把cell 跟 DetailTableViewCell 做连接喔。
完成之后画面会像这样子的。
接下来我们要更新 DetailViewController 的内容，首先我们要加入代理器也就是，UITableViewDataSource,UITableViewDelegate 。
这里会发现有个报错，这是因为我们用了代理器，却还没有实作的关系，没有关系让我们继续看下去，之前我们宣告restaurantImage 变数来存放所选取的餐厅相片。因为我们要显示其他像是型态，位置方面的资讯，最好的方式是将它已 Restaurnat 物件来取代。
var restaurant: Restaurant!
接下来，因为图像已经包含在 restaurant 物件中，更新viewDidLoad 方法的程式如下：
self.restaurantImageView.image = UIImage(named:restaurant.image)
最后，就是来实作 UITableViewDataSource 协定的方法来填入餐厅的资讯：
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 4;
}
简单的说，跟tableview说，给我四个栏位吧！
有了四个栏位之后就是要往里面放资料啦，很多人在这里会使用 if 但是在这里，阿达想使用switch 因为swift 中 switch 实在太重要了。因为在swift中 switch 叙述经过明显的改良，相较于其他语言显得强大很多。
其中最大的差异就是当 case 实现的时候，他会自动进入下一个 case 。并不需要每一个 case 都加上一个 break 。
接下来就是重头戏啦！我们点选左手边 tableview 按下右键，将 dataSource 跟 delegate 连接给 DetailViewController 。
接下来就是大家最喜欢的 command + R 时间啦！
感觉是不是好棒棒的啊！？今天这个资料传递跟之前画面切换其实应该是一起写的，可惜篇幅实在太长，阿达最近想了很久，往后的帖子着重在制作流程，减少说明的部分，这样子可以更精简一点，因为最初的目的就是希望追完阿达十张帖子的小伙伴们，可以完成一个App。让小伙伴们一起享受做App的乐趣还有成就感，但是之后重点应该会放在制作流程上面，所以如果对于其中观念有问题的小伙伴，可以在下面留言，阿达会一起参与讨论喔！让我们用一行一行的代码，一步一步的实现我们的梦想，我是阿达，我们下回见！
作者: Kuhoku 时间: 2015-6-24 13:47
一如往常，附上項目下載：http://pan.baidu.com/s/1mgkUKvI
作者: xiaofei93 时间: 2015-6-24 14:04
很不错，就是感觉有些术语的叫法不是很一样，不过大同小异了
作者: chaoyueshan 时间: 2015-6-24 18:31
看不懂！
作者: 沙睿 时间: 2015-6-24 21:28
mark 支持！！！！！！！
作者: 离经叛道的女子 时间: 2015-6-24 22:17
加油....
作者: tabor 时间: 2015-6-24 22:47
这是极好的~~
作者: Kuhoku 时间: 2015-6-25 01:50
技術語這個問題我一直想辦法要同步，可是有的時候就是會忘記修改，之後考慮後面附上英文名這樣或許大家比較容易看懂
作者: Kuhoku 时间: 2015-6-25 01:51
可以從第一篇開始追喔 因為這是一篇按部就班來的
作者: Kuhoku 时间: 2015-6-25 01:53
你也加油喔！ 棒棒的！
作者: Kuhoku 时间: 2015-6-25 01:54
感謝小夥伴的支持 有興趣可以跟著做喔！
作者: 黑妞 时间: 2015-6-25 12:29
:hug:
作者: Kuhoku 时间: 2015-6-25 14:44
抱抱～黑妞辛苦了
| 欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) |
黑马程序员IT技术论坛 X3.2 |