Native定制TableViewCell的删除视图

看了很多自定义的第三方例子,都有一个通病,就是自定义出来的视图会跟随Cell的ContentView划动,而Native的是没有这个情况的(总是屏幕右对齐),但TableView并没有暴露自定义这个视图的方法,怎么办呢,自己动手丰衣足食.

首先装一个LLDB辅助工具Chisel,虽然不是必需,但有这个东西在调试时会方便一些,建议装上( https://github.com/facebook/chisel ),接着就是在项目中建个能正常显示删除按钮的TableView,大概就是这样

@interface RootViewController()<UITableViewDelegate, UITableViewDataSource>

@end

@implementation RootViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    
    UITableView *tv = [[UITableView alloc] init];
    tv.delegate = self;
    tv.dataSource = self;
    tv.frame = self.view.bounds;
    [self.view addSubview:tv];
}

#pragma mark TableView代理
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 3;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    // 这里就简单返回个CELL
    UITableViewCell *cell = [[UITableViewCell alloc] init];
    cell.textLabel.text = @"sma111case";
    cell.contentView.backgroundColor = [UIColor greenColor];
    return cell;
}

// 允许划动删除
- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath
{
    return YES;
}

// 删除按钮的文字(其实就是间接返回删除按钮的长度,自定义视图时可调节该文本的长度控制View的宽度)
- (NSString *)tableView:(UITableView *)tableView titleForDeleteConfirmationButtonForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return @"sma11case";
}

- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return UITableViewCellEditingStyleDelete;
}

- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
    // 在这里下个断点,因为这个时候已经生成删除按钮视图,顺手拿到点击的Cell
    sleep(1);
}
@end

在Sleep的地方下个断,然后触发删除事件,此时应该停在Sleep那行代码,在LLDB中CMD+K清掉日志,然后使用 pviews cell 拿到CELL的视图树,大概是这样子

<UITableViewCell: 0x7fa858667c80; frame = (0 88; 375 44); text = 'sma111case'; autoresize = W; gestureRecognizers = <NSArray: 0x7fa858464280>; layer = <CALayer: 0x7fa858668050>>
   | <UITableViewCellDeleteConfirmationView: 0x7fa858461ad0; frame = (375.5 0; 117 44); clipsToBounds = YES; autoresize = H; layer = <CALayer: 0x7fa85842df20>>
   |    | <_UITableViewCellActionButton: 0x7fa858683fa0; frame = (0 0; 117 44); opaque = NO; autoresize = H; layer = <CALayer: 0x7fa8586844e0>>
   |    |    | <UIButtonLabel: 0x7fa858684f80; frame = (15 11; 87 21.5); text = 'sma11case'; opaque = NO; userInteractionEnabled = NO; layer = <_UILabelLayer: 0x7fa858685420>>
   | <UITableViewCellContentView: 0x7fa858668070; frame = (0 0; 375 43.5); gestureRecognizers = <NSArray: 0x7fa8586688e0>; layer = <CALayer: 0x7fa8586681f0>>
   |    | <UITableViewLabel: 0x7fa8586689f0; frame = (15 0; 345 43.5); text = 'sma111case'; userInteractionEnabled = NO; layer = <_UILabelLayer: 0x7fa858668c00>>
   | <_UITableViewCellSeparatorView: 0x7fa858669420; frame = (132.5 43.5; 243 0.5); layer = <CALayer: 0x7fa858646d80>>

注意 UITableViewCellDeleteConfirmationView 它就是删除视图,默认 backgroundColor 是红色, _UITableViewCellActionButton 就是那个删除按钮,所以要自定义就是替换这两个东西的事情啦,但要还要注意一个细节,就是替换的时机,这个删除视图是在显示的时候创建的,然后在使用完毕后释放,所以不能通过类似获取属性的形式获取,因此,自定义的最好时机是在 layoutSubviews 方法中,大概就是这样子

@implementation SCTableViewCell
- (void)layoutSubviews
{
    [super layoutSubviews];
    
    UIView *view = nil;
    
    for (UIView *v in self.subviews)
    {
        if ([v isKindOfClass:NSClassFromString(@"UITableViewCellDeleteConfirmationView")])
        {
            view = v;
            break;
        }
    }
    
    // View=nil, subviews=nil, count=0都是false
    if (view.subviews.count)
    {
        // 安全拿到Button 
        UIButton *button = view.subviews[0];
        
        if (button)
        {
            // do sth....
        }
    }
    
}

最后,收工,祝各位看官愉快~~~

效果预览:

Untitled.gif

Native定制TableViewCell的删除视图

推荐阅读更多精彩内容