UICOllectionView实践(二)左右滑动露出按钮

在ios8之后,苹果的SDK为UITableView加入了向左滑动露出删除等按钮的功能,但是自从开始使用UICollectionView之后,就逐渐放弃了UITableView了。正好最近有个需求是要左滑动露出一个自定义的按钮,因为UITableView并没有暴露方法可以改变button的图片,只能给定文字,既然都是要手动实现一个的话,那么就使用UICollectionView吧。


UICOllectionView实践(二)左右滑动露出按钮_第1张图片
滑动手势演示

滑动手势

这里使用的是滑动手势,交互比较好一些。若是要简单的话也可以用左右扫动的手势,直接用动画来控制最初和最终的位置就好,而且有方法可以直接判断左右滑动。使用pan的话就是要自己判断上下左右的滑动方向了。下面贴了部分的滑动方法。

- (void)panGesterDidPan:(UIPanGestureRecognizer *)panGesture {
    
    switch (panGesture.state) {
        case UIGestureRecognizerStateBegan:
        {
            origin = [panGesture translationInView:self];
            
        }
            break;
        case UIGestureRecognizerStateChanged:
        {
            CGPoint translation = [panGesture translationInView:self];
            isLeft = (translation.x - origin.x < 0);
            
            if ((isLeft && shouldRight) || (!isLeft && !shouldRight)) {
                return;
            }
            
            CGFloat maxDistance = isLeft ? kDeleteBtnWidth - 2 : kDeleteBtnWidth;
            
            distance = (fabs(translation.x) < kDeleteBtnWidth ? translation.x : (translation.x < 0 ? - maxDistance : maxDistance));
            
            distance = isLeft ? MIN(0, distance) : MAX(0, distance);
            
            self.contentView.center = CGPointMake(originCenter.x + rate * distance, self.contentView.center.y);
            

        }
            break;
        case UIGestureRecognizerStateEnded:
            
            if ((isLeft && shouldRight) || (!isLeft && !shouldRight)) {
                return;
            }
            
            if (distance - kDeleteBtnWidth < 6) {
                [UIView animateWithDuration:0.25 animations:^{
                    self.contentView.center = CGPointMake(originCenter.x + (isLeft ? - kDeleteBtnWidth : kDeleteBtnWidth), self.contentView.center.y);
                } completion:^(BOOL finished) {
                    originCenter = self.contentView.center;
                    shouldRight = isLeft;
                }];
            }
            
            break;
        default:
            break;
        
    }
}

响应多个手势

如果给cell添加手势的话,那么scrollView就没有办法获取到上下滑动的手势了,所以我们要让view响应多个手势。实现gesture的代理方法就可以实现这个效果。

合理隐藏按钮

  • 界面始终只允许一个cell滑动出按钮
  • 界面发生上下滚动的时候隐藏按钮

第二个比较容易实现,可以在界面发生滚动的时候将visibleCells直接调用隐藏的方法即可。

第一种排他性的隐藏确实有些费脑筋了。也可以模仿上面的方法,滑动的时候抛出个delegate给UICollectionView,然后让UICollectionView的visibleCells隐藏除了正在操作的cell之后的所有cell按钮。

第二种解决方案是借鉴同事的想法,在UICollectionView始终保存最后一个操作的cell,然后每次手势开始的时候进行判断,如果滑动的不是最后一次操作的的cell的话,就让上一次操作过的cell进行隐藏,是自身的话什么也不做。

使用关联对象解耦

因为要记录上一次操作过的cell,那么肯定要有属性来保存。这样的话势必要在UICollectionView里面声明响应的属性。这样的话复用起来很麻烦,于是想到用runtim动态添加属性。递归找到父UICollectionView,然后将currentCell对象关联到该view上面。这里使用内容管理是OBJC_ASSOCIATION_ASSIGN是因为UICollectionView已经对cell有强引用了,所以就不需要管理了。使用话,任何UICollectionView继承之后就可以使用了。

if (!self.parentView) {
        self.parentView = [self findParentView:self];
    }
        
JDGlobalAddressListCell *currentCell = objc_getAssociatedObject(self.parentView, @"currentCell");
            
 if (currentCell != self) {
            [currentCell hideButtonsWithAnimation:YES];
        }
  objc_setAssociatedObject(self.parentView, @"currentCell", self, OBJC_ASSOCIATION_ASSIGN);

你可能感兴趣的:(UICOllectionView实践(二)左右滑动露出按钮)