IOS Animation-CABasicAnimation例子(简单动画实现)

这些例子都是CABasicAnimation的一些简单实现的动画,例如移动、透明度、翻转等等。方法里面传入一个CALayer类或者子类就可以了。

下面是用swift实现的,这些方法我们也可以用作公共类来调用:

    //移动动画position
    func addLayerAnimationPosition(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "position")
        //开始的位置
        animation.fromValue = NSValue(CGPoint: layer.position)
        //移动到的位置
        animation.toValue = NSValue(CGPoint: CGPointMake(120, 200))
        //持续时间
        animation.duration = 3
        //运动后的位置保持不变(layer的最后位置是toValue)
        animation.removedOnCompletion = false
        animation.fillMode = kCAFillModeForwards

        //添加动画
        layer.addAnimation(animation, forKey: "addLayerAnimationPosition")
    }

    //透明度 opacity
    func addLayerAnimationOpacity(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "opacity")
        animation.fromValue = 1
        animation.toValue = 0
        animation.duration = 3

        layer.addAnimation(animation, forKey: "addLayerAnimationOpacity")

    }

    //变大与位置 bounds
    func addLayerAnimationBounds(layer:CALayer) {
        let animation = CABasicAnimation(keyPath: "bounds")
        animation.toValue = NSValue(CGRect:CGRectMake(130, 200, 140, 140))
        animation.duration = 3
        animation.repeatCount = 1

        layer.addAnimation(animation, forKey: "addLayerAnimationBounds")
    }

    //由小变大 bounds.size
    func addLayerAnimationBoundsSize(layer:CALayer) {
        let animation = CABasicAnimation(keyPath: "bounds.size")
        animation.fromValue = NSValue(CGSize: layer.bounds.size)
        animation.toValue = NSValue(CGSize:CGSizeMake(layer.bounds.size.width+20, layer.bounds.size.height+20))
        animation.duration = 3
        animation.repeatCount = 1

        layer.addAnimation(animation, forKey: "addLayerAnimationBoundsSize")
    }

    //改变颜色 backgroundColor
    func addLayerAnimationBackgroundColor(layer:CALayer) {
        let animation = CABasicAnimation(keyPath: "backgroundColor")
        animation.toValue = UIColor.blueColor().CGColor
        animation.duration = 3
        animation.repeatCount = 1

        layer.addAnimation(animation, forKey: "addLayerAnimationMargin")
    }

    //渐变圆角 cornerRadius
    func addLayerAnimationCornerRadius(layer:CALayer) {
        let animation = CABasicAnimation(keyPath: "cornerRadius")
        animation.toValue = 30
        animation.duration = 3
        animation.repeatCount = 1

        layer.addAnimation(animation, forKey: "addLayerAnimationCornerRadius")
    }

    //改变边框border的大小(图形周围边框,border默认为黑色), borderWidth
    func addLayerAnimationBorderWidth(layer:CALayer) {
        let animation = CABasicAnimation(keyPath: "borderWidth")
        animation.toValue = 10
        animation.duration = 3
        animation.repeatCount = 1

        layer.addAnimation(animation, forKey: "addLayerAnimationBorderWidth")
    }

    //改变layer内容(图片),注意如果想要达到改变内容的动画效果,首先在运行动画之前定义好layer的contents contents
    func addLayerAnimationContents(layer:CALayer) {
        let animation = CABasicAnimation(keyPath: "contents")
        let toImage = UIImage.init(named: "通车辆设计矢量素材-06.png")?.CGImage
        animation.toValue = toImage
        animation.duration = 3
        animation.repeatCount = 1

        layer.addAnimation(animation, forKey: "addLayerAnimationBounds")
    }

    //缩放、放大 transform.scale
    func addLayerAnimationTransformScale(layer:CALayer) {
        let animation = CABasicAnimation(keyPath: "transform.scale")
        //开始时的倍率
        animation.fromValue = 1.0
        //结束时的倍率
        animation.toValue = 0.5
        animation.duration = 3
        animation.repeatCount = 1
        animation.autoreverses = true

        layer.addAnimation(animation, forKey: "addLayerAnimationScale")
    }

    //旋转动画(翻转,沿着X轴) transform.rotation.x
    func addLayerAnimationTranformRotationX(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "transform.rotation.x")
        //旋转180度 = PI
        animation.toValue = M_PI
        animation.duration = 3
        animation.repeatCount = 1
        //这里我们可以添加可以不添加,添加一个缓慢进出的动画效果(int/out)。当不添加时,匀速运动,会使用kCAMediaTimingFunctionLinear;当添加时,layer会在开始和结束时比较缓慢
        animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)

        layer.addAnimation(animation, forKey: "addLayerAnimationTranformRotationX")
    }

    //旋转动画(翻转,沿着Y轴) transform.rotation.y
    func addLayerAnimationTranformRotationY(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "transform.rotation.y")
        //旋转180度 = PI
        animation.toValue = M_PI
        animation.duration = 3
        animation.repeatCount = 1
        //这里我们可以添加可以不添加,添加一个缓慢进出的动画效果(int/out)。当不添加时,匀速运动,会使用kCAMediaTimingFunctionLinear;当添加时,layer会在开始和结束时比较缓慢
        animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)

        layer.addAnimation(animation, forKey: "addLayerAnimationTranformRotationY")
    }

    //旋转动画(沿着Z轴) transform.rotation.z
    func addLayerAnimationTranformRotationZ(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "transform.rotation.z")
        //旋转360度 = PI*2
        animation.toValue = M_PI*2
        animation.duration = 3
        animation.repeatCount = 1
        //这里我们可以添加可以不添加,添加一个缓慢进出的动画效果(int/out)。当不添加时,匀速运动,会使用kCAMediaTimingFunctionLinear;当添加时,layer会在开始和结束时比较缓慢
        animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)

        layer.addAnimation(animation, forKey: "addLayerAnimationTranformRotationZ")
    }

    //横向移动(沿着X轴) transform.translation.x
    func addLayerAnimationTranformTranslationX(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "transform.translation.x")
        animation.toValue = 20
        animation.duration = 3
        animation.repeatCount = 1
        //这里我们可以添加可以不添加,添加一个缓慢进出的动画效果(int/out)。当不添加时,匀速运动,会使用kCAMediaTimingFunctionLinear;当添加时,layer会在开始和结束时比较缓慢
        animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)

        layer.addAnimation(animation, forKey: "addLayerAnimationTranformTranslationX")
    }

    //纵向移动(沿着Y轴) transform.translation.y
    func addLayerAnimationTranformTranslationY(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "transform.translation.y")
        animation.toValue = 20
        animation.duration = 3
        animation.repeatCount = 1
        //这里我们可以添加可以不添加,添加一个缓慢进出的动画效果(int/out)。当不添加时,匀速运动,会使用kCAMediaTimingFunctionLinear;当添加时,layer会在开始和结束时比较缓慢
        animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)

        layer.addAnimation(animation, forKey: "addLayerAnimationTranformTranslationY")
    }

