A fast way to accomplish a slideshow, without spending too much time browsing around for the mind-blowing slideshow library is to grab the old UIView animations and hack your way trough it …

I did it myself and it was pretty simple actually, just read the first couple of lines on the documentation about animations, and i realized that you could not animate changing an UIImage content but you can animate the alpha of the UIView, and use that animation callback method in order to change the UIImage content, it is pretty straight forward, but if you are in a rush, i narrow it down for you all.

All we need is the group of images we want for the slideshow, the UIImageView that will serve as placeholder for our slideshow and of course a cursor pointing the next image to show. Once we have all that, as soon as the view appears you need to trigger the animation, so a good place to do this would be right on the viewDidAppear method of the ViewController. If you need the slide to trigger somewhere else, you can of course :).

- (void) viewDidLoad
{
    [super viewDidLoad];
    self.imageIndex = 0;
    self.images = @[@“image1.jpg, @“image2.jpg,  ,@“imageN.jpg];
    self.slideShowImageContainer.image = [UIImage imageNamed:self.images[self.imageIndex]];
}

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

- (void)fadeInImage
{
    [UIView beginAnimations:@"fade in" context:nil];
    [UIView setAnimationDuration:0.5];
    //1
    [UIView setAnimationDelegate:self];
    //2
    [UIView setAnimationDidStopSelector:@selector(imageViewDidStop:finished:context:)];
    //3
    self.slideShowImageContainer.alpha = 1.0;
    [UIView commitAnimations];
}

So what do we have going on here:

  1. We set the animations attributes we are using and set the animation delegate to self in order to react to the completion of the animation.
  2. We set the method we want to be called when that animation finishes.
  3. And finally we set the parameter we actually are going to animate

There is not much going on here, but the declaration of the ViewController as the animation delegate. There is only one step missing the method in charge of reacting to the callback generated by the animation completion. We named it on the selector using the setAnimationDidStopSelector method of our animation instance.

- (void)imageViewDidStop:(NSString *)paramAnimationID
              finished:(NSNumber *)paramFinished
               context:(void *)paramContext
{
    //1
    self.imageIndex = (self.imageIndex == self.images.count - 1) ? 0 : self.imageIndex + 1;
    //2
    self.slideShowImageContainer.alpha = 0.0;
    //3
    self.slideShowImageContainer.image = [UIImage imageNamed:self.images[self.imageIndex]];
    //4
    [self fadeInImage];
}
  1. We set the current index respecting the bounds.
  2. Restart the alpha of the UIImageView in order to do the animation over and over.
  3. Now once the UIImageView is no longer visible we switch the content.
  4. Finally we start the process all over again.

Easy enough right i was surprised how fast and simple this was. I hope this is helpful for anyone. Thanks for reading.

Comments