众所周知,ios坐标系统是这样的⬇️
重点介绍锚点anchorPoint。我们来看看官方文档的介绍:
看到这几个坐标了么,这就是锚点!取值范围是0-1。
The default value of this property is (0.5, 0.5), which represents the center of the layer’s bounds rectangle.
默认值是(0.5,0.5),在layer的中心。⬇️它的作用。
applying a rotation transform to a layer with the default anchor point causes the layer to rotate around its center. Changing the anchor point to a different location would cause the layer to rotate around that new point.
下面我们讲的变化就要用到这个东西~
先来认识下iOS和OSX的坐标系统
这个position是相对superLayer的坐标,定义了layer的位置坐标。写个demo验证一下吧
var rectlayer:CALayer = CALayer()
var positionPoint:CALayer = CALayer()
我先在sb里拉了一个UIView,把位置调到bounds坐标(0,0)处,大小40x40。
rectlayer.frame = CGRectMake(40, 40, 40, 40) rectlayer.backgroundColor = UIColor.redColor().CGColor self.view.layer.addSublayer(rectlayer)
let pPoint:CGPoint = rectlayer.position
positionPoint.frame = CGRectMake(pPoint.x, pPoint.y, 5, 5)
positionPoint.backgroundColor = UIColor.blackColor().CGColor
self.view.layer.addSublayer(positionPoint)
print("(rectlayer.position)")
print("(rectlayer.anchorPoint)")
运行起来看下
print出来的东西:
从运行结果来看,position就是红色块的中心。锚地默认值确实是(0.5,0.5)。修改下锚点,运行结果⬆️
rectlayer.anchorPoint = CGPointMake(0, 0)
对比两个结果,position的值不变,但是红色方块的位置显然发生了改变。
不难看出,锚点定义了position相对于红色块layer的位置!通俗来说,锚点定义的位置就是position在红色块中的位置!验证一下吧~
不难看出,锚点定义的位置是,以frame定义的rect的左上角为坐标原点,xy轴方向同iOS系统坐标方向,rect的长宽分别为单位长度,定义的。
再通过官方介绍⬇️求证下,完全正确!
锚点是layer旋转,缩放等动画效果的动画中心,下一篇是关于layer 3d动画的解析。