美文网首页
IOS缓动动画Easing算法使用分析

IOS缓动动画Easing算法使用分析

作者: smallLabel | 来源:发表于2015-11-03 21:34 被阅读737次

    对于一个区间内的缓动动画来说

    中间的过渡值算法,很多都在使用Easing这种,无论是ActionScript、JavaScript还是刚刚才研究的Objective-C

    具体思路如下

    首先是计算出这个区间内的各个阶段

    比如这个过程是分60帧的动画,那么在这60帧中的每一帧,计算出这一帧所得的值,放到一个数组里面,然后通过CAKeyframeAnimation来对这一组数值分别进行更换

    而这组数值就是通过Easing的各种不同算法算出来的

    具体代码如下

    Objective-c代码

    + (id)animationWithKeyPath:(NSString *)path function:(AHEasingFunction)function fromPoint:(CGPoint)fromPoint toPoint:(CGPoint)toPoint keyframeCount:(size_t)keyframeCount

    {

    NSMutableArray *values = [NSMutableArray arrayWithCapacity:keyframeCount];

    CGFloat t =0.0;

    CGFloat dt =1.0/ (keyframeCount -1);

    for(size_t frame =0; frame < keyframeCount; ++frame, t += dt)

    {

    CGFloat x = fromPoint.x + function(t) * (toPoint.x - fromPoint.x);

    CGFloat y = fromPoint.y + function(t) * (toPoint.y - fromPoint.y);

    [values addObject:[NSValue valueWithCGPoint:CGPointMake(x, y)]];

    }

    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:path];

    [animation setValues:values];

    return animation;

    }

    定义一个数组,用来存放每一帧的预期值

    定义一个时间t,其实是0.0

    定义一个每帧平分的比例,dt

    然后for循环,计算中间平分每一帧的预期值,如x

    预期值=起始值+Easing的变换方程带入(当前帧占总帧的百分比)*起始到预期之间的差距值

    这样每帧就会按照Easing不同方程的规律得出相应的变化值了

    关于animationWithKeyPath方法的参数,可以是如下

    transform.scale = 比例轉換

    transform.scale.x = 闊的比例轉換

    transform.scale.y = 高的比例轉換

    transform.rotation.z = 平面圖的旋轉

    opacity = 透明度

    margin

    zPosition

    backgroundColor

    cornerRadius

    borderWidth

    bounds

    contents

    contentsRect

    cornerRadius

    frame

    hidden

    mask

    masksToBounds

    opacity

    position

    shadowColor

    shadowOffset

    shadowOpacity

    shadowRadius

    当然,这些事CAKeyframeAnimation所支持的,还可以自己去写自定义的属性值

    相关文章

      网友评论

          本文标题:IOS缓动动画Easing算法使用分析

          本文链接:https://www.haomeiwen.com/subject/zdiqhttx.html