動畫

隱式動畫

        //開始動畫事務(wù)
        [CATransaction begin];
        //動畫執(zhí)行時間
        [CATransaction setAnimationDuration:5];
        //設(shè)置動畫代碼塊
        layer.backgroundColor = [UIColor greenColor].CGColor;
        //動畫完成時機
        [CATransaction setCompletionBlock:^{
            NSLog(@"動畫完成");
        }];
        //提交動畫事務(wù),begin和commit之間改變的CALayer屬性,如果為Animatable,就會執(zhí)行動畫
        [CATransaction commit];

CABaseAnimation

        CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
        //動畫執(zhí)行時間
        animation.duration = 1;
        //執(zhí)行時間
        animation.fromValue = @0;
        //目標值
        animation.toValue = @1;
        //動畫時間的消耗曲線
        //1.慢-快-慢
        animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
        //2.默認為勻速
        animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
        //貝茲曲線
        animation.timingFunction = [CAMediaTimingFunction functionWithControlPoints:.25 :.1 :.25 :.1];
        [shaperLayer addAnimation:animation forKey:@"animation"];

坐標繪制

繪制工具: Paint Code

    CAShapeLayer *shaperLayer = [CAShapeLayer layer];
    shaperLayer.strokeColor = [UIColor redColor].CGColor;
    shaperLayer.frame = self.view.frame;
    shaperLayer.fillColor = [UIColor clearColor].CGColor;
    shaperLayer.lineWidth = 10;
    [self.view.layer addSublayer:shaperLayer];
    
    //// Star Drawing
    UIBezierPath* starPath = UIBezierPath.bezierPath;
    [starPath moveToPoint: CGPointMake(203, 122)];
    [starPath addLineToPoint: CGPointMake(234.74, 173.72)];
    [starPath addLineToPoint: CGPointMake(288.6, 191.44)];
    [starPath addLineToPoint: CGPointMake(254.36, 241.13)];
    [starPath addLineToPoint: CGPointMake(255.9, 303.81)];
    [starPath addLineToPoint: CGPointMake(203, 282.8)];
    [starPath addLineToPoint: CGPointMake(150.1, 303.81)];
    [starPath addLineToPoint: CGPointMake(151.64, 241.13)];
    [starPath addLineToPoint: CGPointMake(117.4, 191.44)];
    [starPath addLineToPoint: CGPointMake(171.26, 173.72)];
    [starPath closePath];
    
    shaperLayer.path = starPath.CGPath;

CAKeyFrameAnimation

    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];
    //動畫執(zhí)行時間
    animation.duration = 5;
    id color1 = (__bridge id)[UIColor redColor].CGColor;
    id color2 = (__bridge id)[UIColor greenColor].CGColor;
    id color3 = (__bridge id)[UIColor blueColor].CGColor;
    //關(guān)鍵幀的值
    animation.values = @[color1,color2,color3];
    //關(guān)鍵幀出現(xiàn)的時刻
    animation.keyTimes = @[@0.2,@0.6,@0.8];
    [layer addAnimation:animation forKey:@""];
    CALayer *demoLayer = [CALayer layer];
    demoLayer.backgroundColor = [UIColor redColor].CGColor;
    demoLayer.frame = CGRectMake(100, 100, 30, 30);
    [self.view.layer addSublayer:demoLayer];

    
    CAShapeLayer *shaperLayer = [CAShapeLayer layer];
    shaperLayer.strokeColor = [UIColor greenColor].CGColor;
    shaperLayer.frame = self.view.frame;
    shaperLayer.fillColor = [UIColor clearColor].CGColor;
    shaperLayer.lineWidth = 4;
    [self.view.layer addSublayer:shaperLayer];
    
    CAKeyframeAnimation *aniamtion = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    aniamtion.duration = 5;
    
    //// Bezier Drawing
    UIBezierPath* bezierPath = UIBezierPath.bezierPath;
    [bezierPath moveToPoint: CGPointMake(59.5, 82.5)];
    [bezierPath addCurveToPoint: CGPointMake(320.5, 119.5) controlPoint1: CGPointMake(59.5, 82.5) controlPoint2: CGPointMake(303.5, -47.5)];
    [bezierPath addCurveToPoint: CGPointMake(45.5, 675.5) controlPoint1: CGPointMake(337.5, 286.5) controlPoint2: CGPointMake(-27.5, 543.5)];
    [bezierPath addCurveToPoint: CGPointMake(267.5, 646.5) controlPoint1: CGPointMake(118.5, 807.5) controlPoint2: CGPointMake(209.5, 754.5)];
    shaperLayer.path = bezierPath.CGPath;
    
    //設(shè)置動畫的路徑
    aniamtion.path = bezierPath.CGPath;
    //讓圖像的頭部隨著動畫變化而變化
    aniamtion.rotationMode = kCAAnimationRotateAuto;
    //設(shè)置動畫自動回到回復為YES,且完成之后回到原點
    aniamtion.autoreverses = YES;
    //動畫執(zhí)行次數(shù)為2次
    aniamtion.repeatCount = 2;
    //表現(xiàn)層停留在動畫完成狀態(tài)
    aniamtion.fillMode = kCAFillModeForwards;
    //動畫完成后不移除,一直處于最后狀態(tài)
    aniamtion.removedOnCompletion = NO;
    
    [demoLayer addAnimation:aniamtion forKey:@""];

CAAnimationGroup

CAAnimationGroup *group = [CAAnimationGroup animation];
group.animations = @[animation, animation1];
group.duration = 10;
[_animationLayer addAnimation:group forKey:@"group"];

切換動畫CATransition(酷炫效果,網(wǎng)上搜索)

CATransition *transition = [CATransition animation];
//動畫類型
 transition.type = kCATransitionReveal;
// 子類型
transition.subtype = kCATransitionFromBottom;
transition.duration = 10;
[_animationLayer addAnimation:transition forKey:@"xx"];
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 顯式動畫 顯式動畫,它能夠?qū)σ恍傩宰鲋付ǖ淖远x動畫,或者創(chuàng)建非線性動畫,比如沿著任意一條曲線移動。 屬性動畫 ...
    清風沐沐閱讀 1,981評論 1 5
  • 顯式動畫 如果想讓事情變得順利,只有靠自己 -- 夏爾·紀堯姆 上一章介紹了隱式動畫的概念。隱式動畫是iOS平臺上...
    方圓幾度閱讀 536評論 0 0
  • 在iOS實際開發(fā)中常用的動畫無非是以下四種:UIView動畫,核心動畫,幀動畫,自定義轉(zhuǎn)場動畫。 1.UIView...
    請叫我周小帥閱讀 3,169評論 1 23
  • 如果想讓事情變得順利,只有靠自己 -- 夏爾·紀堯姆 上一章介紹了隱式動畫的概念。隱式動畫是在iOS平臺創(chuàng)建動態(tài)用...
    雪_晟閱讀 582評論 0 1
  • 《理想國》可能是一本假書,書的前兩章對財產(chǎn),對理想政治的討論,語言簡單,思想涵度不高,可能,這和名牌效應(yīng)一樣吧。在...
    鐘獨閱讀 334評論 3 3