MGSwipeTableCell使用以及简书APP侧滑效果实践

开发中经常用到侧滑功能，如QQ、微信，当然还有简书，这里不介绍系统的侧滑方法，介绍一个强大的第三方库MGSwipeTableCell，这里可以看看官方的效果

来两张效果图

####下面看看如何使用

1.继承于MGSwipeTableCell

@interface jianShuTableViewCell : MGSwipeTableCell

2.设置代理对象

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    
    jianShuTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:kJianShuCell forIndexPath:indexPath];
    
    cell.selectionStyle = UITableViewCellSelectionStyleNone;
    cell.delegate = self;//设置代理
    return cell;
}
复制代码

3.实现代理方法，主要是下面这两个方法

启用/禁用滑动手势 ，如果允许滑动，返回YES

-(BOOL) swipeTableCell:(MGSwipeTableCell*) cell canSwipe:(MGSwipeDirection) direction;
复制代码

设置滑动按钮和滑动/扩展设置

-(NSArray*) swipeTableCell:(MGSwipeTableCell*) cell swipeButtonsForDirection:(MGSwipeDirection)direction
             swipeSettings:(MGSwipeSettings*) swipeSettings expansionSettings:(MGSwipeExpansionSettings*) expansionSettings;
复制代码

####在实现功能之前 先来看看常用一些属性

• 滑出动画

@property (nonatomic, assign) MGSwipeTransition transition;
复制代码

• 扩展之后出发button的下标值 （特别提醒： 如果不需要扩展属性，不写这就代码就正常了，被这个属性搞了很久）

@property (nonatomic, assign) NSInteger buttonIndex;
复制代码

• 扩展填充单元格时是否弹回到其初始位置,如果为NO，则弹回到初始位置(试一试，就会发现区别)

@property (nonatomic, assign) BOOL fillOnTrigger;
复制代码

• 滑动cell时触发扩展的比例阈值。 默认值1.5

@property (nonatomic, assign) CGFloat threshold;
复制代码

• 扩展单元格时的颜色

@property (nonatomic, strong, nullable) UIColor * expansionColor;
复制代码

• 扩展单元格时字体字体布局

@property (nonatomic, assign) MGSwipeExpansionLayout expansionLayout;
复制代码

• 那么简书的滑动效果，设置属性，大家看名字就明白了

-(void) centerIconOverText; 
-(void) centerIconOverTextWithSpacing: (CGFloat) spacing; // 可以设置图片和文字的间隔
复制代码

注意 如果我们要适配滑出button的大小，可以设置这个属性

// 每一个button的宽度
CGFloat padding = 25;
复制代码

####说了这么多，看具体的实现(包括QQ样式和简书样式)

