iOS-CALayer的anchorPoint锚点细解

CALayer有个非常重要的属性,锚点,对于CALayer的隐式动画,其anchorPoint起着至关重要的作用

/* Defines the anchor point of the layer's bounds rect, as a point in
 * normalized layer coordinates - '(0, 0)' is the bottom left corner of
 * the bounds rect, '(1, 1)' is the top right corner. Defaults to
 * '(0.5, 0.5)', i.e. the center of the bounds rect. Animatable. */

@property CGPoint anchorPoint;

根据官方解释,anchorPoint左下角为(0,0),右上角为(1,1),默认值为(0.5, 0.5),但其实现实不是这样的,现实中左上角为(0,0),右下角为(1,1),如图所示:

这里写图片描述


下面结合UIView动画来解析 anchorPoint 对动画的影响

UIView的隐藏:(这里添加了弹簧效果)

[UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.8 initialSpringVelocity:0 options:UIViewAnimationOptionCurveEaseIn animations:^{
            self.animationView.transform = CGAffineTransformMakeScale(1, 0.0001);
        } completion:nil];

UIView的显示:

[UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.5 initialSpringVelocity:1 options:UIViewAnimationOptionCurveEaseIn animations:^{
            self.animationView.transform = CGAffineTransformIdentity;
        } completion:nil];
1、CALayer的anchorPoint的默认位置为(0.5,0.5),即其bounds的center
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(0.5,0.5);

这里写图片描述


2、设置anchorPoint的默认位置为(0,0)
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(0,0);

这里写图片描述


3、设置anchorPoint的默认位置为(0.5,0)
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(0.5,0);

这里写图片描述


4、设置anchorPoint的默认位置为(1.0,1.0)
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(1.0,1.0);

这里写图片描述


5、设置anchorPoint的默认位置为(0,0.5)
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(0,0.5);

这里写图片描述


6、设置anchorPoint的默认位置为(1,0.5)
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(1,0.5);

这里写图片描述


7、设置anchorPoint的默认位置为(0,1.0)
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(0,1.0);

这里写图片描述


8、设置anchorPoint的默认位置为(1.0,1.0)
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(1.0,1.0);

这里写图片描述

9、设置anchorPoint的X值为0~1,Y值为0,再设置transform的X轴的缩放比例为0.0001(稍微比0大一点,不然动画效果无效) (CGAffineTransformMakeScale(1, 0.0001)
// 设置锚点
    animationView.layer.anchorPoint = CGPointMake(0,0);
·
·
·
[UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.8 initialSpringVelocity:0 options:UIViewAnimationOptionCurveEaseIn animations:^{
            self.animationView.transform = CGAffineTransformMakeScale(1, 0.0001);
        } completion:nil];

效果如下:
这里写图片描述

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值