iOS开发中让UIScrollView支持无限滚动

默认的UIScrollView滑动到底之后(假设往右),就无法继续往右滑了,但为了更好的用户体验,我们继续往右滑是自动回到第一页。这里提供一个方案。

假设有5页,其中分别放着1.jpg 2.jpg 3.jpg 4.jpg 5.jpg五张图,为支持无限滚动,我们把最后一张图复制一份追加到第一张左边,把第一张图复制一份追加到最后一张图右边,即新的UIScrollView有7页,分别是

[1号:5.jpg][2号:1.jpg][3号:2.jpg][4号:3.jpg][5号:4.jpg][6号:5.jpg][7号:1.jpg]

然后把初始的位置移动到2号。接下来,如果用户滑动到7号位置,则立刻把位置更换到2号,此时用户并没有发现位置发生了改变,从而实现了无限往右滚。同理,如果用户滑动到1号位置,则立刻把位置更换到6号,实现无限往左滚。至此,实现了无限滚动。

在Objective-C中的实现方案:

// 通过补充前后两张图片完成scrollView的初始化,并正确设置contentSize
// code..

// 移动到2号位置:
[scrollView scrollRectToVisible:CGRectMake(scrollView.bounds.size.width,0,scrollView.bounds.size.width,scrollView.bounds.size.height) animated:NO];

// 设置delegate
scrollView.delegate = self;

然后添加以下函数获取用户滑动scrollView并停止的动作(以下函数一般无需修改即可使用)

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
    if (scrollView.contentOffset.x == 0) {
        // 用户滑动到1号位置,此时必须跳转到倒二的位置
        [scrollView scrollRectToVisible:CGRectMake(scrollView.contentSize.width - 2 * scrollView.bounds.size.width,0,scrollView.bounds.size.width,scrollView.bounds.size.height) animated:NO];
    }
    else if (scrollView.contentOffset.x == scrollView.contentSize.width - scrollView.bounds.size.width) {
        // 用户滑动到最后的位置,此时必须跳转到2号位置
        [scrollView scrollRectToVisible:CGRectMake(scrollView.bounds.size.width,0,scrollView.bounds.size.width,scrollView.bounds.size.height) animated:NO];
    }
}


发表评论

电子邮件地址不会被公开。 必填项已用*标注