如果我们只要看keypath的值,我们可以看到下面文章

http://www.cnblogs.com/alunchen/p/5300075.html

时间: 2024-10-21 16:05:12

IOS Animation-CABasicAnimation例子(简单动画实现)的相关文章

[iOS Animation]-CALayer 隐式动画

隐式动画 按照我的意思去做,而不是我说的. -- 埃德娜,辛普森 我们在第一部分讨论了Core Animation除了动画之外可以做到的任何事情.但是动画是Core Animation库一个非常显著的特性.这一章我们来看看它是怎么做到的.具体来说,我们先来讨论框架自动完成的隐式动画(除非你明确禁用了这个功能). 事务 Core Animation基于一个假设,说屏幕上的任何东西都可以(或者可能)做动画.动画并不需要你在Core Animation中手动打开,相反需要明确地关闭,否则他会一直存在.

[iOS Animation]-CALayer 显示动画

显式动画 如果想让事情变得顺利,只有靠自己 -- 夏尔·纪尧姆 上一章介绍了隐式动画的概念.隐式动画是在iOS平台创建动态用户界面的一种直接方式,也是UIKit动画机制的基础,不过它并不能涵盖所有的动画类型.在这一章中,我们将要研究一下显式动画,它能够对一些属性做指定的自定义动画,或者创建非线性动画,比如沿着任意一条曲线移动. 属性动画 首先我们来探讨一下属性动画.属性动画作用于图层的某个单一属性,并指定了它的一个目标值,或者一连串将要做动画的值.属性动画分为两种:基础和关键帧. 基础动画 动画

