使用Animations动画改变View的cornerRadius半径

司宏伯
2023-12-01

hello!大家好,今天想做一个动画效果,就是把一个矩形UIImage(or UIView)通过动画变成圆形。

开始是想这么写的,

    [UIView animateWithDuration:1.0f animations:^{
        //        NSLog(@"%f",x);
        _logo.layer.cornerRadius = _logo.frame.size.height/2;
        
    }];
结果妥妥的失败,虽然变成了原形,但是却没有执行任何动画。

ok,查一下文档

可以参考这个文档地址,然后你会发现,在“Table 4-1  Animatable UIView properties”表格里,以上(代码)的创建方式,和旧的创建方式只支持表格里的属性改变。

旧的创建方式如下,▼

[UIView beginAnimations:context:];
[UIView setAnimationDuration:];
// Change properties here...
[UIView commitAnimations];
支持的动画的properties表格如下,▼

Property

Changes you can make

frame

Modify this property to change the view’s size and position relative to its superview’s coordinate system. (If the transformproperty does not contain the identity transform, modify the bounds or center properties instead.)

bounds

Modify this property to change the view’s size.

center

Modify this property to change the view’s position relative to its superview’s coordinate system.

transform

Modify this property to scale, rotate, or translate the view relative to its center point. Transformations using this property are always performed in 2D space. (To perform 3D transformations, you must animate the view’s layer object using Core Animation.)

alpha

Modify this property to gradually change the transparency of the view.

backgroundColor

Modify this property to change the view’s background color.

contentStretch

Modify this property to change the way the view’s contents are stretched to fill the available space

在表格下面,有一段话,

In places where you want to perform more sophisticated animations, or animations not supported by the UIView class, you can use Core Animation and the view’s underlying layer to create the animation. Because view and layer objects are intricately linked together, changes to a view’s layer affect the view itself. Using Core Animation, you can animate the following types of changes for your view’s layer:

  • The size and position of the layer

  • The center point used when performing transformations

  • Transformations to the layer or its sublayers in 3D space

  • The addition or removal of a layer from the layer hierarchy

  • The layer’s Z-order relative to other sibling layers

  • The layer’s shadow

  • The layer’s border (including whether the layer’s corners are rounded)

  • The portion of the layer that stretches during resizing operations

  • The layer’s opacity

  • The clipping behavior for sublayers that lie outside the layer’s bounds

  • The current contents of the layer

  • The rasterization behavior of the layer

粗略的翻译一下,就是

在你想进行更复杂的动画,或UIView类不支持动画,你可以使用Core Animation和视图的基础层创建动画。因为视图和层对象是错综复杂的联系在一起,对一个视图层的影响视图本身的变化。使用Core Animation,您可以为您的视图层设置以下类型的更改:
层的大小和位置
执行转换时所使用的中心点
转换层或
在三维空间中的子层
层从层的层中的添加或移除
图层的顺序相对于其他同级层
图层的阴影
该层的边界(包括该层的角是否是圆形的
该部分的层延伸在调整操作
层的不透明度
裁剪行为层之外的边界层
层的当前内容
该层的光栅化行为

------------------------------

CABasicAnimation, CAAnimationGroup, CAKeyframeAnimation等就是依赖于Core Animation的动画,这里我使用CABasicAnimation来实现修改View的圆角,代码如下

<span style="font-size:10px;">CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"cornerRadius"];
animation.duration = 0.5f;
[_logo.layer setCornerRadius:_logo.frame.size.height/2];
[_logo.layer addAnimation:animation forKey:@"cornerRadius"];</span>
实现:)

Core Animation的运用不仅仅这么简单,大家可以自行了结~


 类似资料: