本方法实现的原理是将自定义按钮加在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的初始化方法:

  1. -(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{
  2. self=[super initWithStyle:style reuseIdentifier:reuseIdentifier];
  3. if (self) {
  4. _deleteView=[[UIView alloc]initWithFrame:CGRectMake(kScreenWidth, 0, kScreenWidth, 100)];
  5. _deleteView.backgroundColor=BaseViewBackgroundColor;
  6. [self.contentView addSubview:_deleteView];
  7. 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];
  8. <span style="white-space:pre">    </span>//ButtonItem是我自己定义的一个控件,下面有介绍,<span style="font-family: Arial, Helvetica, sans-serif;">@"icon_delete"是删除按钮的图片</span>
  9. [_deleteView addSubview:deleteBtn];
  10. }
  11. return self;
  12. }

覆写tableView的代理方法:

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

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

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

Tips:

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

    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. _label=[[UILabel alloc]initWithFrame:CGRectMake(0, gap+_imageView.frame.size.height, frame.size.width, (1-imgPercent)*frame.size.height)];
    12. _label.text=title;
    13. _label.textColor=color;
    14. _label.textAlignment=NSTextAlignmentCenter;
    15. _label.font=[UIFont systemFontOfSize:fontSize];
    16. [self addSubview:_label];
    17. }
    18. return self;
    19. }

tableView左划自定义带图片按钮的更多相关文章

  1. 自定义带图片和文字的ImageTextButton

    今天我们来讲一下有关自定义控件的问题,今天讲的这篇是从布局自定义开始的,难度不大,一看就明白,估计有的同学或者开发者看了说,这种方式多此一举,但是小编我不这么认为,多一种解决方式,就多一种举一反三的学 ...

  2. iOS自定义全屏返回与tableView左划删除手势冲突解决

    当自定义一个navigationController实现全屏右划返回时, 使用起来是不是很爽, 代码如下: - (void)viewDidLoad { [super viewDidLoad]; UIG ...

  3. java中带图片按钮的大小设置

    在java部分需要用到图形界面编程的项目中,经常会使用图片设置对按钮进行美化,但是使用时会出现一个很麻烦的问题,那就是按钮的大小默认按照图片的大小来显示,这大大降低了界面的美观程度: 按照方法: JB ...

  4. 自定义带图片和文字的Button的排版--陈棚

    自定义button,动态加载图片与文字 [footView addSubview:btnAllChoose]; [btnAllChoose setTitle:str forState:UIContro ...

  5. Vue 封装可向左向右查看图片列表的组件

    <template> <div class="content-container"> <div class="content-contain ...

  6. tableview左滑按钮 tableviewcell自定义左滑按钮

    当我们在使用tableview时,往往需要在cell左滑时显示一个或是多个按钮,但系统默认的只可显示一个,如常见的删除按钮,那么当我们的需求要求要有多个按钮时又该怎么办呢,我们往下看. 首先,现看看系 ...

  7. Android实现自定义带文字和图片的Button

    Android实现自定义带文字和图片的Button 在Android开发中经常会需要用到带文字和图片的button,下面来讲解一下常用的实现办法. 一.用系统自带的Button实现 最简单的一种办法就 ...

  8. [转]Android UI:看看Google官方自定义带旋转动画的ImageView-----RotateImageView怎么写(附 图片淡入淡出效果)

    http://blog.csdn.net/yanzi1225627/article/details/22439119 众所周知,想要让ImageView旋转的话,可以用setRotation()让其围 ...

  9. Android UI:看看Google官方自定义带旋转动画的ImageView-----RotateImageView怎么写(附 图片淡入淡...)

    众所周知,想要让ImageView旋转的话,可以用setRotation()让其围绕中心点旋转,但这个旋转是不带动画的,也就是旋转屏幕时图片噌的一下就转过去了,看不到旋转的过程,此UI体验不大好,为此 ...

随机推荐

  1. Java 类集初探

    类集 类集:主要功能就是Java数据结构的实现(java.util) 类集就是动态对象数组(链表也是动态数组) Collection 接口* Collection是整个类集之中单值保存的最大 父接口 ...

  2. layui省市区三级联动城市选择

    基于layui框架制作精美的省市区下拉框三级联动菜单选择, 支持三级联动城市选择,点击提交获取选中值代码. 示例图如下: 资源链接: https://pan.baidu.com/s/1s6l8iDBE ...

  3. 反卷积(Transposed Convolution)

    反卷积的具体计算步骤 令图像为 卷积核为 case 1 如果要使输出的尺寸是 5x5,步数 stride=2 ,tensorflow 中的命令为: transpose_conv = tf.nn.con ...

  4. 【转载】Spring学习(1)——快速入门--2019.05.19

    原文地址:https://www.cnblogs.com/wmyskxz/p/8820371.html   认识 Spring 框架 Spring 框架是 Java 应用最广的框架,它的成功来源于理念 ...

  5. Git 提交代码到远程仓库

    Git 命令 一.Git如何把本地代码推送到远程仓库 1. 拉取指定分支代码 git clone -b dev https://github.com/crazyfzw/RecycleViewWithH ...

  6. 201871010118-唐敬博《面向对象程序设计(java)》第一周学习总结

    博文正文开头格式:(3分) 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/p/11435127.html 这个作业的要求在哪里 https:/ ...

  7. python之海龟绘图

    1. 基本功能介绍 在海龟作图中,我们可以编写指令让一个虚拟的(想象中的)海龟在屏幕上来回移动.这个海龟带着一只钢笔,我们可以让海龟无论移动到哪都使用这只钢笔来绘制线条.通过编写代码,以各种很酷的模式 ...

  8. LG2602/BZOJ1833 「ZJOI2010」数字计数 数位DP

    问题描述 LG2602 BZOJ1833 题解 数位\(\mathrm{DP}\)板子题. 注意限制位数.前导零. \([a,b]=[1,b]-[1,a-1]\) \(\mathrm{Code}\) ...

  9. vue中is的使用

    :is作用 1.动态切换不同组件 <div id="app"> <button @click="changeComponent('component1' ...

  10. WPF (DataGridRowHeaderStyle)实现自义定行样式 并绑定数据

    原文:WPF (DataGridRowHeaderStyle)实现自义定行样式 并绑定数据 功能阐述 就上面那图片 刚开始 考虑使用 RowHeaderTemplate 来实现  发现总绑定不上数据  ...