iOS基本動畫

IOS動畫學習(一)函數


(1)基礎動畫CABasicAnimation學習

//基礎動畫
    CABasicAnimation *base = [CABasicAnimation animationWithKeyPath:@"position"];
    
    base.duration = 1.0f;
    
    base.toValue = [NSValue valueWithCGPoint:CGPointMake(30, 40)];
    
    
    base.delegate = self;
    
    [self.view.layer addAnimation:base forKey:@"basean"];
    
  
  
  //委託函數  
    -(void)animationDidStart:(CAAnimation *)anim {
    
    
    NSLog(@"動畫開始");
}

-(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {
    

    NSLog(@"動畫結束");
}


(2)關鍵幀動畫CAKeyframeAnimation動畫

//關鍵幀動畫(path的優先級比values得高,兩個都設置優先執行path)
    CAKeyframeAnimation *keyFrame = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    
    keyFrame.duration = 2.0f;
    
    keyFrame.repeatCount = 10;
    keyFrame.values = @[
                        [NSValue valueWithCGPoint:CGPointMake(80, 220)],
                        [NSValue valueWithCGPoint:CGPointMake(90, 230)],
                        [NSValue valueWithCGPoint:CGPointMake(100, 240)],
                        [NSValue valueWithCGPoint:CGPointMake(110, 250)]
                        ];
    
    keyFrame.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; //淡出淡入
    
    
//    CGMutablePathRef path = CGPathCreateMutable();
//    CGPathMoveToPoint(path, NULL, self.view.layer.position.x, self.view.layer.position.y);
//    
//    CGPathAddCurveToPoint(path, NULL, 80, 220, 90, 230, 100, 240);//貝塞爾曲線(三點肯定一條曲線)
//    
//    keyFrame.path = path;
//    
//    CGPathRelease(path);
    
    
    keyFrame.autoreverses = YES;
    
    [self.view.layer addAnimation:keyFrame forKey:@"keyFrame"];


(3)轉場動畫CATransitioncode

//轉換動畫
    CATransition *transi = [CATransition animation];
    
    transi.type = kCATransitionMoveIn; //新視圖覆蓋舊試圖上
    
    transi.subtype = kCATransitionFromLeft; //過渡動畫,從左側
    
    transi.duration = 1.0f;
    
    [self.view.layer addAnimation:transi forKey:@"transi"];


(4)組動畫CAAnimationGrouporm

//繞z軸旋轉
    CABasicAnimation *ratate = [CABasicAnimation animationWithKeyPath:@"transform.ratation.z"];
    
    ratate.toValue = [NSNumber numberWithFloat:M_PI * 3];
    ratate.removedOnCompletion = NO;
    
    ratate.autoreverses = YES;
    ratate.duration = 1.0f;
    
    //移動動畫
    CAKeyframeAnimation *positionKey = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    
    CGPoint endPoint = CGPointMake(50, 300);
    
    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path, NULL, self.view.layer.position.x, self.view.layer.position.y);
    
    CGPathAddCurveToPoint(path, NULL, 160, 280, -30, 300, endPoint.x, endPoint.y);
    
    positionKey.path = path;
    
    positionKey.autoreverses = YES;
    positionKey.removedOnCompletion = NO;
    
    
    
    //組動畫
    CAAnimationGroup *group = [CAAnimationGroup animation];

    group.animations = @[ratate,positionKey];
    group.duration = 8.0f;
    group.removedOnCompletion = NO;
    group.beginTime = CACurrentMediaTime() + 2;
    
    [self.view.layer addAnimation:group forKey:@"group"];


(5)UIView封裝的block動畫ip

//block方式
    /*開始動畫,UIView的動畫方法執行完後動畫會停留在重點位置,而不須要進行任何特殊處理
     duration:執行時間
     delay:延遲時間
     options:動畫設置,例如自動恢復、勻速運動等
     completion:動畫完成回調方法
     */
    
    //UIView封裝的動畫
    //(1)關鍵幀
    [UIView animateKeyframesWithDuration:8.0f delay:0 options:UIViewKeyframeAnimationOptionAutoreverse | UIViewKeyframeAnimationOptionRepeat animations:^{
        
        [UIView addKeyframeWithRelativeStartTime:0 relativeDuration:0.5 animations:^{
            
        }];
        
        [UIView addKeyframeWithRelativeStartTime:0.5 relativeDuration:0.25 animations:^{
            
        }];
        
        [UIView addKeyframeWithRelativeStartTime:0.75 relativeDuration:0.25 animations:^{
            
            
        }];
        
    } completion:^(BOOL finished) {
        
    }];
    
    
    /*建立彈性動畫
     damping:阻尼,範圍0-1,阻尼越接近於0,彈性效果越明顯
     velocity:彈性復位的速度
     */
    [UIView animateWithDuration:5.0f delay:0 usingSpringWithDamping:0.1 initialSpringVelocity:1.0 options:UIViewAnimationOptionCurveLinear animations:^{
        
        //這裏寫執行的動畫
        
    } completion:^(BOOL finished) {
        
        //動畫完成後的操做
    }];
    
    
    //轉場的block動畫
    UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectZero];
    
    [UIView transitionWithView:imageView duration:4.0f options:UIViewAnimationOptionCurveLinear | UIViewAnimationTransitionFlipFromLeft animations:^{
        
        //動畫內容
        
    } completion:^(BOOL finished) {
        
        //動畫完成的操做
    }];
相關文章
相關標籤/搜索