UIScrollView具有多个页面可见或较小的页面大小

Question

I'm trying to make a paging UIScrollView display multiple pages at the same time, in effect, making the page size smaller than the UIScrollview 's bounds. I've been googling for hours, but nobody seems to have a good solution.

I'm able to get the right effect visually by sizing the UIScrollview to the size I want one page to be, turning off subview clipping, and placing it inside a container that passes all of its taps to the UIScrollview . The problem with this is that with Y pages visible, it lets you scroll the last page all the way to the left, leaving Y-1 empty pages after the last page. Anyone know a way around this, or another approach to the problem?

Answer 1

I think you need something like the previews in the safari mobile browser. Here is a website with some sample code. Preview Sample Code

Answer 2

For the right end, try reducing the width of the scroll view's contentSize property enough that the scroll view will stop paging before it gets to the last page. For the left end, reduce the frame.origin.x property of each page by the same amount. The first few pages will have a negative x position within the scroll view.

Essentially, makeing the scroll view think that it's content is only pages 2 through second to last.

For example:

// scrollView has been initialized and added to the view hierarchy according to the link in @richard's answer:
// http://blog.proculo.de/archives/180-Paging-enabled-UIScrollView-With-Previews.html

CGFloat pageNum=10;
CGFloat pageWidth=scrollView.frame.size.width;
CGFloat pageHeight=scrollView.frame.size.height;
CGFloat visibleWidth=320;


// Set scrollView contentSize and create pages:

CGFloat leftShift=floor(((visibleWidth-pageWidth)/2)/pageWidth)*pageWidth;
CGFloat contentSizeReduction=2*leftShift;

scrollView.contentSize = CGSizeMake(pageNum*pageWidth-contentSizeReduction,pageHeight);

for(int i=0; i<pageNum; i++) {
  CGRect pageFrame = CGRectMake(i*pageWidth-leftShift, 0, pageWidth, pageHeight);
  UIView *pageView = [[[UIView alloc] initWithFrame:pageFrame] autorelease];

  // Initialize the page view for the current index here

  [scrollView addSubview:pageView];
}

Forgive any typos in the code. I haven't tried this yet myself.

Let me know if it works.