我正在尝试为在 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
最佳答案
这应该是您需要添加的全部内容。
pathLayer.lineCap = kCALineCapRound;
关于ios - 在 iOS 中用圆角描边绘制圆形动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21946484/