您的位置:首页 > 产品设计 > UI/UE

CAShapeLayer 与CABasicAnimation结合使用时strokeStart、strokeEnd 与fromValue、toValue的用法

2015-03-31 20:58 513 查看
因为本人在将CAShapeLayer和CABasicAnimation结合使用的时候,遇到了对属性的组合产生的效果弄不清的情况,特意对它们的用法进行了总结。

 1 keyPath = strokeStart  动画的fromValue = 0,toValue = 1
     strokeEnd默认为1,strokeStart从 0 到 1 ,strokeStart = 0 时有一条完整的路径,strokeStart
= 1 时 路径消失。效果就是一条从路径起点到终点慢慢的消失
     
     2 keyPath = strokeStart  动画的fromValue = 1,toValue = 0     
    strokeEnd默认为1,strokeStart从 1 到 0 ,strokeStart = 1 时无路径,strokeStart
= 0 时 画出一条完整的路径。效果就是一条从路径终点到起点慢慢的出现
     
     3 keyPath = strokeEnd  动画的fromValue = 0,toValue = 1
     strokeStart默认为0,strokeEnd从 0-1,strokeEnd=0 时,无路径,strokeEnd=1 时,一条完整路径。效果就是一条路径起点到终点慢慢的出现
     
     4 keyPath = strokeEnd  动画的fromValue = 1,toValue = 0
     效果就是一条路径从终点到起点慢慢消失

下面我写了一个简单地用法:
<span style="font-size:18px;">CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
animation.fromValue = @0;
animation.toValue = @1;
animation.duration = 0.5f;
[layer addAnimation:animation forKey:@"strokeEnd"];</span>
效果就是一条路径起点到终点在0.5s的时间内出现
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
相关文章推荐