iOS核心动画

『木辛』「月月鸟」

已于 2022-07-09 14:41:37 修改

阅读量901

点赞数 1

分类专栏： Swift iOS 文章标签： ios 动画 swift

于 2022-06-30 10:56:11 首次发布

本文链接：https://blog.csdn.net/SCDNBB/article/details/125536388

版权

iOS 同时被 2 个专栏收录

28 篇文章 0 订阅

订阅专栏

Swift

27 篇文章 0 订阅

订阅专栏

显式动画

CABasicAnimation

keyPath

let animation = CABasicAnimation(keyPath: "transform.rotation.y")

里面填的是字符串

keyPath属性说明

transform.scale = 比例转换
transform.rotation = 旋转
transform.rotation.x = x轴旋转
transform.rotation.y = y轴旋转

opacity = 透明度
margin = 边距
position ＝ 位移
backgroundColor = 背景颜色
cornerRadius = 圆角
borderWidth ＝ 边框宽度
bounds ＝ 位置，体积
contents ＝ 内容
contentsRect ＝ 面积
frame ＝ 位置，体积
hidden ＝ 是否隐藏

shadowColor ＝ 阴影颜色
shadowOffset ＝ 阴影偏移
shadowOpacity ＝ 阴影透明

shadowRadius ＝ 阴影半径

isRemovedOnCompletion

动画结束是否回到该view的原始位置，false就是不回到原始状态，true代表为动画显示的样式

animation.isRemovedOnCompletion = false

/* When true, the animation is removed from the render tree once its
     * active duration has passed. Defaults to YES. */

timingFunction

设置动画的速度变化

animation.timingFunction = CAMediaTimingFunction(name: .easeInEaseOut)

/** Timing function names. **/
    @available(iOS 2.0, *)
		// 匀速（默认）
    public static let linear: CAMediaTimingFunctionName

    // 动画开始时会较慢，之后动画会加速。
    @available(iOS 2.0, *)
    public static let easeIn: CAMediaTimingFunctionName

    // 动画在开始时会较快，之后动画速度减慢
    @available(iOS 2.0, *)
    public static let easeOut: CAMediaTimingFunctionName

    // 动画在开始和结束时速度较慢，中间时间段内速度较快
    @available(iOS 2.0, *)
    public static let easeInEaseOut: CAMediaTimingFunctionName

    // easeInEaseOut效果一致，加速和减速的过程都稍微有些慢
    @available(iOS 3.0, *)
    public static let `default`: CAMediaTimingFunctionName

autoreverses

折返

animation.autoreverses = true

duration

时长，数字越低动画越快

animation.duration = 20

repeatCount

动画重复的次数，如果动画执行不结束就不会触发isRemovedOnCompletion

animation.repeatCount = MAXFLOAT

fromValue

起始值，只适用于keyPath为position的动画

animation.fromValue = CGPoint(x: 10, y: 150)

toValue

改变属性的结束时的值只适用于keyPath为position的动画

animation.toValue = view.center

view上添加动画

redView.layer.add(animation, forKey: "translate")
        //此处再设置延迟时间，因为之前存在layer上的animation为copy的，所以无效
        animation.beginTime = CACurrentMediaTime() + 1

属性	说明
duration	动画时长
repeatCount	重复的次数，不停重复设置为 HUGE_VALF
repeatDuration	设置动画的时间。在该时间内动画一直执行，不计次数。
beginTime	指定动画开始的时间。从开始延迟几秒的话，设置为`CACurrentMediaTime() + 秒数` 的方式
timingFunction	设置动画的速度变化
autoreverses	动画结束时是否执行逆动画
fromValue	所改变属性的起始值
toValue	所改变属性的结束时的值
byValue	所改变属性相同起始值的改变量
byValue	所改变属性相同起始值的改变量

CAKeyframeAnimation

关键帧动画，这个类可以实现某一属性按照一串的数值进行动画，就像是一帧一帧的制作出来一样。

一般用作位移动画

let animation = CAKeyframeAnimation(keyPath: "position")

values

是许多值组成的数组用来进行动画的。这个属性比较特别，只有在path属性值为nil的时候才有作用

