你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發綜合 >> iOS動畫實現總結

iOS動畫實現總結

編輯:IOS開發綜合
在iOS中,動畫實現方向有兩種,一種是操作UIView的animation方法,另外一種就是核心動畫,但到iOS7中,UIView又跟核心動畫牽扯在一起。   方式一(利用核心動畫添加動畫) 核心動畫的層次關系       轉場動畫(CATransition)   用於做場景的轉換動畫,能偶為層提供移出屏幕和一如屏幕的動畫效果。 UINavigationController就是通過CATransition實現了講控制器的師徒推入屏幕的動畫效果。 常用屬性 type動畫過度類型 subtype:動畫過度方向 startProgress:動畫起點(在整體的百分比)(可用的值從0到1,在動畫中起點或終點的逗留時間,開始的時間一定要比結束的時間小,下同) endProgress:動畫終點(在整體動畫的百分比)  
CABasicAnimation *baseAnimation = [CABasicAnimation animationWithKeyPath:@"bounds"];
  baseAnimation.fromValue = [NSValue valueWithCGRect:CGRectMake(20, 20, 100, 100)];
  baseAnimation.toValue = [NSValue valueWithCGRect:CGRectMake(100, 100, 200, 200)];

  baseAnimation.duration = 2.0;
  baseAnimation.removedOnCompletion = NO;
  baseAnimation.fillMode = kCAFillModeForwards;
  baseAnimation.repeatCount = MAXFLOAT;

  [self.myView.layer addAnimation:baseAnimation forKey:nil];

 

  基本動畫(CABasicAnimation),是CAPropertyAnimation的子類,一個動畫可控制一個屬性的變化,變化值只能是兩個值中變化,可以在fromValue和toValue兩個值中設置    
CABasicAnimation *baseAnimation = [CABasicAnimation animationWithKeyPath:@"bounds"];
  baseAnimation.fromValue = [NSValue valueWithCGRect:CGRectMake(20, 20, 100, 100)];
  baseAnimation.toValue = [NSValue valueWithCGRect:CGRectMake(100, 100, 200, 200)];

  baseAnimation.duration = 2.0;
  baseAnimation.removedOnCompletion = NO;
  baseAnimation.fillMode = kCAFillModeForwards;
  baseAnimation.repeatCount = MAXFLOAT;

  [self.myView.layer addAnimation:baseAnimation forKey:nil];

 

    幀動畫(CAKeyframeAnimation),幀動畫也是CAPropertyAnimation的子類,所以也是控制一個view的屬性做動畫,與CABaseAnimation不同的是,CAKeyFrameAnimation可以添加多個關鍵幀,而CABaseAnimation可以看做是兩個關鍵幀的幀動畫,我們可以好好利用幀動畫的關鍵幀來做比較有趣的動畫,如泡泡效果。    
   CAAnimationGroup *group = [[CAAnimationGroup alloc] init];
//    位移
    CAKeyframeAnimation *positionAnima = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    positionAnima.calculationMode = kCAAnimationCubicPaced;
    positionAnima.duration = 5;
    positionAnima.fillMode = kCAFillModeForwards;
    positionAnima.removedOnCompletion = NO;
    positionAnima.repeatCount = MAXFLOAT;
    positionAnima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];

//    添加移動路徑
    CGMutablePathRef curvedPath = CGPathCreateMutable();
    CGRect circleContainer = CGRectInset(myView.frame, myView.frame.size.width / 2 - 3, myView.frame.size.height / 2 - 3);
    CGPathAddEllipseInRect(curvedPath, NULL, circleContainer);
    positionAnima.path = curvedPath;
    CGPathRelease(curvedPath);
    [myView.layer addAnimation:positionAnima forKey:nil];

//    縮放X
    CAKeyframeAnimation *scaleX = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale.x"];
    scaleX.duration = 1.0;
    scaleX.values = @[@1.0,@1.1,@1.0];
    scaleX.keyTimes = @[@0.0,@0.5,@1.0];
    scaleX.repeatCount = MAXFLOAT;
    scaleX.autoreverses = YES;

    scaleX.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    [myView.layer addAnimation:scaleX forKey:nil];

//    縮放Y
    CAKeyframeAnimation *scaleY = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale.y"];
    scaleY.duration = 1.5;
    scaleY.values = @[@1.0,@1.1,@1.0];
    scaleY.keyTimes = @[@0.0,@0.5,@1.0];
    scaleY.repeatCount = MAXFLOAT;
    scaleY.autoreverses = YES;

    group.animations = @[positionAnima,scaleX,scaleY];
    scaleY.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    [myView.layer addAnimation:scaleY forKey:nil];

 

運行效果   由於本人的電腦是黑蘋果,所以將就一下啦,哈哈,白蘋果應該不會這樣的。   動畫組(CAAnimationGroup)CAAnimation的子類,可以保存一組動畫對象,講CAAnimationGroup對象加入層後,組中所有動畫可以同時運行,所以,當我們需要做多個動畫並且執行的時間不一樣的時候,動畫組就不適用。例如上面的泡泡效果。 group.animations = [裡面放動畫對象];     方式二(利用UIView添加動畫) UIView動畫(手碼) 添加單個動畫  
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:4];
CGPoint point = self.myView.center;
point.y += 150;
[self.myView setCenter:point];
[UIView commitAnimations];

 

    添加多個動畫  
  [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:4];
    CGPoint point = self.myView.center;
    point.y += 150;
    [self.myView setCenter:point];
    [UIView commitAnimations];

    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:4];
    [self.myView setAlpha:0.1];
    [UIView commitAnimations];

 

  UIView動畫(Block) [UIView animateWithDuration:4 animations:^{         CGPoint point = self.myView.center;         point.y += 150;         [self.myView setCenter:point];     }];     UIView動畫(Block幀動畫),從iOS7開啟,蘋果提供了比較便捷的方法來調用幀動畫,不用新建幀動畫實例,直接對layer的屬性進行控制。  
[UIView animateKeyframesWithDuration:0.5 delay:1 options:UIViewKeyframeAnimationOptionAutoreverse animations:^{
        self.view.bounds = CGRectMake(30, 30, 30, 30);
    } completion:^(BOOL finished) {

    }];

 

UIView轉場動畫。 + (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion     這個方法應該不好理解,簡單來說,這個方法調用完畢後,相當於執行了兩句代碼,    
// 添加toView到父視圖
[fromView.superview addSubview:toView];
// 把fromView從父視圖中移除
[fromView.superview removeFromSuperview];
- duration:動畫的持續時間
- duration:動畫的持續時間
- options:轉場動畫的類型
- animations:將改變視圖屬性的代碼放在這個block中
- completion:動畫結束後,會自動調用這個block

 

 
  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved