Core Animation <1>

核心动画是一组非常强大的处理动画的API,简单的使用就能做出非常绚丽的动画效果。每当使用核心动画的时候都需要和UIVIew的动画来个对比,确定最合适的方案

  • 核心动画的一切都是假象,并不会真正的改变图层的结构,当不需要和用户交互的时候,通常使用核心动画
  • UIVIew的动画必须通过修改属性的真实值,才能做出想要的动画效果
    贴一张核心动画的继承结构,虽然这张图到处可见
Paste_Image.png

这里跳过简单的基本使用,直接上效果。

帧动画.gif

主要代码在这里:
主要思路就是动态的获取触摸点的位置用UIBezierPath给画出来,然后设置CAKeyframeAnimationpath是当前的路径,然后把动画添加到要作用的viewlayer上。

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    //移除上一个动画
    [self.subviews.firstObject.layer removeAnimationForKey:@"DrawView"];
    //获取触摸起始点的位置
    CGPoint startPoint = [touches.anyObject locationInView:self];
    self.path = [UIBezierPath bezierPath];
    //设置起点
    [self.path moveToPoint:startPoint];
}
- (void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    CGPoint touchPoint = [touches.anyObject locationInView:self];
    [self.path addLineToPoint:touchPoint];
    [self setNeedsDisplay];
}
- (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animation];
    animation.keyPath = @"position";
    animation.path = self.path.CGPath;
    
    animation.duration = 3;
    animation.repeatCount = MAXFLOAT;
    animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    [self.subviews.firstObject.layer addAnimation:animation forKey:@"DrawView"];
}
- (void)touchesCancelled:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    [self touchesCancelled:touches withEvent:event];
}
- (void)drawRect:(CGRect)rect{
    [self.path stroke];
}
- (UIBezierPath *)path{
    if (!_path) {
        _path = [UIBezierPath bezierPath];
    }
    return _path;
}

下一个动画:


转场动画.gif

有没有感觉很熟悉,就是过年很火的支付宝抢福卡,点击当前福卡的转场效果,代码也是很简单

- (void)buttonClick{
    static int i = 3;
    [self.customButton setImage:[UIImage imageNamed:[NSString stringWithFormat:@"img0%d",i]] forState:UIControlStateNormal];
    i = (i == 3)? 2:i + 1;
    CATransition * animation = [CATransition animation];
    animation.type = @"flip";
    animation.subtype = kCATransitionFromLeft;
    animation.duration = 1.0;
    [self.customButton.layer addAnimation:animation forKey:nil];
}

最关键的就是animationtype设置动画的类型 subtype是设置动画的方向。找了一下资料动画的类型type有以下这些,效果不一一展示,

基本型:
    kCATransitionFade      交叉淡化过渡
    kCATransitionPush      新视图把旧视图推出去
    kCATransitionMoveIn    新视图移到旧视图上面
    kCATransitionReveal    将旧视图移开,显示下面的新视图

用字符串表示的类型:
    fade   push   moveIn   reveal   和系统自带的四种一样
    pageCurl               向上翻页效果
    pageUnCurl             向下翻页效果
    rippleEffect           水滴效果
    suckEffect             收缩效果,如一块布被抽走
    cube                   立方体翻滚效果
    alignedCube            立方体翻滚效果
    flip                   翻转效果
    alignedFlip            翻转效果
    oglFlip                翻转效果
    rotate                 旋转
    cameraIrisHollowOpen   相机镜头打开效果
    cameraIrisHollowClose  相机镜头关闭效果
    cameraIris             相机镜头打开关闭效果
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,634评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,951评论 3 391
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 161,427评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,770评论 1 290
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,835评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,799评论 1 294
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,768评论 3 416
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,544评论 0 271
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,979评论 1 308
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,271评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,427评论 1 345
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,121评论 5 340
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,756评论 3 324
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,375评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,579评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,410评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,315评论 2 352

推荐阅读更多精彩内容

  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥ios动画全貌。在这里你可以看...
    每天刷两次牙阅读 8,481评论 6 30
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看...
    F麦子阅读 5,110评论 5 13
  • 在iOS实际开发中常用的动画无非是以下四种:UIView动画,核心动画,帧动画,自定义转场动画。 1.UIView...
    请叫我周小帅阅读 3,089评论 1 23
  • 在ios开发工作UIview对于我们开发者最常见也是常用到的,CALayer如果不是做炫酷的动画之类的效果接触的要...
    简鱼7819阅读 230评论 0 3
  • 书写的很好,翻译的也棒!感谢译者,感谢感谢! iOS-Core-Animation-Advanced-Techni...
    钱嘘嘘阅读 2,296评论 0 6