CAShapeLayer 动画问题 iOS7
Issue with CAShapeLayer Animation iOS7
我一直在为 iOS7 的动画效果而苦苦挣扎(8、9 它工作正常)涉及将圆角矩形收缩成圆形。才能达到这样的效果。
但是当我尝试在 iOS7 上收缩圆圈时出现了一些失真。
我的视图控制器非常简单
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
CAShapeLayer *layer = [CAShapeLayer layer];
layer.fillColor = [UIColor blackColor].CGColor;
layer.frame = CGRectMake(100, 100, 100, 100);
layer.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 100, 50) cornerRadius:25].CGPath;
self.myLayer = layer;
[self.view.layer addSublayer:layer];
}
- (void)viewDidAppear:(BOOL)animated {
[super viewDidAppear:animated];
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"path"];
animation.values = @[
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 100, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(5, 0, 90, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(10, 0, 80, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(15, 0, 70, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 0, 60, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(25, 0, 50, 50) cornerRadius:25].CGPath,
];
animation.keyTimes = @[@(0),
@(0.18),
@(0.36),
@(0.54),
@(0.72),
@(1),
];
animation.duration = 10;
animation.fillMode = kCAFillModeForwards;
[self.myLayer addAnimation:animation forKey:nil];
self.myLayer.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(25, 0, 50, 50) cornerRadius:25].CGPath;
}
这似乎是 iOS 7 的错误。检查这个 link:
http://www.paintcodeapp.com/blogpost/code-for-ios-7-rounded-rectangles
post 底部有一个分类方法解决了这个问题。
我用你的代码测试了它,它似乎有效!我不得不做一个小改动,那就是替换
CGFloat limitedRadius = MIN(radius, limit);
与
CGFloat limitedRadius = radius;
这使得角半径变得足够大以创建一个圆。可能值得研究为什么角半径首先受到限制,但我会把它留给你:)
我一直在为 iOS7 的动画效果而苦苦挣扎(8、9 它工作正常)涉及将圆角矩形收缩成圆形。才能达到这样的效果。
但是当我尝试在 iOS7 上收缩圆圈时出现了一些失真。
我的视图控制器非常简单
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
CAShapeLayer *layer = [CAShapeLayer layer];
layer.fillColor = [UIColor blackColor].CGColor;
layer.frame = CGRectMake(100, 100, 100, 100);
layer.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 100, 50) cornerRadius:25].CGPath;
self.myLayer = layer;
[self.view.layer addSublayer:layer];
}
- (void)viewDidAppear:(BOOL)animated {
[super viewDidAppear:animated];
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"path"];
animation.values = @[
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 100, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(5, 0, 90, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(10, 0, 80, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(15, 0, 70, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 0, 60, 50) cornerRadius:25].CGPath,
(id)[UIBezierPath bezierPathWithRoundedRect:CGRectMake(25, 0, 50, 50) cornerRadius:25].CGPath,
];
animation.keyTimes = @[@(0),
@(0.18),
@(0.36),
@(0.54),
@(0.72),
@(1),
];
animation.duration = 10;
animation.fillMode = kCAFillModeForwards;
[self.myLayer addAnimation:animation forKey:nil];
self.myLayer.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(25, 0, 50, 50) cornerRadius:25].CGPath;
}
这似乎是 iOS 7 的错误。检查这个 link:
http://www.paintcodeapp.com/blogpost/code-for-ios-7-rounded-rectangles
post 底部有一个分类方法解决了这个问题。 我用你的代码测试了它,它似乎有效!我不得不做一个小改动,那就是替换
CGFloat limitedRadius = MIN(radius, limit);
与
CGFloat limitedRadius = radius;
这使得角半径变得足够大以创建一个圆。可能值得研究为什么角半径首先受到限制,但我会把它留给你:)