IOS:具有无限分页视图的UIScrollView

Question

我有这个代码用于滚动视图以显示3个图像:

const CGFloat kScrollObjHeight = 150.0;
const CGFloat kScrollObjWidth = 320.0;
const NSUInteger kNumImages = 3;


- (void)layoutScrollImages
{
UIImageView *view = nil;
NSArray *subviews = [scrollView1 subviews];

// reposition all image subviews in a horizontal serial fashion
CGFloat curXLoc = 0;
for (view in subviews)
{
    if ([view isKindOfClass:[UIImageView class]] && view.tag > 0)
    {
        CGRect frame = view.frame;
        frame.origin = CGPointMake(curXLoc, 0);
        view.frame = frame;

        curXLoc += (kScrollObjWidth);
    }
}


// set the content size so it can be scrollable
[scrollView1 setContentSize:CGSizeMake((kNumImages * kScrollObjWidth), [scrollView1 bounds].size.height)];

}

- (void)viewDidLoad
{
self.view.backgroundColor = [UIColor viewFlipsideBackgroundColor];

// 1. setup the scrollview for multiple images and add it to the view controller
//
// note: the following can be done in Interface Builder, but we show this in code for clarity
[scrollView1 setBackgroundColor:[UIColor blackColor]];
[scrollView1 setCanCancelContentTouches:NO];
scrollView1.indicatorStyle = UIScrollViewIndicatorStyleWhite;
scrollView1.clipsToBounds = YES;        // default is NO, we want to restrict drawing within our scrollview
scrollView1.scrollEnabled = YES;

// pagingEnabled property default is NO, if set the scroller will stop or snap at each photo
// if you want free-flowing scroll, don't set this property.
scrollView1.pagingEnabled = YES;
scrollView2.pagingEnabled = YES;
scrollView3.pagingEnabled = YES;

// load all the images from our bundle and add them to the scroll view
NSUInteger i;
for (i = 1; i <= kNumImages; i++)
{
    NSString *imageName = [NSString stringWithFormat:@"image%d.jpg", i];
    UIImage *image = [UIImage imageNamed:imageName];
    UIImageView *imageView = [[UIImageView alloc] initWithImage:image];

    // setup each frame to a default height and width, it will be properly placed when we call "updateScrollList"
    CGRect rect = imageView.frame;
    rect.size.height = kScrollObjHeight;
    rect.size.width = kScrollObjWidth;
    imageView.frame = rect;
    imageView.tag = i;  // tag our images for later use when we place them in serial fashion
    [scrollView1 addSubview:imageView];
    //[scrollView2 addSubview:imageView];
    //[scrollView3 addSubview:imageView];
    [imageView release];
}

[self layoutScrollImages];  // now place the photos in serial layout within the scrollview

}

但是现在我想做一个滚动视图,当滚动视图的第一个图像出现在最后一个图像时,当我有第一个图像时,如果我回去,它必须显示最后一个图像; 所以我想创建一个分页循环.

Answer 1

基本思想是将自己设置为UIScrollViewDelegate并将一些模运算应用于滚动位置以便将其包裹起来.

这个想法有两个基本的变化.假设您的图像是A,B,C,那么您目前在以ABC顺序排列的scrollview中拥有它们.

在更符合逻辑的解决方案中 - 特别是如果你有很多很多图像 - 你会看到滚动位置,一旦它到达向右推动视图并且C离开屏幕的位置,你将图像重新排序为CAB并将当前滚动位置向右移动一个点,以便移动对用户不可见.换句话说,滚动位置被限制在两个屏幕的区域,以B的中间为中心(因此,你得到所有的B和半边的屏幕).无论何时将其从左侧某处包裹到右侧某处,您都可以将所有图像视图向右移动一个位置.反之亦然.

在稍微更容易实现的变体中,不是创建具有ABC排列的图像的滚动视图,而是安排为CABCA.然后应用相同的逻辑环绕,但应用于四个屏幕的中心区域,不要进行任何视图重组.

确保使用just setContentOffset:(或点符号,如同scrollView.contentOffset =)作为setter.setContentOffset:animated:否定速度.