在 XCode 6 & iOS7 中实现淡入淡出幻灯片

Implementing Fading Slideshow in XCode 6 & iOS7

我正在开发一个应用程序,我正在寻找一种方法来向该应用程序添加渐变幻灯片类型的元素。

我已经尝试了一些通过 google 和 Stack Exchange 找到的用户建议和答案,但是其中很多都存在问题或无法满足我的需要。

我真的很喜欢我在 GitHub 上看到的一个名为 JBKenBurns 的项目,但是当我尝试集成它时,我得到以下崩溃日志:

2014-12-31 23:36:17.164 Sir John A.[686:60b] -[UIView animateWithImages:transitionDuration:initialDelay:loop:isLandscape:]: unrecognized selector sent to instance 0x176ae980
2014-12-31 23:36:17.170 Sir John A.[686:60b] *** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '-[UIView animateWithImages:transitionDuration:initialDelay:loop:isLandscape:]: unrecognized selector sent to instance 0x176ae980'

*** First throw call stack:
(0x2de14f4b 0x385f16af 0x2de188e7 0x2de171cb 0x2dd664d8 0xe6f81 0x305a212b 0x30651eb3 0x305a212b 0x3060802f 0x30607fb9 0x3058020f 0x2dde01cd 0x2ddddb71 0x2ddddeb3 0x2dd48c27 0x2dd48a0b 0x32a29283 0x305ec049 0xe9f3d 0x38af9ab7)
libc++abi.dylib: terminating with uncaught exception of type NSException

我已经测试了他们的 Demo,它运行良好,但是当我根据他们的说明实施它时,我得到了那个崩溃日志。

我还没准备好使用这个解决方案,但让它工作会很好。

我还尝试将 UIImageView 添加到 UIViewController 并使用以下内容:

self.imagePlaceholder.animationImages = [NSArray arrayWithObjects:
                                 [UIImage imageNamed:@"1.png"],
                                 [UIImage imageNamed:@"2.png"],
                                 [UIImage imageNamed:@"3.png"], nil];
self.imagePlaceholder.animationDuration = 2.00; //1 second
self.imagePlaceholder.animationRepeatCount = 0; //infinite

[self.imagePlaceholder startAnimating]; //start the animation

这个解决方案看起来很有希望,但是图像不会相互淡入淡出,只是每秒左右发生剧烈变化。

如果有人可以帮助我使 JBKenBurns 解决方案正常工作,或者帮助我为每个图像添加平滑的淡入淡出效果,那就太棒了。

您可以使用 transitionWithView:duration:options:animations:completion: 交叉淡入淡出图像,方法是在动画块中调用 setImage。这样的东西应该可以工作,

- (void)viewDidLoad {
    [super viewDidLoad];
    self.pics = @[@"img1.JPG", @"img2.JPG", @"img3.JPG", @"img4.JPG", @"img5.JPG", @"img6.JPG", @"img7.JPG"];
    [self changeImage];
}


-(void)changeImage {
    static int counter = 0;
    [UIView transitionWithView:self.imageView
                      duration:1.0
                       options:UIViewAnimationOptionTransitionCrossDissolve
                    animations:^{
                        UIImage *img = [UIImage imageNamed:self.pics[counter]];
                        [self.imageView setImage:img];
                        counter ++;

                    } completion:^(BOOL finished) {
                        if (counter != self.pics.count) {
                            [self performSelector:@selector(changeImage) withObject:nil afterDelay:2];
                        }
                    }];
}

幻灯片放映让我们试试这个,你也可以通过使用基本动画和定时器的帮助来执行动画,例如,当你想停止动画时,你可以像下面那样做,只需使定时器无效

注意:这只是另一种动画方式

- (void)viewDidLoad {
  [super viewDidLoad];
  // Do any additional setup after loading the view, typically from a nib.

  _imagePlaceholder = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0,self.view.bounds.size.width, self.view.bounds.size.height)]; //this is image view
  _imagesArray = [[NSMutableArray alloc]initWithObjects:[UIImage imageNamed:@"image_1.jpg"],[UIImage imageNamed:@"image_2.jpg"],[UIImage imageNamed:@"image_3.jpg"],[UIImage imageNamed:@"image_4.jpg"], nil]; //images array to hold images

  [self.view addSubview:_imagePlaceholder];

  //next set up timer to change image at each intervel
  imageIndex = 0; //initially image index will be 0
  _imagePlaceholder.image = [_imagesArray objectAtIndex:imageIndex]; //initially image view contains first image
  _animTimer = [NSTimer scheduledTimerWithTimeInterval:3 target:self selector:@selector(changeImage) userInfo:nil repeats:YES];

 }

 - (void)changeImage {

  //get new index and change it
  if(imageIndex < [_imagesArray count] - 1)
  {
     imageIndex++;
  }
  else
  {
     imageIndex = 0;
  }

  UIImage *nextImage = [_imagesArray objectAtIndex:imageIndex];

  CABasicAnimation *crossFadeAnimation = [CABasicAnimation animationWithKeyPath:@"contents"];
   crossFadeAnimation.duration = 2.0; //this is lesser than timer duration 
  _imagePlaceholder.layer.contents = (id)[nextImage CGImage];
  [_imagePlaceholder.layer removeAnimationForKey:@"animateImages"];
  [_imagePlaceholder.layer addAnimation:crossFadeAnimation forKey:@"animateImages"];
  _imagePlaceholder.image = nextImage;
 }