增加UIScrollView橡皮筋阻力

时间:2013-12-07 04:38:08

标签: ios iphone objective-c ipad uiscrollview

我有一个场景,我正试图在我的应用中实现,一旦你开始强迫它滚动超出其正常的内容界限,我想让UIScrollView表现得更“僵硬”。 / p>

我的意思是,当你在滚动视图的顶部或底部时,如果你点击并继续拖动,你通常可以获得滚动视图以保持滚动超出其范围,但它逐渐建立阻力,直到它通常在视图中间的中间位置停止。抬起手指时,它会快速回到滚动区域的边界。

我想要实现的目标是,我想让“越界”的拖拽效果更加沉重,所以不要用户拖动滚动视图而是“触底”中通过滚动视图边界,它完全停止在其滚动边界的大约20%左右。

我一直在尝试覆盖contentOffset委托方法中的滚动视图scrollViewDidScroll:,但这似乎不起作用,因为在那里重新设置contentOffset似乎搞砸了进一步的委托调用相同的方法。

我的下一个想法是监控与滚动视图关联的UIPanGestureRecognizer,并尝试根据其中的事件确定正确的UIScrollView contentOffset。话虽如此,我认为可能会开始走上黑客的一面,所以我想我会在这里问一些我在尝试可能会弄得一团糟之前没有考虑过的其他解决方案。

谢谢!

4 个答案:

答案 0 :(得分:5)

我在Swift中使用以下代码。这适用于水平滚动,可以很容易地适应垂直滚动。根据是否启用分页,解决方案会有所不同。两者都在下面给出。

class ScrollViewDelegate : NSObject, UIScrollViewDelegate
{
    let maxOffset: CGFloat  // offset of the rightmost content (scrollview contentSize.width - frame.width)
    var prevOffset: CGFloat = 0  // previous offset (after adjusting the value)

    var totalDistance: CGFloat = 0  // total distance it would have moved (had we not restricted)
    let reductionFactor: CGFloat = 0.2  // percent of total distance it will be allowed to move (under restriction)
    let scaleFactor: CGFloat = UIScreen.mainScreen().scale  // pixels per point, for smooth translation in respective devices

    init(maxOffset: CGFloat)
    {
        self.maxOffset = maxOffset  // scrollView.contentSize.width - scrollView.frame.size.width
    }

    func scrollViewDidScroll(scrollView: UIScrollView)
    {
        let flipped = scrollView.contentOffset.x >= maxOffset  // dealing with left edge or right edge rubber band
        let currentOffset = flipped ? maxOffset - scrollView.contentOffset.x : scrollView.contentOffset.x  // for right edge, flip the values as if screen is folded in half towards the left

        if(currentOffset <= 0)  // if dragging/moving beyond the edge
        {
            if(currentOffset <= prevOffset)  // if dragging/moving beyond previous offset
            {
                totalDistance += currentOffset - prevOffset  // add the "proposed delta" move to total distance
                prevOffset = round(scaleFactor * totalDistance * reductionFactor) / scaleFactor  // set the prevOffset to fraction of total distance
                scrollView.contentOffset.x = flipped ? maxOffset - prevOffset : prevOffset  // set the target offset, after negating any flipping
            }
            else  // if dragging/moving is reversed, though still beyond the edge
            {
                totalDistance = currentOffset / reductionFactor  // set totalDistance from offset (reverse of prevOffset calculation above)
                prevOffset = currentOffset  // set prevOffset
            }
        }
        else  // if dragging/moving inside the edge
        {
            totalDistance = 0  // reset the values
            prevOffset = 0
        }
    }
}

启用分页后,弹回到静止点似乎无法按预期工作。橡皮筋不是停在页面边界处,而是超过它并在非页面偏移处停止。如果从边缘拉动是快速轻弹使得即使在您抬起手指之后它继续沿该方向移动,在反转方向并返回到静止点之前,也会发生这种情况。如果您只是暂停并离开甚至将其轻弹回到休息点,它似乎工作正常。为了解决这个问题,在下面的代码中,我尝试确定过冲的可能性,并在它返回时强行停止并尝试越过预期的页面边界。

