Scrollview paging with image showing slightly left or right (begin / end)

Question

I try to create a horizontal page slider like you see it in most quiz games.

Basically each page has and image/button showing slightly at the right of the screen, to indicate that there are more pages.

On the last page the user should see no image at the right, but the image on the left, as it it the last page.

So in between of images are showing left and right.

Is there a way to do this with the inspector or only programmatically?

I tried both and ended up with some weird side effects where it bounces back to the center position of the image.

See illustration below:

https://plus.google.com/u/0/101813614111502094997/posts

Answer 1

Use this code

in .h file use

@property (weak, nonatomic) IBOutlet UIScrollView *imageScrollView;
@property (weak, nonatomic) IBOutlet UIPageControl *pageControl;

in .m class

#define IS_IPHONE_5 ( fabs( ( double )[ [ UIScreen mainScreen ] bounds ].size.height - ( double )568 ) < DBL_EPSILON )

  -(void)viewDidAppear:(BOOL)animated{
         [super viewDidAppear:animated];

        NSArray *viewsToRemove = [self.imageScrollView subviews];
        for (UIView *subviewElement in viewsToRemove) {
            [subviewElement removeFromSuperview];
        }

        UIImageView *img1= [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 320, IS_IPHONE_5?370:284)];
        img1.image=[UIImage imageNamed:@"yourImage1"];
        [img1.image stretchableImageWithLeftCapWidth:320 topCapHeight:IS_IPHONE_5?370:284 ];

        UIImageView *img2= [[UIImageView alloc] initWithFrame:CGRectMake(320, 0, 320, IS_IPHONE_5?370:284)];
        img2.image=[UIImage imageNamed:@"yourImage2"];
        [img2.image stretchableImageWithLeftCapWidth:320 topCapHeight:IS_IPHONE_5?370:284 ];

        UIImageView *img3= [[UIImageView alloc] initWithFrame:CGRectMake(640, 0, 320, IS_IPHONE_5?370:284)];
        img3.image=[UIImage imageNamed:@"yourImage3"];
        [img3.image stretchableImageWithLeftCapWidth:320 topCapHeight:IS_IPHONE_5?370:284 ];

        [self.imageScrollView addSubview:img1];
        [self.imageScrollView addSubview:img2];
        [self.imageScrollView addSubview:img3];

    }

    - (void)viewDidLayoutSubviews
    {
        self.imageScrollView.contentSize= CGSizeMake((imageScrollView.frame.size.width*3) , imageScrollView.frame.size.height);

    }