首页 > 学院 > 开发设计 > 正文

椭圆线条绘制动画

2019-11-09 16:53:47
字体:
来源:转载
供稿:网友

github:https://github.com/potato512/SYAnimation

使用贝赛尔曲线UIBezierPath、阴影对象CAShapeLayer、基础类动画CABasicAnimation实现。

效果图如下:

示例代码:

- (void)lineAnimation{    UIView *view = [[UIView alloc] initWithFrame:CGRectMake(10.0, 340.0, (self.view.frame.size.width - 10.0 * 2), 100.0)];    [self.view addSubview:view];    view.backgroundColor = [UIColor colorWithWhite:0.5 alpha:0.2];    UIBezierPath *bezierPath = [UIBezierPath bezierPathWithOvalInRect:view.bounds];     CAShapeLayer *shapeLayer = [[CAShapeLayer alloc] init];    shapeLayer.strokeColor = [UIColor purpleColor].CGColor;    shapeLayer.fillColor = [UIColor clearColor].CGColor;    shapeLayer.lineWidth = 2;    shapeLayer.lineJoin = kCALineJoinRound;    shapeLayer.lineCap = kCALineCaPRound;    shapeLayer.path = bezierPath.CGPath;    [view.layer addSublayer:shapeLayer];        CABasicAnimation *pathAnim = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];    pathAnim.duration = 5.0;    pathAnim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaSEOut];    pathAnim.fromValue = @(0);    pathAnim.toValue = @(1);    pathAnim.autoreverses = true;    pathAnim.fillMode = kCAFillModeForwards;    pathAnim.removedOnCompletion = NO;    pathAnim.repeatCount = MAXFLOAT;    [shapeLayer addAnimation:pathAnim forKey:@"strokeEndAnim"];}


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表