cell拖拽滑动效果(微信聊天cell向左滑动,漏出标记已读和删除按钮)

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #ba2da2 }
p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000; min-height: 13.0px }
span.s1 { }
span.s2 { color: #000000 }
span.s3 { color: #4f8187 }
span.s4 { color: #703daa }

@interface BillsCell ()

@property (nonatomic, strong) UIPanGestureRecognizer *panRecognizer;

@property(nonatomic,assign) CGFloat lastDownX ;

@property(nonatomic,assign) CGFloat originX ;

@end

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #ba2da2 }
p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #008400 }
p.p3 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #008400; min-height: 13.0px }
p.p4 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px "PingFang SC"; color: #008400 }
p.p5 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000 }
p.p6 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000; min-height: 13.0px }
p.p7 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #3e1e81 }
p.p8 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #703daa }
p.p9 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #4f8187 }
p.p10 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #78492a }
span.s1 { }
span.s2 { color: #000000 }
span.s3 { font: 11.0px Menlo }
span.s4 { font: 11.0px "PingFang SC" }
span.s5 { color: #ba2da2 }
span.s6 { font: 11.0px Menlo; color: #000000 }
span.s7 { color: #4f8187 }
span.s8 { color: #703daa }
span.s9 { color: #78492a }
span.s10 { color: #272ad8 }
span.s11 { color: #3e1e81 }
span.s12 { color: #31595d }
span.s13 { color: #008400 }
span.s14 { font: 11.0px "PingFang SC"; color: #008400 }

@implementation BillsCell

- (void)awakeFromNib {

//给背景添加手势

UIPanGestureRecognizer * pan = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panBg:)];

[_bgView addGestureRecognizer:pan];

self.originX = self.bgView.frame.origin.x ;

}

-(void)panBg:(UIPanGestureRecognizer*)pan

{

_panRecognizer = pan;

switch (pan.state) {

case UIGestureRecognizerStateBegan:

[self beganDrag];

break;

case UIGestureRecognizerStateEnded:

[self endedDrag];

break;

default:

[self dragging:pan];

break;

}

}

#pragma mark 开始拖动

- (void)beganDrag

{

_lastDownX = self.bgView.frame.origin.x;

}

#pragma mark 结束拖动

- (void)endedDrag

{

// 取出当前x位置

CGFloat x = self.bgView.frame.origin.x;

// 取出宽度(需要漏出来的按钮宽度)

CGFloat width = self.deleteCellBtn.frame.size.width;

if ( x >= self.originX -0.5*width && x <= self.originX) { // 回原点

x = self.originX;

} else if(x < self.originX - 0.5*width && x >= self.originX - width){ // 停到最左边

x = self.originX - width;

}

CGRect frame = self.bgView.frame;

frame.origin.x = x;

[UIView animateWithDuration:0.3 animations:^{//动画执行到最终的位置

self.bgView.frame = frame;

}];

}

// 3/4 让imageview完全显示,遮盖完全消失

#pragma mark 正在拖动

- (void)dragging:(UIPanGestureRecognizer *)pan

{

// 手势移动距离

CGFloat tx = [pan translationInView:self.bgView].x;

CGFloat  x =  tx + _lastDownX;

// 取出宽度(需要漏出来按钮宽度)

CGFloat width = self.deleteCellBtn.frame.size.width;

if( x < self.originX - width ){

x = self.originX -width;

}

if ( x > self.originX  ){

x = self.originX;

}

CGRect  frame = self.bgView.frame ;

frame.origin.x = x;

self.bgView.frame = frame;

}

时间: 2024-10-09 06:35:31

cell拖拽滑动效果(微信聊天cell向左滑动,漏出标记已读和删除按钮)的相关文章

Android中GridView拖拽的效果

最 近看到联想,摩托罗拉等,手机launcher中有个效果,进入mainmenu后,里面的应用程序的图标可以拖来拖去,所以我也参照网上给的代码,写了 一个例子.还是很有趣的,实现的流畅度没有人家的那么好,我只是模仿这种效果,我写的这个拖拽是两个图标之间进行交换,所以,当从一行的某个位置,换到下 一行的另一列的时候,发现有好几个图标都改变位置了,因为是相邻两个交换位置,所以每经过相邻的图标的时候都改变位置.先弄个雏形,以后再更新优化. 转载请标明出处:http://blog.csdn.net/wd

ToolStrip控件左右拖拽移动效果实现

1.主窗体下部添加一个Panel乘放ToolStrip控件以实现ToolStrip在窗体下部定位.2.当ToolStrip控件中子控件超出屏幕时,拖动控件可以实现滑动效果.拖动到控件边缘距窗体边缘1/3宽度时(可设),自动回弹.拖动控件边缘在屏幕内时释放鼠标,控件自动回弹,边缘吸附窗体边缘.3.当ToolStrip控件中子控件数目较少可以在屏幕上完全显示时,拖动效果不可见.4.增加 添加.删除 按钮,点击时可增删一个ToolStripButton,方便拖动效果可见(ToolStrip控件中子控件

实现小窗口拖拽的效果

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 31.0px Consolas; color: #2b7ec3 } p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 31.0px Consolas; min-height: 36.0px } p.p3 { margin: 0.0px 0.0px 0.0px 0.0px; font: 31.0px Consolas; color: #d74200 } p.p4 {

2.2.4、用jwplayer实现youku可拖拽播放效果(nginx,yamdi)

Yamdi,为flv/mp4视频添加关键帧 1.解压下载的文件tar –zxvf yamdi-1.8.tar.gz 2.进入解压后的目录cd yamdi-1.8. 3.编译并安装 make && make install 4.使用该软件为视频添加关键帧信息实现拖动效果 具体使用方法如下yamdi -i input.mp4 -o out.mp4 Nginx需要加如下配置 location ~ \.flv$ { flv; } 如果要限制带宽和第一次下载量可加如下参数 limit_rate_af

jquery实现拖拽的效果

上篇讲的是原生js实现拖拽的效果,本篇是jquery实现拖拽的效果. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta charset="utf-8"/> <title> New Documen

利用jQuery UI为CMS网站实现拖拽布局效果,秒杀table布局

1 实现效果 对于使用过CMS系统制作网站的人应该都清楚,制作网站过程有一个重要的步骤就是制作页面布局.目前,实现页面布局有两种方式:table与div.这两种方式各有其优劣之处. Table: 优势:使用简单,使用表格进行布局顺理成章,概念和效果图理解起来很简单,制作也方便. 劣势:表格布局比较固定,布局效果控制的比较死,一些较为特殊的效果.层叠效果等比较难以实现. Div: 优势:布局效果灵活,div能轻易的控制布局位置,浮动效果等. 劣势:操作较为复杂,需要前端布局设计人员对div的特性.

Android中GridView拖拽的效果【android进化三十六】

  最 近看到联想,摩托罗拉等,手机launcher中有个效果,进入mainmenu后,里面的应用程序的图标可以拖来拖去,所以我也参照网上给的代码,写了 一个例子.还是很有趣的,实现的流畅度没有人家的那么好,我只是模仿这种效果,我写的这个拖拽是两个图标之间进行交换,所以,当从一行的某个位置,换到下 一行的另一列的时候,发现有好几个图标都改变位置了,因为是相邻两个交换位置,所以每经过相邻的图标的时候都改变位置.先弄个雏形,以后再更新优化. 转载请标明出处:http://blog.csdn.net/

拖拽碰撞效果,全部搞定,果然闲的没事干

<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>可拖拽的照片墙</title> <style type="text/css"> html body { margin:0; } #wrap { list-style:none; padding:0; margin:30p

拖拽的效果 第一步 设置 可拖拽的属性 draggable=&quot;true&quot; 绑定drag 事件 第二步 设置 放置位置 触发的事件 dragover 第三步 设置 放置之后 触发的事件 dragover 下面请看代码:

(function(){ /*-------节点--------*/ var myimg = document.getElementById('myimg'); var dropBox = document.getElementById('dropBox'); /*-------事件绑定--------*/ myimg.ondragstart = drag; dropBox.ondragover = dragover; dropBox.ondrop = drop; /*-------函数----