class PageScrollViewDelegate : NSObject, UIScrollViewDelegate
{
    let maxOffset: CGFloat  // offset of the rightmost content (scrollview contentSize.width - frame.width)
    var prevOffset: CGFloat = 0  // previous offset (after adjusting the value)

    var totalDistance: CGFloat = 0  // total distance it would have moved (had we not restricted)
    let reductionFactor: CGFloat = 0.2  // percent of total distance it will be allowed to move (under restriction)
    let scaleFactor: CGFloat = UIScreen.mainScreen().scale  // pixels per point, for smooth translation in respective devices

    var draggingOver: Bool = false  // finger dragging is over or not
    var overshoot: Bool = false  // is there a chance for page to overshoot page boundary while falling back

    init(maxOffset: CGFloat)
    {
        self.maxOffset = maxOffset  // scrollView.contentSize.width - scrollView.frame.size.width
    }

    func scrollViewWillBeginDragging(scrollView: UIScrollView)
    {
        draggingOver = false  // reset the flags
        overshoot = false
    }

    func scrollViewDidEndDragging(scrollView: UIScrollView, willDecelerate decelerate: Bool)
    {
        draggingOver = true  // finger dragging is over
    }

    func scrollViewDidScroll(scrollView: UIScrollView)
    {
        let flipped = scrollView.contentOffset.x >= 0.5 * maxOffset // dealing with left edge or right edge rubber band
        let currentOffset = flipped ? maxOffset - scrollView.contentOffset.x : scrollView.contentOffset.x  // for right edge, flip the values as if screen is folded in half towards the left

        if(currentOffset <= 0)  // if dragging/moving beyond the edge
        {
            if(currentOffset <= prevOffset)  // if dragging/moving beyond previous offset
            {
                overshoot = draggingOver  // is content moving farther away even after dragging is over (caused by fast flick, which can cause overshooting page boundary while falling back)

                totalDistance += currentOffset - prevOffset  // add the "proposed delta" move to total distance
                prevOffset = round(scaleFactor * totalDistance * reductionFactor) / scaleFactor  // set the prevOffset to fraction of total distance
                scrollView.contentOffset.x = flipped ? maxOffset - prevOffset : prevOffset  // set the target offset, after negating any flipping
            }
            else  // if dragging/moving is reversed, though still beyond the edge
            {
                totalDistance = currentOffset / reductionFactor  // set totalDistance from offset (reverse of prevOffset calculation above)
                prevOffset = currentOffset  // set prevOffset
            }
        }
        else  // if dragging/moving inside the edge
        {
            if(overshoot)  // if this movement is a result of overshooting
            {
                scrollView.setContentOffset(CGPointMake(flipped ? maxOffset : 0, scrollView.contentOffset.y), animated: false)  // bring it to resting point and stop further scrolling (this is a patch to control overshooting)
            }

            totalDistance = 0  // reset the values
            prevOffset = 0
        }
    }
}

答案 1 :(得分:2)

这并不容易。

如果这只是一次性滚动视图,我可能会建议使用UIKit Dynamics进行推送,附件和弹簧行为,以获得您想要的效果。

如果您希望在应用中的每个表视图中执行此操作,我认为观看平移手势识别器是一种合理的方法。在我的头顶上,我会观察手势的状态,当它结束时我将捕获视图的垂直速度,使用UIScrollView方法计算它的停止位置,然后将其从当前位置动画到其静止位置与春天动画。你必须自己使用平移的结束速度和剩余距离+超调量来计算持续时间。

答案 2 :(得分:1)

我制作了一个处理此案例的GitHub项目

Bounce Scroll View

您可以控制滚动的阻力

答案 3 :(得分:-1)

此代码将停止您想要的边距滚动

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGFloat margin = scrollView.frame.size.height/4.0;
    if (scrollView.contentOffset.y < -margin) {
        CGPoint offset = scrollView.contentOffset;
        offset.y = -margin;
        scrollView.contentOffset = offset;
    } else if (scrollView.contentOffset.y > (scrollView.contentSize.height-scrollView.frame.size.height) + margin) {
        CGPoint offset = scrollView.contentOffset;
        offset.y = (scrollView.contentSize.height-scrollView.frame.size.height) + margin;
        scrollView.contentOffset = offset;
    }
}

希望有所帮助