-(nullable NSArray<UIView*>*) swipeTableCell:(nonnull MGSwipeTableCell*) cell swipeButtonsForDirection:(MGSwipeDirection)direction
                               swipeSettings:(nonnull MGSwipeSettings*) swipeSettings expansionSettings:(nonnull MGSwipeExpansionSettings*) expansionSettings {
    
    swipeSettings.transition = MGSwipeTransitionBorder; // 滑出动画
    
    __weak ViewController *weakSelf = self;
    
    if (direction == MGSwipeDirectionLeftToRight) {
        
        // 扩张之后出发button的下标值
        expansionSettings.buttonIndex = 0;
        // 扩张填充单元格时是否弹回到其初始位置,如果为NO，则弹回到初始位置
        expansionSettings.fillOnTrigger = YES;
        // 尺寸比例阈值触发扩展按钮。 默认值1.5
        expansionSettings.threshold = 1.5;
        // 扩张单元格时的颜色
        expansionSettings.expansionColor = [UIColor redColor];
        // 扩张单元格时字体字体布局
        expansionSettings.expansionLayout = MGSwipeExpansionLayoutBorder;
        
        // 每一个button的宽度
        CGFloat padding = 25;
        
        MGSwipeButton * edit = [MGSwipeButton buttonWithTitle:@"置顶" backgroundColor:[UIColor colorWithRed:243/256.0 green:243/256.0 blue:243/256.0 alpha:1] padding:padding callback:^BOOL(MGSwipeTableCell *sender) {
            
            NSIndexPath *indexPath = [weakSelf.tableView indexPathForCell:sender];
            
            UIAlertController *alertVC = [UIAlertController alertControllerWithTitle:nil message:[NSString stringWithFormat:@"右滑--点击了第%ld个cell的置顶",indexPath.row] preferredStyle:UIAlertControllerStyleAlert];
            UIAlertAction *ok = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:nil];
            
            [alertVC addAction:ok];
            [weakSelf presentViewController:alertVC animated:YES completion:nil];
            
            return YES; // 设置为YES 点击会滑动原始位置，否则不做任何处理
        }];
        
        MGSwipeButton * delete = [MGSwipeButton buttonWithTitle:@"删除" backgroundColor:[UIColor redColor] padding:padding callback:^BOOL(MGSwipeTableCell *sender) {
            
            NSIndexPath *indexPath = [weakSelf.tableView indexPathForCell:sender];
            
            [self.dataArray removeObjectAtIndex:indexPath.row]; //数据源删除
            [self.tableView deleteRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationLeft];
            
            return YES;
        }];
        
        return @[delete,edit];
    }else {
        
        expansionSettings.fillOnTrigger = YES;
        expansionSettings.threshold = 1.5;
        
        CGFloat padding = 10;
        
        MGSwipeButton *edit = [MGSwipeButton buttonWithTitle:@"编辑" icon:[UIImage imageNamed:@"edit"] backgroundColor:[UIColor colorWithRed:243/256.0 green:243/256.0 blue:243/256.0 alpha:1] padding:padding callback:^BOOL(MGSwipeTableCell *sender) {
            
            NSIndexPath *indexPath = [weakSelf.tableView indexPathForCell:sender];
            
            UIAlertController *alertVC = [UIAlertController alertControllerWithTitle:nil message:[NSString stringWithFormat:@"左滑--点击了第%ld个cell的编辑",indexPath.row] preferredStyle:UIAlertControllerStyleAlert];
            UIAlertAction *ok = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:nil];
            
            [alertVC addAction:ok];
            [weakSelf presentViewController:alertVC animated:YES completion:nil];
            
            return YES;//弹回原来状态
        }];
        
        [edit centerIconOverTextWithSpacing:7];
        
        // 设置图片颜色
        //[edit iconTintColor:[UIColor colorWithRed:56/256.0 green:56/256.0 blue:56/256.0 alpha:1]];
        
        MGSwipeButton *delete = [MGSwipeButton buttonWithTitle:@"删除" icon:[UIImage imageNamed:@"delete"] backgroundColor:[UIColor colorWithRed:243/256.0 green:243/256.0 blue:243/256.0 alpha:1] padding:padding callback:^BOOL(MGSwipeTableCell *sender) {
            
            NSIndexPath *indexPath = [weakSelf.tableView indexPathForCell:sender];
            
            UIAlertController *alertVC = [UIAlertController alertControllerWithTitle:nil message:[NSString stringWithFormat:@"左滑--点击了第%ld个cell的删除",indexPath.row] preferredStyle:UIAlertControllerStyleAlert];
            UIAlertAction *ok = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:nil];
            
            [alertVC addAction:ok];
            [weakSelf presentViewController:alertVC animated:YES completion:nil];
            
            return NO; 
        }];
        
        [delete centerIconOverTextWithSpacing:7];
        
        MGSwipeButton *issue = [MGSwipeButton buttonWithTitle:@"公开发布" icon:[UIImage imageNamed:@"issue"] backgroundColor:[UIColor colorWithRed:243/256.0 green:243/256.0 blue:243/256.0 alpha:1] padding:padding callback:^BOOL(MGSwipeTableCell *sender) {
            
            NSIndexPath *indexPath = [weakSelf.tableView indexPathForCell:sender];
            
            UIAlertController *alertVC = [UIAlertController alertControllerWithTitle:nil message:[NSString stringWithFormat:@"左滑--点击了第%ld个cell的公开发布",indexPath.row] preferredStyle:UIAlertControllerStyleAlert];
            UIAlertAction *ok = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:nil];
            
            [alertVC addAction:ok];
            [weakSelf presentViewController:alertVC animated:YES completion:nil];
            
            return NO;
        }];
        
        [issue centerIconOverTextWithSpacing:7];
        
        MGSwipeButton *set = [MGSwipeButton buttonWithTitle:@"文集设置" icon:[UIImage imageNamed:@"set"] backgroundColor:[UIColor colorWithRed:243/256.0 green:243/256.0 blue:243/256.0 alpha:1] padding:padding callback:^BOOL(MGSwipeTableCell *sender) {
            
            NSIndexPath *indexPath = [weakSelf.tableView indexPathForCell:sender];
            
            UIAlertController *alertVC = [UIAlertController alertControllerWithTitle:nil message:[NSString stringWithFormat:@"左滑--点击了第%ld个cell的文集设置",indexPath.row] preferredStyle:UIAlertControllerStyleAlert];
            UIAlertAction *ok = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:nil];
            
            [alertVC addAction:ok];
            [weakSelf presentViewController:alertVC animated:YES completion:nil];
            
            return NO;
        }];
        
        [set centerIconOverTextWithSpacing:7];
        
        return @[set,issue,delete,edit];
    }
    
    return nil;
    
}

复制代码