tableView左划自定义带图片按钮

本方法实现的原理是将自定义按钮加在tableViewCell.contentView的屏幕外的frame上,打个比方,如果是5系的话,那么你自定义按钮的frame的起点就在(320+,0)(320+表示大于等于320...),当你滑动,整个cell往左偏移的时候,这时候本应该右边显示为这样:

   

但是由于我们把自定义的按钮add到屏幕外,此时contentView上的自定义按钮就将原删除按钮给遮住了。然后接下来就是实现删除了,重写-(void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath方法,有了indexPath就可以将cell删除了,然后刷新tableView即可

 

覆写的tableViewCell的初始化方法:

[objc] view plain copy
 
  1. -(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{  
  2.     self=[super initWithStyle:style reuseIdentifier:reuseIdentifier];  
  3.     if (self) {  
  4.           
  5.           
  6.         _deleteView=[[UIView alloc]initWithFrame:CGRectMake(kScreenWidth, 0, kScreenWidth, 100)];  
  7.         _deleteView.backgroundColor=BaseViewBackgroundColor;  
  8.         [self.contentView addSubview:_deleteView];  
  9.         ButtonItem *deleteBtn=[[ButtonItem alloc]initWithFrame:CGRectMake(0, 0, 80, 100) WithImageName:@"icon_delete" WithImageWidth:48 WithImageHeightPercentInItem:.7 WithTitle:NSLocalizedString(@"DeleteOrder", nil) WithFontSize:14 WithFontColor:[UIColor blackColor] WithGap:-5];  
  10. <span style="white-space:pre">    </span>//ButtonItem是我自己定义的一个控件,下面有介绍,<span style="font-family: Arial, Helvetica, sans-serif;">@"icon_delete"是删除按钮的图片</span>  
  11.   
  12.         [_deleteView addSubview:deleteBtn];  
  13.   
  14.     }  
  15.     return self;  
  16. }  




 

 

覆写tableView的代理方法:

 

[objc] view plain copy
 
  1. -(void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath{  
  2.     [mutableArray removeObjectAtIndex:indexPath.row];  
  3.     [tableView reloadData];  
  4.   
  5. }  


 

 

 

当然如果只是这样,你会发现你左划完成之后,你的按钮只会有原delete按钮的宽度,此时就可以再通过如下代理方法进行宽度的调节...

 

[objc] view plain copy
 
  1. -(NSString *)tableView:(UITableView *)tableView titleForDeleteConfirmationButtonForRowAtIndexPath:(NSIndexPath *)indexPath{  
  2.     return @"通过改变title的长度,你想多宽就多宽";  
  3. }  



 

 

Tips:

ButtonItem是我自己写的一个继承于UIControl的控件,上面有UIImageView和UILable,便于我实现那种带图片和文字的按钮

 

 

[objc] view plain copy
 
    1. - (id)initWithFrame:(CGRect)frame WithImageName:(NSString *)imageName WithImageWidth:(CGFloat)imgWidth WithImageHeightPercentInItem:(CGFloat)imgPercent WithTitle:(NSString *)title WithFontSize:(CGFloat)fontSize WithFontColor:(UIColor *)color WithGap:(CGFloat)gap{  
    2.     self.backgroundColor=[UIColor clearColor];  
    3.     self=[super initWithFrame:frame];  
    4.     if (self) {  
    5.         _imageView=[[UIImageView alloc]initWithFrame:CGRectMake((frame.size.width-imgWidth)/2, 5, imgWidth, imgPercent*frame.size.height)];  
    6.         if (imageName) {  
    7.             _imageView.image=[UIImage imageNamed:imageName];  
    8.         }  
    9.         _imageView.contentMode=UIViewContentModeScaleAspectFit;  
    10.         [self addSubview:_imageView];  
    11.           
    12.         _label=[[UILabel alloc]initWithFrame:CGRectMake(0, gap+_imageView.frame.size.height, frame.size.width, (1-imgPercent)*frame.size.height)];  
    13.         _label.text=title;  
    14.         _label.textColor=color;  
    15.         _label.textAlignment=NSTextAlignmentCenter;  
    16.         _label.font=[UIFont systemFontOfSize:fontSize];  
    17.         [self addSubview:_label];  
    18.           
    19.           
    20.     }  
    21.     return self;  
    22. }  
posted @ 2016-09-22 14:04  不停奔跑的蜗牛  阅读(367)  评论(0编辑  收藏  举报