iOS UICollectionView 長按移動cell

ref:http://www.jianshu.com/p/31d07bf32d62

iOS 9以後: 示例以下


效果


前言: 看完你能夠學到哪些呢? 就是文章標題那麼多, 只有那麼多. . 手殘效果圖沒弄好.git

@property (nonatomic, strong) UICollectionView *xtCollectionView; @property (nonatomic, strong) UICollectionViewFlowLayout *flowLayout; @property (nonatomic, strong) CALayer *dotLayer; @property (nonatomic, assign) CGFloat endPoint_x; @property (nonatomic, assign) CGFloat endPoint_y; @property (nonatomic, strong) UIBezierPath *path; @property (nonatomic, strong) NSMutableArray *array; @property (nonatomic, strong) UILongPressGestureRecognizer *longPress;

初始化一個數組github

self.array = [NSMutableArray arrayWithObjects:@"紅包", @"轉帳", @"手機充值", @"芝麻信用", @"天貓", @"生活繳費", @"螞蟻唄", @"世界那麼大", @"餘額寶", @"安全快付", @"螞蟻聚寶", @"哈哈",@"紅包1", @"轉帳1", @"手機充值1", @"芝麻信用1", @"天貓1", @"生活繳費1", @"螞蟻唄1", @"世界那麼大1", @"餘額寶1", @"安全快付1", @"螞蟻聚寶1", @"哈哈1", nil];

建立CollectionView數組

- (UICollectionView *)xtCollectionView
{
    if (!_xtCollectionView) { _flowLayout = [[UICollectionViewFlowLayout alloc] init]; _flowLayout.minimumLineSpacing = 1; _flowLayout.minimumInteritemSpacing = 1; _xtCollectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 20, Screen_Width, Screen_Height - 20) collectionViewLayout:_flowLayout]; _xtCollectionView.dataSource = self; _xtCollectionView.backgroundColor = [UIColor colorWithRed:0.8568 green:0.8568 blue:0.8568 alpha:1.0]; _xtCollectionView.delegate = self; [_xtCollectionView registerClass:[XTCollectCell class] forCellWithReuseIdentifier:@"cellIdentiifer"]; } return _xtCollectionView; }

添加一個長按的手勢安全

_longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(lonePressMoving:)]; [self.xtCollectionView addGestureRecognizer:_longPress];

手勢方法的實現學習

- (void)lonePressMoving:(UILongPressGestureRecognizer *)longPress { switch (_longPress.state) { case UIGestureRecognizerStateBegan: { { NSIndexPath *selectIndexPath = [self.xtCollectionView indexPathForItemAtPoint:[_longPress locationInView:self.xtCollectionView]]; // 找到當前的cell XTCollectCell *cell = (XTCollectCell *)[self.xtCollectionView cellForItemAtIndexPath:selectIndexPath]; // 定義cell的時候btn是隱藏的, 在這裏設置爲NO [cell.btnDelete setHidden:NO]; [_xtCollectionView beginInteractiveMovementForItemAtIndexPath:selectIndexPath]; } break; } case UIGestureRecognizerStateChanged: { [self.xtCollectionView updateInteractiveMovementTargetPosition:[longPress locationInView:_longPress.view]]; break; } case UIGestureRecognizerStateEnded: { [self.xtCollectionView endInteractiveMovement]; break; } default: [self.xtCollectionView cancelInteractiveMovement]; break; } }

移動方法動畫

- (void)collectionView:(UICollectionView *)collectionView moveItemAtIndexPath:(nonnull NSIndexPath *)sourceIndexPath toIndexPath:(nonnull NSIndexPath *)destinationIndexPath { NSIndexPath *selectIndexPath = [self.xtCollectionView indexPathForItemAtPoint:[_longPress locationInView:self.xtCollectionView]]; // 找到當前的cell XTCollectCell *cell = (XTCollectCell *)[self.xtCollectionView cellForItemAtIndexPath:selectIndexPath]; [cell.btnDelete setHidden:YES]; [self.array exchangeObjectAtIndex:sourceIndexPath.item withObjectAtIndex:destinationIndexPath.item]; [self.xtCollectionView reloadData]; }

效果圖的解釋: collectionView的可編輯狀態是"假的", 只是對數據進行了處理
你可能想知道動畫的實現能夠看個人另外一篇博客iOS仿美團外賣餓了嗎App點餐動畫 ui

iOS9以前能夠參照這個


效果

Github上很早的項目了, 但願對有須要的同窗有啓發的做用, 點我下載感謝做者atom

補充說明: LXReorderableCollectionViewFlowLayout 這個繼承於UICollectionViewFlowLayout So 對於cell的調整是比較隨意像系統的同樣.
好比調整cell的間距你能夠這樣.spa


調整---cell間距
LXReorderableCollectionViewFlowLayout *flowLayout = [[LXReorderableCollectionViewFlowLayout alloc] init];
    flowLayout.minimumLineSpacing = ...; flowLayout.minimumInteritemSpacing = ...; _collection = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, s_w, s_h) collectionViewLayout:flowLayout];

搭配下面這個方法3d

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath { return CGSizeMake(..., ...); }

您可能想了解個人更多文章, 與我共同成長, 請關注我
帶你係統學習GCD[一]
帶你係統學習GCD[二]
Swift版本仿網易雲音樂播放音樂動畫效果
三分鐘教你把代碼託管到Github
Swift 很強大的圖表庫-Charts使用
Swift版仿簡書App淘寶App很友好彈出view效果


更多效果點我

 



文/夏自然後(簡書做者) 原文連接:http://www.jianshu.com/p/31d07bf32d62 著做權歸做者全部,轉載請聯繫做者得到受權,並標註「簡書做者」。
相關文章
相關標籤/搜索