// 提供一组关键帧位置，使得动画view的中心依次落在这些关键点上，形成动画
        let animation = CAKeyframeAnimation(keyPath: "position")
        let value1 = CGPoint(x: 100, y: 100)
        let value2 = CGPoint(x: 200, y: 100)
        let value3 = CGPoint(x: 200, y: 200)
        let value4 = CGPoint(x: 100, y: 200)
        let value5 = CGPoint(x: 100, y: 300)
        let value6 = CGPoint(x: 200, y: 400)
        animation.values = [value1, value2, value3, value4, value5, value6]

path

path:路径,可以指定一个路径,让动画沿着这个指定的路径执行。

路径使用组合路径CGMutablePath，单个路径 CGPath。

let paths = CGMutablePath()
        paths.addArc(center: self.view.center, radius: 100, startAngle: 0, endAngle: .pi * 2, clockwise: true)
//        paths.move(to: CGPoint(x: 100, y: 100))
        paths.addLine(to: CGPoint(x: 100, y: 400))
        
        let animation = CAKeyframeAnimation(keyPath: "position")
        let boundingRect = CGRect(x: centerX - radius, y: centerY - radius, width: radius * 2, height: radius * 2)
        let path = CGPath(ellipseIn: boundingRect, transform: nil)

calculationMode

进行的动画.当在平面座标系中有多个离散的点的时候,可以是离散的,也可以直线相连后进行插值计算,也可以使用圆滑的曲线将他们相连后进行插值计算。

linear: kCAAnimationLinear calculationMode的默认值,表示当关键帧为座标点的时候,关键帧之间直接直线相连进行插值计算

discrete: kCAAnimationDiscrete 离散的,就是不进行插值计算,所有关键帧直接逐个进行显示

paced: kCAAnimationPaced 使得动画均匀进行,而不是按keyTimes设置的或者按关键帧平分时间,此时keyTimes和timingFunctions无效
cubic: kCAAnimationCubic 对关键帧为座标点的关键帧进行圆滑曲线相连后插值计算,对于曲线的形状还可以通过tensionValues,continuityValues,biasValues来进行调整自定义,这里的主要目的是使得运行的轨迹变得圆滑

cubicPaced:kCAAnimationCubicPaced 看这个名字就知道和kCAAnimationCubic有一定联系,其实就是在kCAAnimationCubic的基础上使得动画运行变得均匀,就是系统时间内运动的距离相同,此时keyTimes以及timingFunctions也是无效的。

animation.calculationMode = .paced

keyTimes

定义了应用在每一关键帧的时间点。所有中间值的定时由定时函数控制，定时函数允许你对各个部分应用缓入或缓出曲线定时。如果你不指定任何定时函数，动画将会是线性的

rotationMode

样式是否跟着路径旋转

animation.rotationMode = .rotateAuto

timingFunctions

样式的滑动加速减速

animation.timingFunctions = [CAMediaTimingFunction(name: .easeIn)]

delegate CAAnimationDelegate

开始回调

func animationDidStart(_ anim: CAAnimation)

结束回调

func animationDidStop(_ anim: CAAnimation, finished flag: Bool)

CATranslation 转场动画

事务管理类。

CATranslation类是用来包含一系列属性动画集合的机制，任何用指定事务去改变可动画属性都不会立即发生变化，而是当事务提交的时候开始用一个动画过渡到新值。CATranslation类没有属性货值实例方法，也不能用+alloc 和 -init方法创建，但是可以使用+begin和+commit方法分别入栈和出栈，这类似于UIView的+beginAniamtions:context:和commitAnimations方法。

type

转场类型

用字符串表示
pageCurl 向上翻一页
pageUnCurl 向下翻一页
rippleEffect 滴水效果
suckEffect 收缩效果，如一块布被抽走
cube 立方体效果
oglFlip 上下翻转效果

cameralrisHollowOpen 镜头开

cameralrisHollowClose 镜头关

点语法有的

push 推出

moveIn 拉入

fade 渐变弹出

reveal 移出

transition.type = .init(rawValue: "oglFlip")

subtype

转场方向

类型 CATransitionSubtype
.fromRight .fromBottom ....

CATransaction可以对多个layer的属性同时进行修改，同时负责批量的把多个图层树的修改作为一个原子更新到渲染树。

CATransaction.begin()
        CATransaction.setAnimationDuration(2)
        CATransaction.setCompletionBlock {
            CATransaction.setAnimationDuration(1)
            self.layer.frame = CGRect(x: 50, y: 100, width: 100, height: 100)
        }
        layer.backgroundColor = UIColor.yellow.cgColor
        
        CATransaction.begin()
        layer.cornerRadius = 20
        CATransaction.commit()
        
        CATransaction.commit()

