iOS UICollectionView 高级用法(长按cell移动重新排列)

iOS9 之后

前言: 看完你可以学到哪些呢? 就是文章标题那么多, 只有那么多. . 手残效果图没弄好.

@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;

初始化一个数组

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];
}
![效果.gif](http://upload-images.jianshu.io/upload_images/1506501-0c407e1e5fe8243c.gif?imageMogr2/auto-orient/strip)

原文链接点我

效果图的解释: collectionView的可编辑状态是”假的”, 只是对数据进行了处理
你可能想知道动画的实现可以看我的另一篇博客iOS仿美团外卖饿了吗App点餐动画

iOS9 之前

请参照这个1.
Github上很早的项目了, 希望对有需要的同学有启发的作用, 点我下载感谢作者
请参照这个2.
简书上的一篇文章

您可能想了解我的更多文章, 与我共同成长, 请关注我
带你系统学习GCD[一]
带你系统学习GCD[二]
Swift版本仿网易云音乐播放音乐动画效果
三分钟教你把代码托管到Github
Swift 很强大的图表库-Charts使用
Swift版仿简书App淘宝App很友好弹出view效果

更多效果点我