自定义UITableview左滑菜单按钮

UITableview滑动菜单从iOS8开始就已经推出，方便的接口和良好的用户体验，成为了iOS区别于安卓的又一个特性，很多App中都使用到了这个特性。不过，系统默认的样式太过简陋，而Apple至今都没有给出友好的自定义方法。查看了许多教程，往往都需要遍历整个tableview，尤其是iOS11后对View的层级进行了调整，使得遍历查找更加麻烦。下面，我将提供一个更取巧的方法给大家。

屏幕快照 2018-01-12 10.06.03.png

方法其实很简单，我们在StoryBoard或XIB中画控件的时候，将我们的自定义View添加到Cell的右侧，给定约束，其中最重要的是该自定义View到Cell右侧的距离。根据AutoLayout的设定，无论Cell在屏幕的哪里，右侧的自定义View都会保持在Cell右侧与其保持一个固定的距离。这样，当我们向左拖动Cell的时候，右侧的View也会被一并拖过来。就是这！么！简！单！
剩下的工作比较简单，我们需要给UITableview添加editActions事件，否则Cell是无法拖动的。创建的UITableViewRowAction需要将backgroundColor设置为UIColor(red: 0, green: 0, blue: 0, alpha: 0)（不能设置为Clear，会显示灰色）。

func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {
        let action = UITableViewRowAction(style: .normal, title: nil) { (action, index) in
            self.delete(indexPath.row)
        }
        action.backgroundColor = UIColor(red: 0, green: 0, blue: 0, alpha: 0)
        return [action]
    }

这时候重新运行App，你可能看到的还是一片空白，并没有任何自定义View显示出来。要知道为什么，我们需要了解ClipToBounds属性。很多人在切圆角的时候用过它，他的功能就是将View边界之外的View裁切掉。我们回到StoryBorad或XIB，分别点击UITableViewCell和它的ContentView，将它们的ClipToBounds属性取消，这样，即便是在它们边界之外的View（例如我们的自定义View）也能被渲染出来。

屏幕快照 2018-01-12 10.25.53.png

至此，很高兴的告诉你，你的自定义按钮已经生效了。你应该能看到类似下图的效果。

IMG_F424D6ED641E-1.jpeg

等等，如果你使用iOS11之前的设备查看时，会发现这样一个尴尬的情况。

IMG_0052.PNG

按钮只显示了一半，或者说，拖出来的距离非常小。我们打开视图查看一下。

iOS10

UISwipeActionPullView非常小，而Cell被拖出来的距离应该是由这个UISwipeActionPullView的大小决定的。那么如何控制UISwipeActionPullView的大小呢？系统没有暴露出UISwipeActionPullView，难道还要遍历一遍TableView？其实UITableViewRowAction有一个属性title，这个UISwipeActionPullView的大小，或者说Cell被拖出来的距离，就是由title的长度决定的。聪明的你一定想到了，只需要给title赋一堆空格就能解决问题了。

    func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {
        let action = UITableViewRowAction(style: .normal, title: nil) { (action, index) in
            self.delete(indexPath.row)
        }
        action.title = "          "
        action.backgroundColor = UIColor(red: 0, green: 0, blue: 0, alpha: 0)
        return [action]
    }`

最后提一下文章开头提到的iOS11对于侧滑按钮的变化。
我们尝试打开Debug view Hierarchy来分别查看一下不同iOS版本下的系统层级。

iOS11

iOS10

我们发现，iOS11中，UISwipeActionPullView的层级在UITableview之上，这与iOS11之前的版本不一样（UISwipeActionPullView在UITableviewCell之上，且置于ContentView之下）。这个变化对用户是无感的，但开发人员需要了解，以便在需要的时候进行修改。