[iOS Animation]-CALayer 显示动画 对图层树的动画

对图层树的动画 CATransition并不作用于指定的图层属性,这就是说你可以在即使不能准确得知改变了什么的情况下对图层做动画,例如,在不知道UITableView哪一行被添加或者删除的情况下,直接就可以平滑地刷新它,或者在不知道UIViewController内部的视图层级的情况下对两个不同的实例做过渡动画. 这些例子和我们之前所讨论的情况完全不同,因为它们不仅涉及到图层的属性,而且是整个图层树的改变--我们在这种动画的过程中手动在层级关系中添加或者移除图层. 这里用到了一个小诡计,要确保C

iOS Core Animation Advanced Techniques-显式动画

上七章节: 图层树 图层的寄宿图 图层几何学 图层视觉效果 图层变换 专用图层 隐式动画 这篇随笔主要介绍有关图层显式动画. 显示动画: 能对一些属性做指定的自定义动画,或者创建非线性动画 属性动画: 属性动画作用于图层的某个单一属性,并指定了它的一个目标值,或一连串将要做动画的值 属性动画分两种: 1.基础 2.关键帧 基础动画:(通过CALayer的实例方法addAnimation: forKey:给图层添加显示动画) CABasicAnimation-->CAPropertyAnimati

Swift 实现iOS Animation动画教程

这是一篇翻译文章.原文出处:http://www.raywenderlich.com/95910/uiview-animation-swift-tutorial 动画( animation)是iOS用户界面中非常重要的知识.动画可以吸引用户的注意力,使程序更加美观生动. 更值得注意的是,在扁平化设计时代,动画是让优秀程序脱引而出的一个关键因素. 举个例子 下载这个开始项目(地址:http://cdn4.raywenderlich.com/wp-content/uploads/2015/02/Ba

iOS开发CABasicAnimation动画理解

1.CALayer简介 CALayer是个与UIView很类似的概念,同样有backgroundColor.frame等相似的属性,我们可以将UIView看做一种特殊的CALayer.但实际上UIView是对CALayer封装,在CALayer的基础上再添加交互功能.UIView的显示必须依赖于CALayer.我们同样可以跟新建view一样新建一个layer,然后添加到某个已有的layer上,同样可以对layer调整大小.位置.透明度等.一般来说,layer可以有两种用途:一是对view相关属性

ios状态栏调整 简单动画的知识点

首先状态栏式view的属性,所以在viewController中直接重写: /** 修改状态栏 */ - (UIStatusBarStyle)preferredStatusBarStyle { // 修改状态栏的颜色(白色) return UIStatusBarStyleLightContent; } // 这种返回值没有*的说明不是对象,那么不是枚举就是结构体,大多数情况是枚举,所以取值也比较简单,一般是返回值后边加上状态: 在UIKit学习中常用的块动画: // 块动画 animateWit

iOS Core Animation学习总结(3)--动画的基本类型

一. CABasicAnimation (基础动画) 移位: CABasicAnimation *animation = [CABasicAnimation animation]; //keyPath指定动画类别,position表示移位 animation.keyPath = @"position"; //移动到x=200,y=200的位置 animation.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 200)]; an

ios animate简单动画体验

/* ===手势===== 一. 1.UISwipeGestureRecognizer 实例化一个手势 initWithTarget 2.set手势滑向方向 3.self.view 添加这个手势实例 4.添加事件 二. 轻点击 UITapGestureRecognizer .numberOfTouchesRequire 手指数 .numberOfTapsRequire 点击数 [  requireGestureRecognizerToFail:] 事件冲突执行哪一个 1 2 UISwipeGes