[iOS Animation]-CALayer 顯示動畫 動畫組

動畫組

CABasicAnimation和CAKeyframeAnimation僅僅做用於單獨的屬性，而CAAnimationGroup能夠把這些動畫組合在一塊兒。CAAnimationGroup是另外一個繼承於CAAnimation的子類，它添加了一個animations數組的屬性，用來組合別的動畫。咱們把清單8.6那種關鍵幀動畫和調整圖層背景色的基礎動畫組合起來（清單8.10），結果如圖8.3所示。

清單8.10 組合關鍵幀動畫和基礎動畫

- (void)viewDidLoad { [super viewDidLoad]; //create a path UIBezierPath *bezierPath = [[UIBezierPath alloc] init]; [bezierPath moveToPoint:CGPointMake(0, 150)]; [bezierPath addCurveToPoint:CGPointMake(300, 150) controlPoint1:CGPointMake(75, 0) controlPoint2:CGPointMake(225, 300)]; //draw the path using a CAShapeLayer CAShapeLayer *pathLayer = [CAShapeLayer layer]; pathLayer.path = bezierPath.CGPath; pathLayer.fillColor = [UIColor clearColor].CGColor; pathLayer.strokeColor = [UIColor redColor].CGColor; pathLayer.lineWidth = 3.0f; [self.containerView.layer addSublayer:pathLayer]; //add a colored layer CALayer *colorLayer = [CALayer layer]; colorLayer.frame = CGRectMake(0, 0, 64, 64); colorLayer.position = CGPointMake(0, 150); colorLayer.backgroundColor = [UIColor greenColor].CGColor; [self.containerView.layer addSublayer:colorLayer]; //create the position animation CAKeyframeAnimation *animation1 = [CAKeyframeAnimation animation]; animation1.keyPath = @"position"; animation1.path = bezierPath.CGPath; animation1.rotationMode = kCAAnimationRotateAuto; //create the color animation CABasicAnimation *animation2 = [CABasicAnimation animation]; animation2.keyPath = @"backgroundColor"; animation2.toValue = (__bridge id)[UIColor redColor].CGColor; //create group animation CAAnimationGroup *groupAnimation = [CAAnimationGroup animation]; groupAnimation.animations = @[animation1, animation2]; groupAnimation.duration = 4.0; //add the animation to the color layer  [colorLayer addAnimation:groupAnimation forKey:nil]; }

 

圖8.3 關鍵幀路徑和基礎動畫的組合

過渡

有時候對於iOS應用程序來講，但願能經過屬性動畫來對比較難作動畫的佈局進行一些改變。好比交換一段文本和圖片，或者用一段網格視圖來替換，等等。屬性動畫只對圖層的可動畫屬性起做用，因此若是要改變一個不能動畫的屬性（好比圖片），或者從層級關係中添加或者移除圖層，屬性動畫將不起做用。

因而就有了過渡的概念。過渡並不像屬性動畫那樣平滑地在兩個值之間作動畫，而是影響到整個圖層的變化。過渡動畫首先展現以前的圖層外觀，而後經過一個交換過渡到新的外觀。

爲了建立一個過渡動畫，咱們將使用CATransition，一樣是另外一個CAAnimation的子類，和別的子類不一樣，CATransition有一個type和subtype來標識變換效果。type屬性是一個NSString類型，能夠被設置成以下類型：

kCATransitionFade kCATransitionMoveIn kCATransitionPush kCATransitionReveal

 

到目前爲止你只能使用上述四種類型，但你能夠經過一些別的方法來自定義過渡效果，後續會詳細介紹。

默認的過渡類型是kCATransitionFade，當你在改變圖層屬性以後，就建立了一個平滑的淡入淡出效果。

咱們在第七章的例子中就已經用到過kCATransitionPush，它建立了一個新的圖層，從邊緣的一側滑動進來，把舊圖層從另外一側推出去的效果。

kCATransitionMoveIn和kCATransitionReveal與kCATransitionPush相似，都實現了一個定向滑動的動畫，可是有一些細微的不一樣，kCATransitionMoveIn從頂部滑動進入，但不像推送動畫那樣把老土層推走，然而kCATransitionReveal把原始的圖層滑動出去來顯示新的外觀，而不是把新的圖層滑動進入。

後面三種過渡類型都有一個默認的動畫方向，它們都從左側滑入，可是你能夠經過subtype來控制它們的方向，提供了以下四種類型：

kCATransitionFromRight kCATransitionFromLeft kCATransitionFromTop kCATransitionFromBottom

 

一個簡單的用CATransition來對非動畫屬性作動畫的例子如清單8.11所示，這裏咱們對UIImage的image屬性作修改，可是隱式動畫或者CAPropertyAnimation都不能對它作動畫，由於Core Animation不知道如何在插圖圖片。經過對圖層應用一個淡入淡出的過渡，咱們能夠忽略它的內容來作平滑動畫（圖8.4），咱們來嘗試修改過渡的type常量來觀察其它效果。

清單8.11 使用CATransition來對UIImageView作動畫

@interface ViewController () @property (nonatomic, weak) IBOutlet UIImageView *imageView; @property (nonatomic, copy) NSArray *images; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; //set up images self.images = @[[UIImage imageNamed:@"Anchor.png"], [UIImage imageNamed:@"Cone.png"], [UIImage imageNamed:@"Igloo.png"], [UIImage imageNamed:@"Spaceship.png"]]; } - (IBAction)switchImage { //set up crossfade transition CATransition *transition = [CATransition animation]; transition.type = kCATransitionFade; //apply transition to imageview backing layer  [self.imageView.layer addAnimation:transition forKey:nil]; //cycle to next image UIImage *currentImage = self.imageView.image; NSUInteger index = [self.images indexOfObject:currentImage]; index = (index + 1) % [self.images count]; self.imageView.image = self.images[index]; } @end

 

你能夠從代碼中看出，過渡動畫和以前的屬性動畫或者動畫組添加到圖層上的方式一致，都是經過 -addAnimation:forKey: 方法。可是和屬性動畫不一樣的是，對指定的圖層一次只能使用一次CATransition，所以，不管你對動畫的鍵設置什麼值，過渡動畫都會對它的鍵設置成「transition」，也就是常量kCATransition。

圖8.4 使用CATransition對圖像平滑淡入淡出

隱式過渡

CATransision能夠對圖層任何變化平滑過渡的事實使得它成爲那些很差作動畫的屬性圖層行爲的理想候選。蘋果固然意識到了這點，而且當設置了CALayer的content屬性的時候，CATransition的確是默認的行爲。可是對於視圖關聯的圖層，或者是其餘隱式動畫的行爲，這個特性依然是被禁用的，可是對於你本身建立的圖層，這意味着對圖層contents圖片作的改動都會自動附上淡入淡出的動畫。

咱們在第七章使用CATransition做爲一個圖層行爲來改變圖層的背景色，固然backgroundColor屬性能夠經過正常的CAPropertyAnimation來實現，但這不是說不能夠用CATransition來實行。