UIView animateWithDuration 不会对cornerRadius变化进行动画处理

Question

我正在尝试对 UIView 实例 layer 的 cornerRadius 的变化进行动画处理，但是 cornerRadius 的变化> 立即发生。

这是代码：

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(10, 10, 100, 100)];
view.layer.masksToBounds = YES;
view.layer.cornerRadius = 10.0;
[UIView animateWithDuration:1.0 animations:^{
    
    [view.layer.cornerRadius = 0.0;
    
}];

感谢所有给我任何提示的人。

EDIT:

我设法使用 Core Animation 使用 CABasicAnimation 为该属性设置动画。

CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"cornerRadius"];
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
animation.fromValue = [NSNumber numberWithFloat:10.0f];
animation.toValue = [NSNumber numberWithFloat:0.0f];
animation.duration = 1.0;
[viewToAnimate.layer addAnimation:animation forKey:@"cornerRadius"];
[animation.layer setCornerRadius:0.0];

Answer 1

tl;dr: 圆角半径在 animateWithDuration:animations: 中不可设置动画。

---

文档中有关视图动画的内容。

正如动画部分 “查看 iOS 编程指南”说

UIKit 和 Core Animation 都提供对动画的支持，但每种技术提供的支持级别有所不同。在 UIKit 中，动画是使用 UIView 对象执行的

进行动画处理的完整属性列表

[UIView beginAnimations:context:];
[UIView setAnimationDuration:];
// Change properties here...
[UIView commitAnimations];

您可以使用较旧或较新

[UIView animateWithDuration:animations:];

（您正在使用的）

• ：帧
• 边界
• 中心
• 变换（CGAffineTransform，而不是 CATransform3D） )
• alpha
• backgroundColor
• contentStretch

如您所见，cornerRadius 不在列表中。

一些令人困惑的

UIView 动画实际上仅用于动画视图属性。令人困惑的是，您还可以在 UIView 动画块内的图层上对相同的属性进行动画处理，即框架、边界、位置、不透明度、背景颜色。因此，人们在 animateWithDuration 中看到图层动画，并相信他们可以为其中的任何视图属性设置动画。

同一部分接着说：

当你想要执行更复杂的动画，或者UIView类不支持的动画时，你可以使用Core Animation和视图的底层来创建动画。由于视图和图层对象错综复杂地链接在一起，因此对视图图层的更改会影响视图本身。

往下几行，您可以阅读核心动画可动画属性列表，您可以在其中看到以下内容：

• 图层的边框（包括图层的边角是否圆角）

因此，要对 cornerRadius 进行动画处理，您需要使用核心动画，正如您在更新的问题（和答案）中所说的那样）。我刚刚补充说试图解释为什么会这样。

---

一些额外的说明

当人们阅读说明 animateWithDuration 是推荐的动画方式的文档时，很容易相信它正在尝试替换 CABasicAnimation、CAAnimationGroup、CAKeyframeAnimation 等，但事实并非如此。它取代了您在上面看到的 beginAnimations:context: 和 commitAnimations。

Answer 2

我使用此扩展来动画改变角半径：

extension UIView
{
    func animateCornerRadius(from: CGFloat, to: CGFloat, duration: CFTimeInterval)
    {
        CATransaction.begin()
        let animation = CABasicAnimation(keyPath: "cornerRadius")
        animation.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.linear)
        animation.fromValue = from
        animation.toValue = to
        animation.duration = duration
        CATransaction.setCompletionBlock { [weak self] in
            self?.layer.cornerRadius = to
        }
        layer.add(animation, forKey: "cornerRadius")
        CATransaction.commit()
    }
}

Answer 3

角半径变化可以设置动画，但唯一的方法是使用 CABasicAnimation。希望这对那里的人有帮助。

Answer 4

从 iOS 10 开始，您实际上可以为cornerRadius设置动画：

UIViewPropertyAnimator(duration: 3.0, curve: .easeIn) {
    square.layer.cornerRadius = 20
}.startAnimation()

Answer 5

您可以如下实现 UIView 动画： http://maniacdev.com/2013/02/ios-uiview-category-allowing-you-to-set-up-customized-animation-properties

CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"cornerRadius"];
animation.duration = DURATION;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
animation.toValue = @(NEW_CORNER_RADIUS);
animation.fillMode = kCAFillModeForwards;
animation.removedOnCompletion = NO;
[view.layer addAnimation:animation forKey:@"setCornerRadius:"];

Answer 6

看起来这不是可动画的属性之一。

请参阅此处查看完整列表：

http:// /developer.apple.com/library/ios/#documentation/WindowsViews/Conceptual/ViewPG_iPhoneOS/AnimatingViews/AnimatingViews.html

Answer 7

您可以通过在视图类中实现 -[actionForLayer:forKey] 来使此属性在 +[UIView animateWithDuration:] 中可设置动画。有关如何操作的示例，请参阅此问题。

Answer 8

CornerRadius属性是可动画的

工作代码如下

//图层初始化

let imageLayer = CALayer() 
imageLayer.frame = CGRect(x: 0, y: 0.0, width: tenPercent, height: tenPercent)
imageLayer.contents = imageNew.cgImage
imageLayer.masksToBounds = true

//动画初始化

let animationCornerRadius = CABasicAnimation(keyPath: "cornerRadius")
animationCornerRadius.beginTime =  0.01
animationCornerRadius.duration = CFTimeInterval(5)
animationCornerRadius.fromValue = 1
animationCornerRadius.toValue = tenPercent / 2
animationCornerRadius.fillMode = .forwards
animationCornerRadius.isRemovedOnCompletion = false
imageLayer.add(animationCornerRadius , forKey: "cornerRadius")