美文网首页贝塞尔曲线及各种动画
iOS利用贝塞尔曲线和CAShapeLayer创建横向带动画柱状

iOS利用贝塞尔曲线和CAShapeLayer创建横向带动画柱状

作者: JasonEVA | 来源:发表于2016-06-28 11:37 被阅读1084次
//创建出CAShapeLayer

self.shapeLayer= [CAShapeLayer layer];

//self.shapeLayer.frame = self.view.frame;//设置shapeLayer的尺寸和位置

self.shapeLayer.fillColor= [UIColor clearColor].CGColor;//填充颜色为ClearColor

//设置线条的宽度和颜色

self.shapeLayer.lineWidth=30.0f;

self.shapeLayer.strokeColor= [UIColor greenColor].CGColor;

//创建出贝塞尔曲线

UIBezierPath*circlePath = [UIBezierPath bezierPath];

[circlePath moveToPoint:CGPointMake(20,200)];

[circlePath addLineToPoint:CGPointMake(200,200)];

//让贝塞尔曲线与CAShapeLayer产生联系

self.shapeLayer.path= circlePath.CGPath;

//添加并显示

[self.view.layer addSublayer:self.shapeLayer];

// Do any additional setup after loading the view.

CABasicAnimation*pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];

pathAnimation.duration=1.0f;

pathAnimation.timingFunction= [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];

pathAnimation.fromValue=@0.0f;

pathAnimation.toValue=@(1);

[self.shapeLayer addAnimation:pathAnimation forKey:@"strokeEndAnimation"];

相关文章

网友评论

    本文标题:iOS利用贝塞尔曲线和CAShapeLayer创建横向带动画柱状

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