ios开发 方形到圆的动画_在iOS中绘制圆形笔划的圆形动画

我正在尝试为在iOS 7中绘制的圆圈制作动画 – 这非常简单.

我的问题是我需要笔画有圆角.我现在尝试这样做的方法是在动画的开始位置添加另一个圆圈.

然后,对于正在移动的结束,我需要另一个循环来跟随.它正在做我想要的,但我需要它使用easeInOutQuart时间,这比我想象的更难.

到目前为止的结果是：

我的代码看起来像这样：

- (void) drawCircleAnimated {

int radius = 100;

CALayer *animationLayer = [CALayer layer];

animationLayer.frame = CGRectMake(20.0f, 64.0f, CGRectGetWidth(self.view.layer.bounds) - 40.0f, CGRectGetHeight(self.view.layer.bounds) - 84.0f);

[self.view.layer addSublayer:animationLayer];

CGRect pathRect = CGRectInset(animationLayer.bounds, 100.0f, 100.0f);

UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 2.0*radius, 2.0*radius) cornerRadius:radius];

CAShapeLayer *pathLayer = [CAShapeLayer layer];

pathLayer.frame = animationLayer.bounds;

pathLayer.bounds = pathRect;

pathLayer.geometryFlipped = NO;

pathLayer.path = path.CGPath;

pathLayer.strokeColor = [[UIColor blackColor] CGColor];

pathLayer.fillColor = nil;

pathLayer.lineWidth = 10.0f;

pathLayer.lineJoin = kCALineJoinBevel;

[animationLayer addSublayer:pathLayer];

[self addStartPointCircle];

CAShapeLayer* circleToMove = [self addStartPointCircle];

circleToMove.anchorPoint = CGPointZero;

[pathLayer addSublayer:circleToMove];

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

pathAnimation.duration = 5.0;

pathAnimation.fromValue = [NSNumber numberWithFloat:0.0f];

pathAnimation.toValue = [NSNumber numberWithFloat:1.0f];

[pathLayer addAnimation:pathAnimation forKey:@"strokeEnd"];

CAKeyframeAnimation *penAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];

penAnimation.duration = 5.0;

penAnimation.path = pathLayer.path;

penAnimation.calculationMode = kCAAnimationPaced;

penAnimation.delegate = self;

penAnimation.removedOnCompletion = NO;

[circleToMove addAnimation:penAnimation forKey:@"position"];

}

为了实现缓动功能,我已将其添加到penAnimation中 – 但它不会改变任何东西.我的客人会一直关注其他动画吗？

penAnimation.values = [NSArray arrayWithObjects: // i.e., Rotation values for the 3 keyframes, in RADIANS

[NSNumber numberWithFloat:0.0 * M_PI],

[NSNumber numberWithFloat:0.75 * M_PI],

[NSNumber numberWithFloat:1.5 * M_PI], nil];

penAnimation.keyTimes = [NSArray arrayWithObjects: // Relative timing values for the 3 keyframes

[NSNumber numberWithFloat:0],

[NSNumber numberWithFloat:.5],

[NSNumber numberWithFloat:1.0], nil];

penAnimation.timingFunctions = [NSArray arrayWithObjects:

[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn], // from keyframe 1 to keyframe 2

[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut], nil]; // from keyframe 2 to keyframe 3