UITableView控件使用
使用UITableView,在控件库中,拖拽一个Table View到ViewController中,在Controller的后台代码中需要继承UITableViewDelegate和UITableViewDataSource的协议。 重写方法 tableView(_:numberOfRowsInSection) 此方法是UITableViewDataSource协议的方法,返回tableView加载的行数。 实例代码 func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int { // Return the number of rows in the section. //返回table中每个节点行数,在tableView中还可以使用节,就是组。后续介绍组的用法 return restaurantNames.count } tableView(_:cellForRowAtIndexPath) 此方法是UITableViewDatSource协议的方法,该方法中实现如何加载TableView中的数据。 实例代码 func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) ->UITableViewCell { //这里是的Cell是在Storyboard中设置的tableViewCell的Identifier let cellIdentifier = "Cell" //这就是获取单元格 let cell = tableView.dequeueReusableCellWithIdentifier(cellIdentifier, forIndexPath: indexPath) as UITableViewCell // Configure the cell... cell.textLabel.text = restaurantNames[indexPath.row] return cell } dequeueReusableCellWithIdentifier:从queue中取回一个名称是[identifier]的可用的单元格。这里为什么是从列队中取:看如下解释:
设置dataSource和delegate
两种方式设置tableView的dataSource和delegate
- 在Storyboard中右键选择tableView
将dataSource和delegate拖动到当前的ViewController上
- 在Controller的代码中,链接tableView
@IBOutlet var tableView: UITableView! 然后再viewDidLoad的方法中设置tableView的dataSource和delegate tableView.dataSource = self tableView.delegate = self
设置单元格的缩略图
在tableView(_:cellForRowAtIndexpath)的方法中 cell.imageView.image = UIImage(name:"imagename")
隐藏状态栏
override func prefersStatusBarHidden() -> Bool { return true }
修改Custom属性
在storyboard中选择tableViewCell,在属性索引器中,将Style的属性变更为Custom
修改tableView行高
修改单元格行高
自定义单元格样式
在控件库中,可以拖拽控件到单元格中拜访出自己想要的格式
为自定义单元格创建类文件
在工程中添加新文件(command + N),选择Cocoa Touch Class,在SubClass of中选择UITableViewCell,不需要xib文件。 在类文件中定义控件 @IBOutlet weak var nameLabel: UILabel! @IBOutlet weak var locationLabel: UILabel! @IBOutlet weak var typeLabel: UILabel! @IBOutlet weak var thumbnailImageView: UIImageView!
关联类文件和控件定义
设置tableViewCell的class为新建的class
设置控件关联
关联后结果
修改获取单元格的方法
在tableView(_:cellForRowAtIndexpath)的方法中,把原来的获取单元格的方法修改 let cell = tableView.dequeueReusableCellWithIdentifier(cellIdentifier, forIndexPath: indexPath) as UITableViewCell 修改后 let cell = tableView.dequeueReusableCellWithIdentifier(cellIdentifier, forIndexPath: indexPath) as CustomTableViewCell CustomTableViewCell就是我们新定义的类 设置单元格 cell.nameLabel.text = restaurantNames[indexPath.row] cell.thumbnailImageView.image = UIImage(named: restaurantImages[indexPath.row])
如何设置图片圆角
代码实现: cell.thumbnailImageView.layer.cornerRadius = cell.thumbnailImageView.frame.size.width / 2 cell.thumbnailImageView.clipsToBounds = true clipsToBounds是一个属性开关,只有打开,圆角设置才有效 设置实现: 选择ImageView控件,做如下设置
在User Defined Runtime Attributes中添加key 和 value。 这时不需要设置开关。 同样,我们可以在这里修改backgroundColor,Fond…
单元格选择和UIAlertController
在UITableViewDelegate的协议中,有两个方法 tableView(_:willSelectRowAtIndexpath) 选择前 tableView(_:didSelectRowAtIndexpath) 选择后
设置单元格选中
let cell = tableView.cellForRowAtIndexPath(indexPath) 通过indexPath来获取单元格的时候会产生一个Bug,前面我们有讲过,Cell的加载是通过queue中获取,受queue的印象,在获取cell的时候,会有错位的Bug,解决这个问题的方法是通过控制数据源来解决。 通过设置cell的accessoryType来设置cell的选中状态 cell.accessoryType = UITableViewCellAccessoryType.Checkmark
UIAlertController的使用
实例代码我们写在tableView(_:didSelectRowAtIndexpath)的方法中 override func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) { // Create an option menu as an action sheet let optionMenu = UIAlertController(title: nil, message: "What do you want to do?", preferredStyle: .ActionSheet) // Add actions to the menu let cancelAction = UIAlertAction(title: "Cancel", style: .Cancel, handler: nil) //$0表示第一个参数,这里关闭闭包用法可以参考语法笔记 let sender = $0 let cell = tableView.cellForRowAtIndexPath(indexPath) cell?.accessoryType = .Checkmark self.restaurantIsVisited[indexPath.row] = true }
UIAlertView
UIAlertView类似UIAlertController中的Action,使用相对简单 let alertView = UIAlertView(title:"", message:"", delegate:nil, cancelButtonTitle:"") alertView.show()
TableRow的删除
在UITableViewDataSource的协议中有个方法 tableView(_:commitEditingStyle:forRowAtIndexPath 在ViewController的类中重写该方法,不做任何实现可以看到如下效果 override func tableView(tableView: UITableView, commitEditingStyle editingStyle:UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) { }
当点击删除按钮,如果要做相关操作,可以在上述方法中实现 实例代码: override func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) { if editingStyle == .Delete { // Delete the row from the data source self.restaurantNames.removeAtIndex(indexPath.row) self.restaurantLocations.removeAtIndex(indexPath.row) self.restaurantTypes.removeAtIndex(indexPath.row) self.restaurantIsVisited.removeAtIndex(indexPath.row) self.restaurantImages.removeAtIndex(indexPath.row) //删除row self.tableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: .Fade) } //重新加载tableView self.tableView.reloadData() }
添加RowAction
在IOS 8 SDK中有个新成员UITableViewRowAction,利用这个新成员,我们可以在Row上面有更多的操作
- 重写UITableViewDataSource的一个方法tableView(_:editActionsForRowAtIndexPath)
- 创建UITableViewRowAction
var shareAction = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "Share", handler:nil)
- 实现Action后的委托
- 返回RowAction
实例代码: override func tableView(tableView: UITableView, editActionsForRowAtIndexPath indexPath: NSIndexPath) -> [AnyObject] { var shareAction = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "Share", handler: { (action:UITableViewRowAction!, indexPath:NSIndexPath!) -> Void in let shareMenu = UIAlertController(title: nil, message: "Share using", preferredStyle: .ActionSheet) let twitterAction = UIAlertAction(title: "Twitter", style: UIAlertActionStyle.Default, handler: nil) let facebookAction = UIAlertAction(title: "Facebook", style: UIAlertActionStyle.Default, handler: nil) let emailAction = UIAlertAction(title: "Email", style: UIAlertActionStyle.Default, handler: nil) let cancelAction = UIAlertAction(title: "Cancel", style: UIAlertActionStyle.Cancel, handler: nil) shareMenu.addAction(twitterAction) shareMenu.addAction(facebookAction) shareMenu.addAction(emailAction) shareMenu.addAction(cancelAction) self.presentViewController(shareMenu, animated: true, completion: nil) } ) var deleteAction = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "Delete",handler: { (action:UITableViewRowAction!, indexPath:NSIndexPath!) -> Void in // Delete the row from the data source self.restaurantNames.removeAtIndex(indexPath.row) self.restaurantLocations.removeAtIndex(indexPath.row) self.restaurantTypes.removeAtIndex(indexPath.row) self.restaurantIsVisited.removeAtIndex(indexPath.row) self.restaurantImages.removeAtIndex(indexPath.row) self.tableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: .Fade) } ) return [deleteAction, shareAction] }
|
请发表评论