自訂UITableViewCell實現左滑動多菜單功能LeftSwipe,uitableviewcell滑動

來源:互聯網
上載者:User

自訂UITableViewCell實現左滑動多菜單功能LeftSwipe,uitableviewcell滑動

  今天愚人節,小夥們,愚人節快樂!

  實現一個小功能,滑動菜單,顯示隱藏的功能菜單, 先:

                         

這裡嘗試用了下使用三個方式來實現了這個功能:

1、使用自訂UITableViewCell + UISwipeGestureRecognizer + 代理 實現;

2、使用自訂UITableViewCell + UIPanGestureRecognizer + 代理 實現;

3、使用自訂UITableViewCell + UISwipeGestureRecognizer + block 實現。

 

注意點: 使用UIPanGestureRecognizer手勢實現左滑的時候,由於拖拽手勢的方向隨意性,導致與UITableViewController的下拉重新整理手勢衝突了!

感覺還是用UISwipeGestureRecognizer清掃手勢實現好點!

 

部分代碼:

1、使用UISwipeGestureRecognizer  +  Delegate 

自訂UITableViewCell部分代碼:

1 // 2 // TanTableViewCell.h 3 // Tan_SwipeTableViewCell 4 // 5 // Created by PX_Mac on 16/3/25. 6 // Copyright © 2016年 PX_Mac. All rights reserved. 7 // 8 9 #import <UIKit/UIKit.h>10 @class MemberModel;11 @class TanTableViewCell;12 13 @protocol TanTableViewCellDelegate <NSObject>14 15 @optional16 - (void)deleteMember: (TanTableViewCell *)cell; //協議方法:刪除會員17 - (void)closeOtherCellLeftSwipe; //關閉其他儲存格的左滑18 19 @end20 21 @interface TanTableViewCell : UITableViewCell22 23 //靜態構造方法24 + (instancetype)cellWithTableView: (UITableView *)tableView;25 26 @property (nonatomic, strong) MemberModel *model; //模型屬性27 @property (nonatomic, weak) id<TanTableViewCellDelegate> delegate; //代理28 29 - (void)setData: (MemberModel *)model; //設定要顯示的資料30 - (void)closeSwipe; //關閉滑動,恢複原樣(用於在滑動目前的儲存格時,把其他已經左滑的儲存格關閉)31 32 @endView Code@implementation TanTableViewCell+ (instancetype)cellWithTableView:(UITableView *)tableView{ static NSString *reuseIdentity = @"tanCell"; TanTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:reuseIdentity]; if (cell == nil){ cell = [[TanTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:reuseIdentity]; } return cell;}- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{ if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]){ [self initSubControls]; //初始化子控制項 } return self;}//初始化子控制項- (void)initSubControls{/*....... *///3、給容器containerView綁定左右滑動清掃手勢 UISwipeGestureRecognizer *leftSwipe = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipe:)]; leftSwipe.direction = UISwipeGestureRecognizerDirectionLeft; //設定向左清掃 [self.containerView addGestureRecognizer:leftSwipe]; UISwipeGestureRecognizer *rightSwipe = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipe:)]; rightSwipe.direction = UISwipeGestureRecognizerDirectionRight;//設定向右清掃 [self.containerView addGestureRecognizer:rightSwipe]; self.selectionStyle = UITableViewCellSelectionStyleNone; //設定儲存格選中樣式 [self.contentView bringSubviewToFront:self.containerView]; //設定containerView顯示在最上層}//左滑動和右滑動手勢- (void)swipe: (UISwipeGestureRecognizer *)sender{ if (sender.direction == UISwipeGestureRecognizerDirectionLeft){ if (self.isOpenLeft) return; //已經開啟左滑,不再執行 //開始左滑: 先調用代理關閉其他cell的左滑 if ([self.delegate respondsToSelector:@selector(closeOtherCellLeftSwipe)]) [self.delegate closeOtherCellLeftSwipe]; [UIView animateWithDuration:0.5 animations:^{ sender.view.center = CGPointMake(0, CELLHEIGHT * 0.5); }]; self.isOpenLeft = YES; } else if (sender.direction == UISwipeGestureRecognizerDirectionRight){ [self closeSwipe]; //關閉左滑 }}//關閉左滑,恢複原狀- (void)closeSwipe{ if (!self.isOpenLeft) return; //還未開啟左滑,不需要執行右滑 [UIView animateWithDuration:0.5 animations:^{ self.containerView.center = CGPointMake(SCREENWIDTH * 0.5, CELLHEIGHT * 0.5); }]; self.isOpenLeft = NO;}//.....@endView Code

控制器部分代碼:

#pragma mark - UITableViewDataSource- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{ return self.dataArr.count;}- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{ TanTableViewCell *cell = [TanTableViewCell cellWithTableView:tableView]; cell.delegate = self; MemberModel *model = [self.dataArr objectAtIndex:indexPath.row]; [cell setData:model]; return cell;}#pragma mark - cell代理方法//刪除儲存格- (void)deleteMember:(TanTableViewCell *)cell{ NSIndexPath *path = [self.tableView indexPathForCell:cell]; //擷取cell所在位置 //刪除數組中資料 [self.dataArr removeObjectAtIndex:path.row]; //刪除儲存格 [self.tableView deleteRowsAtIndexPaths:@[path] withRowAnimation:UITableViewRowAnimationLeft];}//關閉其他cell的左滑- (void)closeOtherCellLeftSwipe{ //迴圈顯示的cell for (TanTableViewCell *item in self.tableView.visibleCells) { [item closeSwipe]; }}View Code

 

2、UIPanGestureRecognizer + 代理

自訂UITableViewCell部分代碼:

1 //初始化子控制項 2 - (void)initSubControls{ 3 /* ...... */ 4 5 //3、給容器containerView綁定拖動手勢 6 UIPanGestureRecognizer *panGes = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)]; 7 [self.containerView addGestureRecognizer:panGes]; 8 self.panGes = panGes; 9 10 self.selectionStyle = UITableViewCellSelectionStyleNone; //設定儲存格選中樣式11 [self.contentView bringSubviewToFront:self.containerView]; //設定containerView顯示在最上層12 }13 14 15 //拖動手勢(拖拽手勢和UITableView的下拉重新整理手勢有衝突,造成下拉重新整理不能使用)16 - (void)pan: (UIPanGestureRecognizer *)sender17 {18 //動畫結束時修正位置19 if (sender.state == UIGestureRecognizerStateEnded){20 21 //關閉其他cell的左拖拽22 if ([self.delegate respondsToSelector:@selector(closeOtherCellLeftPan:)])23 [self.delegate closeOtherCellLeftPan: self];24 25 if (sender.view.frame.origin.x < -SCREENWIDTH * 0.25){26 sender.view.transform = CGAffineTransformMakeTranslation(-SCREENWIDTH * 0.5, 0);27 [sender setTranslation:CGPointZero inView:sender.view]; //必須歸028 }29 else{30 [self closeLeftPan];31 }32 }33 34 CGPoint point = [sender translationInView:self.contentView];35 36 CGFloat tx = sender.view.transform.tx;37 38 if (tx < - SCREENWIDTH * 0.5 || tx > 0) return;39 40 //形變41 sender.view.transform = CGAffineTransformTranslate(sender.view.transform, point.x, 0);42 [sender setTranslation:CGPointZero inView:sender.view]; //必須歸043 }44 45 //關閉左拖拽46 - (void)closeLeftPan{47 self.panGes.view.transform = CGAffineTransformMakeTranslation(0, 0);48 [self.panGes setTranslation:CGPointZero inView:self.panGes.view]; //必須歸049 }View Code

 

3、UISwipeGestureRecognizer + block 

自訂UITableViewCell部分代碼:

1 // 2 // TanTableViewCell.h 3 // Tan_SwipeTableViewCell 4 // 5 // Created by PX_Mac on 16/3/25. 6 // Copyright © 2016年 PX_Mac. All rights reserved. 7 // 8 9 #import <UIKit/UIKit.h>10 @class MemberModel;11 12 @interface TanTableViewCell : UITableViewCell13 14 //靜態構造方法15 + (instancetype)cellWithTableView: (UITableView *)tableView;16 17 @property (nonatomic, strong) MemberModel *model; //模型屬性18 - (void)setData: (MemberModel *)model; //設定要顯示的資料19 20 @property (nonatomic, copy) void (^deleteMember)(); //刪除會員block回調方法21 @property (nonatomic, copy) void (^closeOtherCellSwipe)(); //關閉其他cell的左滑22 23 - (void)closeLeftSwipe; //關閉左滑24 25 @endView Code 1 //左滑動和右滑動手勢 2 - (void)swipe: (UISwipeGestureRecognizer *)sender 3 { 4 if (sender.direction == UISwipeGestureRecognizerDirectionLeft){ 5 if (self.isOpenLeft) return; //已經開啟左滑,不再執行 6 7 //開始左滑: 先調用block關閉其他可能左滑的cell 8 if (self.closeOtherCellSwipe) 9 self.closeOtherCellSwipe();10 11 [UIView animateWithDuration:0.5 animations:^{12 sender.view.center = CGPointMake(0, CELLHEIGHT * 0.5);13 }];14 self.isOpenLeft = YES;15 }16 else if (sender.direction == UISwipeGestureRecognizerDirectionRight){17 [self closeLeftSwipe]; //關閉左滑18 }19 }20 21 //關閉左滑,恢複原狀22 - (void)closeLeftSwipe{23 if (!self.isOpenLeft) return; //還未開啟左滑,不需要執行右滑24 25 [UIView animateWithDuration:0.5 animations:^{26 self.containerView.center = CGPointMake(SCREENWIDTH * 0.5, CELLHEIGHT * 0.5);27 }];28 self.isOpenLeft = NO;29 }View Code

控制器部分代碼:

1 #pragma mark - 代理方法 2 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{ 3 return self.dataArr.count; 4 } 5 6 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{ 7 TanTableViewCell *cell = [TanTableViewCell cellWithTableView:tableView]; 8 9 MemberModel *model = [self.dataArr objectAtIndex:indexPath.row];10 [cell setData:model]; //設定資料11 12 __weak typeof(self) tempSelf = self;13 __weak typeof(cell) tempCell = cell;14 15 //設定刪除cell回調block16 cell.deleteMember = ^{17 NSIndexPath *tempIndex = [tempSelf.tablView indexPathForCell:tempCell];18 [tempSelf.dataArr removeObject:tempCell.model];19 [tempSelf.tablView deleteRowsAtIndexPaths:@[tempIndex] withRowAnimation:UITableViewRowAnimationLeft];20 };21 22 //設定當cell左滑時,關閉其他cell的左滑23 cell.closeOtherCellSwipe = ^{24 for (TanTableViewCell *item in tempSelf.tablView.visibleCells) {25 if (item != tempCell) [item closeLeftSwipe];26 }27 };28 29 return cell;30 }View Code

 

DEMO下載:

github地址:https://github.com/xiaotanit/Tan_UITableViewCellLeftSwipe

csdn地址:http://download.csdn.net/detail/tandaxia/9479428

 

原文連結:http://www.cnblogs.com/tandaxia/p/5346659.html

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.