UIKit - UITableView(表格视图)

UITableView用于将数据以列表的形式展示出来，以及一些其它的页面布局，在开发中经常会被用到!

1.创建UITableView

class TableViewController:UITableViewDelegate,UITableViewDataSource{
    
    //初始化表格
    func initTableView(){
        let rect  = CGRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.height)
        let table = UITableView(frame: rect)
        
            self.view.addSubview(table)
        
        //设置数据源和代理
        table.delegate = self
        table.dataSource = self
    }
 
}

2.必须实现的代理方法

//每组行数
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 2
}
    
//行高
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return 80
}

//设置每行Cell样式
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
       let cell = UITableViewCell.init(frame: CGRect(x: 0, y: 0, width: self.view.frame.width, height: 80))
        
       let label = UILabel(frame:CGRect(x: 30, y: 0, width: self.view.frame.width, height: 80))
            label.text = "第\(indexPath.row)行"
            cell.addSubview(label)
        
      return cell
}

3.表格组的设置

//有多少组
func numberOfSections(in tableView: UITableView) -> Int {
     return 3
}

//设置组头标题
func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
    return "第\(section)组头标题"
}

//设置组头样式
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        //UITableViewHeaderFooterView
        let label = UILabel(frame: CGRect(x: 50, y: 0, width: 100, height: 50))
            label.text = "   第\(section)组头标题"
            label.textColor = UIColor.white
            label.backgroundColor = UIColor.blue
        return label
}

//设置头高度
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
  return 60
}



//设置组尾标题
func tableView(_ tableView: UITableView, titleForFooterInSection section: Int) -> String? {
    return "第\(section)组尾标题"
}

//设置组尾部样式
func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
    return nil
}

//设置组尾部高度
func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
    return 30
}

注:viewForHeaderInSection和titleForHeaderInSection、heightForHeaderInSection是冲突的，如果设置了viewForHeaderInSection就显示其中的样式，对组的尾部设置也是一样的

4.组索引设置

//设置组索引(索引数组的键对应section值)
func sectionIndexTitles(for tableView: UITableView) -> [String]? {
    return ["A","B","C","D","E"]
}
    
//返回索引标题在索引组中的位置
func tableView(_ tableView: UITableView, sectionForSectionIndexTitle title: String, at index: Int) -> Int {
        NSLog("\(title):\(index)")
        return index
 }

5.行编辑操作

//是否可以编辑行
func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool {
    return true
}

//自定义行操作按钮
func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {
   //创建编辑按钮
   let editButton = UITableViewRowAction(style: .normal, title: "编辑") { (UITableViewRowAction, IndexPath) in
        NSLog("执行编辑动作")
    }
        editButton.backgroundColor = UIColor.blue
        
   let topButton = UITableViewRowAction(style: .normal, title: "置顶") { (UITableViewRowAction, IndexPath) in
        NSLog("执行置顶动作")
   }
        topButton.backgroundColor = UIColor.red
        
   return [topButton,editButton]
}

注:如果不重写自定义操作事件，默认会有一个删除按钮事件(向左滑动就会出现)

//修改默认删除按钮的文字
func tableView(_ tableView: UITableView, titleForDeleteConfirmationButtonForRowAt indexPath: IndexPath) -> String? {
    return "删除"
}
    
//设置行编辑标示 none:只能移动;delete:即能移动也能删除;insert:即能移动也能删除
func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) -> UITableViewCellEditingStyle {
        return UITableViewCellEditingStyle.delete
}
    
//删除按钮响应时间
func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
        //NSLog("删除后响应事件")
        
        if( editingStyle ==  UITableViewCellEditingStyle.delete ){
            
            //如果有数据源，可以先删除数据源
            //dataArr.remove(indexPath.row)    
            
            //删除行            
            let indexPaths = [indexPath]
            tableView.deleteRows(at: indexPaths, with:.automatic)
        }
    }

注：测试过程中发现不写删除数据源，点击删除按钮时，会发生崩溃现象

//编辑前调用
func tableView(_ tableView: UITableView, willBeginEditingRowAt indexPath: IndexPath) {
    NSLog("第\(indexPath.row)将开始编辑")
}

//执行完编辑动作
func tableView(_ tableView: UITableView, didEndEditingRowAt indexPath: IndexPath?) {
    NSLog("行编辑完成")
}

6.行选中高亮

//点击cell,是否有高亮效果 true:有(默认);false:无
func tableView(_ tableView: UITableView, shouldHighlightRowAt indexPath: IndexPath) -> Bool {
     return true
}


//设置行选中高亮
 func tableView(_ tableView: UITableView, didHighlightRowAt indexPath: IndexPath) {
     NSLog("第\(indexPath.row)行被选中")
 }
 
//解除行选中高亮
 func tableView(_ tableView: UITableView, didUnhighlightRowAt indexPath: IndexPath) {
     NSLog("第\(indexPath.row)行解除高亮")
}

8.行选中

//行被选中前
func tableView(_ tableView: UITableView, willSelectRowAt indexPath: IndexPath) -> IndexPath? {
    NSLog("第\(indexPath.row)行被选中前")
    return indexPath
}
    
//选中当前行(可用于设置自定义跳转)
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
     NSLog("第\(indexPath.row)行被选中")
}
    
//选中结束,返回当前行索引
func tableView(_ tableView: UITableView, willDeselectRowAt indexPath: IndexPath) -> IndexPath? {
     NSLog("第\(indexPath.row)行结束选中")
     return indexPath
}

9.显示菜单

//是否显示菜单
func tableView(_ tableView: UITableView, shouldShowMenuForRowAt indexPath: IndexPath) -> Bool {
    return true
}
   
//菜单执行事件
func tableView(_ tableView: UITableView, performAction action: Selector, forRowAt indexPath: IndexPath, withSender sender: Any?) {
    NSLog("执行菜单里面的事件")
}

效果如下图: