【无限互联】框架学习——MCSwipeTableViewCell

来源：互联网发布：高压柜模型实时数据编辑：程序博客网时间：2024/06/03 16:17

本次学习的MCSwipeTableViewCell的效果如图:

MCSwipeTableViewCell是表视图单元格上滑动手势的运用，类似Mailbox App的。可自定义颜色和图标，默认滑动删除内容。要求iOS 5及以上版本，支持ARC。

一、MCSwipeTableViewCell的使用

1.首先将MCSwipeTableViewCell的.m和.h文件与相应的图片文件夹导入

2.创建tableView并实现其代理

3.返回单元格的方法实现

//返回单元格- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {        static NSString *CellIdentifier = @"Cell";    MCSwipeTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];        if (!cell) {        cell = [[MCSwipeTableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier];                [cell setSelectionStyle:UITableViewCellSelectionStyleGray];        cell.contentView.backgroundColor = [UIColor whiteColor];    }        //配置单元格    [self configureCell:cell forRowAtIndexPath:indexPath];        return cell;}

4.配置单元格的方法实现

//配置单元格- (void)configureCell:(MCSwipeTableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {        //设置选中视图    UIView *checkView = [self viewWithImageName:@"check"];    UIColor *greenColor = [UIColor colorWithRed:85.0 / 255.0 green:213.0 / 255.0 blue:80.0 / 255.0 alpha:1.0];        //设置删除视图    UIView *crossView = [self viewWithImageName:@"cross"];    UIColor *redColor = [UIColor colorWithRed:232.0 / 255.0 green:61.0 / 255.0 blue:14.0 / 255.0 alpha:1.0];        //设置定时提醒视图    UIView *clockView = [self viewWithImageName:@"clock"];    UIColor *yellowColor = [UIColor colorWithRed:254.0 / 255.0 green:217.0 / 255.0 blue:56.0 / 255.0 alpha:1.0];        //设置列表视图    UIView *listView = [self viewWithImageName:@"list"];    UIColor *brownColor = [UIColor colorWithRed:206.0 / 255.0 green:149.0 / 255.0 blue:98.0 / 255.0 alpha:1.0];        //设置默认的背景颜色    [cell setDefaultColor:_tableView.backgroundView.backgroundColor];        //设置单元格的代理    [cell setDelegate:self];        //设置每个单元格的实现效果        //第一个单元格    if (indexPath.row % kMCNumItems == 0) {                //设置单元格的主标题、副标题        [cell.textLabel setText:@"Switch Mode Cell"];        [cell.detailTextLabel setText:@"Swipe to switch"];                //设置单元格的选中视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:checkView color:greenColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState1 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Checkmark\" cell");        }];        //设置单元格的删除视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:crossView color:redColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState2 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Cross\" cell");        }];                //设置单元格的定时视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:clockView color:yellowColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState3 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Clock\" cell");        }];                //设置单元格的列表视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:listView color:brownColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState4 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"List\" cell");        }];    }    //第二个单元格    else if (indexPath.row % kMCNumItems == 1) {        //设置单元格的主标题、副标题        [cell.textLabel setText:@"Exit Mode Cell"];        [cell.detailTextLabel setText:@"Swipe to delete"];                //设置单元格的删除视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:crossView color:redColor mode:MCSwipeTableViewCellModeExit state:MCSwipeTableViewCellState1 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Cross\" cell");                        [self deleteCell:cell];        }];    }    //第三个单元格    else if (indexPath.row % kMCNumItems == 2) {        //设置单元格的主标题、副标题        [cell.textLabel setText:@"Mixed Mode Cell"];        [cell.detailTextLabel setText:@"Swipe to switch or delete"];                //设置单元格的选中视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:checkView color:greenColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState1 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Checkmark\" cell");        }];                //设置单元格的删除视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:crossView color:redColor mode:MCSwipeTableViewCellModeExit state:MCSwipeTableViewCellState2 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Cross\" cell");                        [self deleteCell:cell];        }];    }    //第四个单元格    else if (indexPath.row % kMCNumItems == 3) {        //设置单元格的主标题、副标题        [cell.textLabel setText:@"Un-animated Icons"];        [cell.detailTextLabel setText:@"Swipe"];                //设置图标是否移动        cell.shouldAnimateIcons = NO;                //设置单元格的选中视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:checkView color:greenColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState1 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Checkmark\" cell");        }];                //设置单元格的删除视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:crossView color:redColor mode:MCSwipeTableViewCellModeExit state:MCSwipeTableViewCellState2 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Cross\" cell");                        [self deleteCell:cell];        }];    }    //第五个单元格    else if (indexPath.row % kMCNumItems == 4) {        //设置单元格的主标题、副标题        [cell.textLabel setText:@"Right swipe only"];        [cell.detailTextLabel setText:@"Swipe"];                //设置单元格的定时视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:clockView color:yellowColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState3 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Clock\" cell");        }];                //设置单元格的列表视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:listView color:brownColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState4 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"List\" cell");        }];    }    //第六个单元格    else if (indexPath.row % kMCNumItems == 5) {        //设置单元格的主标题、副标题        [cell.textLabel setText:@"Small triggers"];        [cell.detailTextLabel setText:@"Using 10% and 50%"];                //设置第一个触发事件的距离百分比        cell.firstTrigger = 0.1;                //设置第二个触发事件的距离百分比        cell.secondTrigger = 0.5;                //设置单元格的选中视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:checkView color:greenColor mode:MCSwipeTableViewCellModeSwitch state:MCSwipeTableViewCellState1 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Checkmark\" cell");        }];                //设置单元格的删除视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:crossView color:redColor mode:MCSwipeTableViewCellModeExit state:MCSwipeTableViewCellState2 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Cross\" cell");                        [self deleteCell:cell];        }];    }    //第七个单元格    else if (indexPath.row % kMCNumItems == 6) {        //设置单元格的主标题、副标题        [cell.textLabel setText:@"Exit Mode Cell + Confirmation"];        [cell.detailTextLabel setText:@"Swipe to delete"];                 //设置单元格的删除视图、颜色、状态、完成后的block        [cell setSwipeGestureWithView:crossView color:redColor mode:MCSwipeTableViewCellModeExit state:MCSwipeTableViewCellState1 completionBlock:^(MCSwipeTableViewCell *cell, MCSwipeTableViewCellState state, MCSwipeTableViewCellMode mode) {            NSLog(@"Did swipe \"Cross\" cell");                        //设置要删除的单元格            _cellToDelete = cell;                        //创建弾框            UIAlertView *alertView = [[UIAlertView alloc] initWithTitle:@"删除?"                                                                message:@"你确定要删除这个单元格?"                                                               delegate:self                                                      cancelButtonTitle:@"否"                                                      otherButtonTitles:@"是", nil];            [alertView show];        }];    }}

5.创建图片视图

//创建图片视图- (UIView *)viewWithImageName:(NSString *)imageName {    UIImage *image = [UIImage imageNamed:imageName];    UIImageView *imageView = [[UIImageView alloc] initWithImage:image];    imageView.contentMode = UIViewContentModeCenter;    return imageView;}

6.UIAlertViewDelegate的实现

- (void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex {        //选择“否”    if (buttonIndex == 0) {        [_cellToDelete swipeToOriginWithCompletion:^{            NSLog(@"选择否");        }];        _cellToDelete = nil;    }        //选择"是“    else {        //删除单元格        _nbItems--;//剩余单元格数        [_tableView deleteRowsAtIndexPaths:@[[_tableView indexPathForCell:_cellToDelete]] withRowAnimation:UITableViewRowAnimationFade];    }}

7.单元格的删除与重新加载

- (void)deleteCell:(MCSwipeTableViewCell *)cell {        //删除单元格    _nbItems--;<span style="font-family: Arial, Helvetica, sans-serif;">//剩余单元格数</span>    NSIndexPath *indexPath = [_tableView indexPathForCell:cell];    [_tableView deleteRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationFade];}

- (IBAction)reload:(UIBarButtonItem *)sender {        //重新加载单元格    _nbItems = kMCNumItems; //<span style="font-family: Arial, Helvetica, sans-serif;">kMCNumItems默认单元格数</span>    [_tableView reloadSections:[NSIndexSet indexSetWithIndex:0] withRowAnimation:UITableViewRowAnimationFade];}

8.单元格的代理实现

//监听手指滑动的开始- (void)swipeTableViewCellDidStartSwiping:(MCSwipeTableViewCell *)cell {    NSLog(@"开始滑动单元格！");}//监听手指滑动的结束- (void)swipeTableViewCellDidEndSwiping:(MCSwipeTableViewCell *)cell {    NSLog(@"结束滑动单元格！");}//监听手指滑动的距离- (void)swipeTableViewCell:(MCSwipeTableViewCell *)cell    didSwipeWithPercentage:(CGFloat)percentage {        NSLog(@"已滑动百分比 : %.2f%%", percentage*100);    }

二、MCSwipeTableViewCell的实现原理

1.MCSwipeTableViewCell.h文件

2.MCSwipeTableViewCell.m文件

0 0