今天我们基于Github上流行的SWTableViewCell来实现左右滑动出现操作菜单的功能。先让我们看看他的酷炫效果吧。

注:对SWTableViewCell项目有兴趣的同学可以在SWTableViewCell详细了解。

最终效果

效果图1

效果图2

引入SWTableViewCell

这里我们通过CocoaPods来引入SWTableViewCell库。

cd到项目目录下,命令行中执行pod init,会生成Podfile,然后执行open -a Xcode Podfile打开文件,文件内容如下:

# Uncomment this line to define a global platform for your project
# platform :ios, '6.0'

target 'SWTableViewCellDemo' do

end

target 'SWTableViewCellDemoTests' do

end

platform :ios, "8.0"
use_frameworks!

替代掉前面两句注视。然后在第一个target中增加pod 'SWTableViewCell', '~> 0.3.7',回到命令行执行pod install

此时我们已经通过CocoasPods将SWTableViewCell库引入进来了。

最终的Podfile如下:

platform :ios, "8.0"
use_frameworks!

target 'SWTableViewCellDemo' do
pod 'SWTableViewCell', '~> 0.3.7'
end

target 'SWTableViewCellDemoTests' do

end

使用SWTableViewCell

首先打开xcworkspace项目文件。新建一个UITableViewController,将其中Cell的类设置为SWTableViewCell。当然,你可以自定义一个SWTableViewCell的子类,加入你自己需要的元素。

override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) as! SWTableViewCell
    
    cell.textLabel?.text = "这是第\(indexPath.row)个Table View Cell"
    cell.rightUtilityButtons = rightButtons() as [AnyObject]
    cell.leftUtilityButtons = leftButtons() as [AnyObject]
    cell.delegate = self
    
    return cell
}

实例化Cell之后,设置左侧按钮、右侧按钮和代理即可。

其中按钮是UIButton的数组,生成按钮数组的代码封装在两个内部方法中。

接下来就是实现SWTableViewCell中的方法了,我们一个一个来看。

禁止左滑或者右话操作:

func swipeableTableViewCell(cell: SWTableViewCell!, canSwipeToState state: SWCellState) -> Bool {
    switch (state) {
    case .CellStateLeft:
        return true
    case .CellStateRight:
        return true
    default:
        break;
    }
    
    return true
}

左侧滑出的菜单按钮的响应逻辑:

func swipeableTableViewCell(cell: SWTableViewCell!, didTriggerLeftUtilityButtonWithIndex index: Int) {
    switch (index) {
    case 0:
        println("left button 0 was pressed");
        break;
    case 1:
        println("left button 1 was pressed");
        break;
    case 2:
        println("left button 2 was pressed");
        break;
    case 3:
        println("left btton 3 was pressed");
    default:
        break;
    }
}

右侧滑出的菜单按钮的响应逻辑:

func swipeableTableViewCell(cell: SWTableViewCell!, didTriggerRightUtilityButtonWithIndex index: Int) {
    switch (index) {
    case 0:
        println("More button was pressed");
        
        let alert = UIAlertView(title: "Hello", message: "More more more", delegate: nil, cancelButtonTitle: "取消")
        cell.hideUtilityButtonsAnimated(true)
        alert.show()
        break
    case 1:
        
        let indexPath = tableView.indexPathForCell(cell)!
        numberOfRows--
        tableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: UITableViewRowAnimation.Left)
        break;
    default:
        break;
    }
}

当Cell状态变化时的回调:

func swipeableTableViewCell(cell: SWTableViewCell!, scrollingToState state: SWCellState) {
    switch (state) {
    case .CellStateCenter:
        println("utility buttons closed");
        break;
    case .CellStateLeft:
        println("left utility buttons open");
        break;
    case .CellStateRight:
        println("right utility buttons open");
        break;
    default:
        break;
    }
}

设置是否允许同时有多个Cell滑出菜单按钮,如果是返回true,则任何时候只有一个Cell会出现菜单:

func swipeableTableViewCellShouldHideUtilityButtonsOnSwipe(cell: SWTableViewCell!) -> Bool {
    return true
}

登录发表评论 注册

反馈意见