首页 > 代码库 > cell拖拽滑动效果（微信聊天cell向左滑动，漏出标记已读和删除按钮）
cell拖拽滑动效果（微信聊天cell向左滑动，漏出标记已读和删除按钮）
@interface BillsCell ()
@property (nonatomic, strong) UIPanGestureRecognizer *panRecognizer;
@property(nonatomic,assign) CGFloat lastDownX ;
@property(nonatomic,assign) CGFloat originX ;
@end
<style>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 }</style>
@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;
}
cell拖拽滑动效果（微信聊天cell向左滑动，漏出标记已读和删除按钮）