上一话我们实现了通过导航和控制器进行页面间的跳转,但是后一个页面是空的,本话来实现在跳转的同时,前一个页面向后一个页面传值,相信这也是大家什么关注的问题。首先我们来试一下跳转后的页面显示一张固定的图片。在我们上一话写的跳转后的页面控制器中DetaiViewController中先设一个全局变量cgImageView来显示图片,实例化的过程写到viewDidLoad方法中,我们挑了一张图片来显示,代码如下:
设置成ScaleAspectFit是最舒服的,还有其他的选项,大家感兴趣的可以自己试试,现在的效果如下:
然后回到viewController中,在我们切换页面的时候获取当前行的图片,把图片名称赋值给imageName属性。代码如下:
我们随便点两行看看效果:
这些方法实现了对表格的设置。
override func viewDidLoad() { super.viewDidLoad() self.view.backgroundColor = UIColor.whiteColor() cgImageView = UIImageView(frame: CGRectMake(0, 0, 320, 250)) cgImageView?.image = UIImage(named: "128.png") self.view.addSubview(cgImageView!) // Do any additional setup after loading the view. }
运行一下,点击某一栏可以看到如下界面:
可以发现跳转后的页面,我们的图片最上端被导航栏遮挡了一部分,因为你把cgImageView放到了导航控制器中,坐标是从屏幕顶部开始的,所以会被位于最上端的导航控制器所遮挡,如何解决这个问题呢?我们把cgImageView区域的起点向下设置就好了。做如下修改,再次运行看看结果
cgImageView = UIImageView(frame: CGRectMake(0, 65, 320, 250))
怎么样,是不是看着舒服多了?虽然图片显示完整了,但是可以看出图片有被拉伸过的痕迹,那我们再在代码中设置一项:
cgImageView?.contentMode = UIViewContentMode.ScaleAspectFit
设置成ScaleAspectFit是最舒服的,还有其他的选项,大家感兴趣的可以自己试试,现在的效果如下:
现在我们来试试传值,这需要使用set和get方法。在DetailViewController中写一个计算属性,如果不太懂的话,可以看我写的《Swift开发笔记3.Swift中setter和getter的基本用法》,计算属性如下,把对图片的操作语句从viewDidLoad中改写到set方法中,get暂时用不到,先返回一个空字符串
var imageName :String { set(newData){ if cgImageView == nil { cgImageView = UIImageView(frame: CGRectMake(0, 65, 320, 250)) } cgImageView?.image = UIImage(named: newData) cgImageView?.contentMode = UIViewContentMode.ScaleAspectFit self.view.addSubview(cgImageView!) } get { return "" } }
然后回到viewController中,在我们切换页面的时候获取当前行的图片,把图片名称赋值给imageName属性。代码如下:
let detail = DetailViewController() self.navigationController?.pushViewController(detail, animated: true) var image = restaurantImages[indexPath.row] detail.imageName = image
我们随便点两行看看效果:
现在在新页面的图片下面加一些信息,整个跳转页面控制器的完整代码如下:
import UIKit var cgImageView = UIImageView?() class DetailViewController: UIViewController,UITableViewDataSource,UITableViewDelegate { var imageName :String { set(newData){ if cgImageView == nil { cgImageView = UIImageView(frame: CGRectMake(0, 65, 320, 250)) } cgImageView?.image = UIImage(named: newData) cgImageView?.contentMode = UIViewContentMode.ScaleAspectFit self.view.addSubview(cgImageView!) } get { return "" } } override func viewDidLoad() { super.viewDidLoad() self.view.backgroundColor = UIColor.whiteColor() var tableY:CGFloat = 250 var tableHeight:CGFloat = 233 let tableView = UITableView(frame: CGRectMake(0, tableY, 320, tableHeight), style: .Plain) tableView.delegate = self tableView.dataSource = self self.view.addSubview(tableView) } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() } func numberOfSectionsInTableView(tableView: UITableView) -> Int { return 1 } func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return 4 } func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell { let indentfier = "detailCell" var cell = UITableViewCell(style: .Default, reuseIdentifier: indentfier) cell.textLabel?.text = "hello" + String(indexPath.row) return cell } }
我们加入了一个四行的tableView,参照之前的用法,注意datasource和delegate都是自身,这样控制器类本身还得继承UITableViewDataSource和UITableViewDelegate。
继承之后需要在类中实现父类的方法
func numberOfSectionsInTableView(tableView: UITableView) -> Int { return 1 } func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return 4 } func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell { let indentfier = "detailCell" var cell = UITableViewCell(style: .Default, reuseIdentifier: indentfier) cell.textLabel?.text = "hello" + String(indexPath.row) return cell }
这些方法实现了对表格的设置。