源码 CATransaction

 // 当前线程创建一个新的事物(Transaction)，可嵌套
 open class func begin()

 // 提交当前事物中的所有改动，如果事物不存在将会出现异常
 open class func commit()

 // 提交任意的隐式动画，将被延迟一直到嵌套的显示事物被完成
 open class func flush()

 // 获取动画时间，默认0.25秒
 open class func animationDuration() -> CFTimeInterval
 // 设置动画时间
 open class func setAnimationDuration(_ dur: CFTimeInterval)

 // 默认nil，设置和获取CAMediaTimingFunction（速度控制函数）
 open class func animationTimingFunction() -> CAMediaTimingFunction?
 open class func setAnimationTimingFunction(_ function: CAMediaTimingFunction?)

 // 每一个线程事物属性都有存取器，即设置和获取方法，默认为false，允许隐式动画
 open class func disableActions() -> Bool
 open class func setDisableActions(_ flag: Bool)

 // 动画完成之后被调用
 open class func completionBlock() -> (() -> Void)?
 open class func setCompletionBlock(_ block: (() -> Void)?)

 // 两个方法用于动画事物的加锁与解锁 在多线程动画中，保证修改属性的安全
 open class func lock()
 open class func unlock()

 open class func value(forKey key: String) -> Any?
 open class func setValue(_ anObject: Any?, forKey key: String)

// 设置动画持续时间
public let kCATransactionAnimationDuration: String

// 设置停用animation类动画
public let kCATransactionDisableActions: String

// 设置动画时序效果
public let kCATransactionAnimationTimingFunction: String

// 设置动画完成后的回调
public let kCATransactionCompletionBlock: String

CAAnimationGroup

动画组

隐式动画

直接设定UI元素的一些可见属性的目标值，如frame、bounds、center、transform(平移、旋转、缩放)alpha、backgroundColor、contentStretch(拉伸）等。

它们没有设置任何的动画，仅仅是改变了一个CALayer的一个属性的值，由CoreAnimation来决定如何执行动画。
实际上动画执行的时间取决于当前事务的设置，动画类型取决于图层行为。

隐式动画是指当更改视图的非根图层的可动画属性时，CoreAnimation自动决定如何并且去做动画。动画的执行时间取决于当前事务（CATransaction），而动画类型取决于图层行为。

Core Animation在每个run loop周期中自动开始一次新的事务（run loop是iOS负责收集用户输入，处理定时器或者网络事件并且重新绘制屏幕的东西），即使你不显式的用CATransaction.begin()开始一次事务，任何在一次run loop循环中属性的改变都会被集中起来，然后做一次0.25秒的动画。

ViewController 动画

1）fromView 和toView，在很多 API 中常常会有fromView 和toView，fromView 表示当前视图，即跳转前的视图，而toView 代表跳转后的视图 (或称为跳转的目标视图)。
2） presented ViewController 和 presenting ViewController，这也是一组相对的概念。presentedViewController 表示被 modal 出的视图控制器（或称为跳转的目标视图控制器），而presenting ViewController 代表源视图控制器。
3） UTViewController TransitioningDelegate 协议用于为跳转动画提供实现了 UIViewControllerAnimatedTransitioning 协议的对象。

4） UIViewControllerAnimatedTransitioning 协议主要用于控制动画的展示时间和动画展示逻辑。

5）UTViewControllerinteractive Transitioning 协议即交互式转场动画代理，这个协议主要用于交互式动画。

6）UIViewControllerContextTransitioning 协议即转场动画上下文协议，它的作用在于为动画提供必备的信息。开发者不应该缓存任何关于动画的信息，而是应该从转场动画上下文中获取，这样可以保证总是获取到最新的、正确的信息。

要实现整个转场动画逻辑需要两组必需的元素，其一是代表页面跳转关系的两个控制器对象，其二是动画执行逻辑。以下是实现动画的步骤：
1）为源控制器和目标控制器分别设置一个遵守 UIViewControllerAnimatedTransitioning 协议的代理对象。当然也可以设置为同一个对象。
2）调用对应的跳转方法。此时系统会自动请求动画代理提供动面逻辑对象。