CALayer - 5

前面介绍了一下anchorPoint 和 position ， 其实不禁在想，我们通常直接的setFrame不是指定好了位置了吗？

为什么还会有这另外两个的属性呢？

    UIView* vview = [UIView new];    [vview setFrame:CGRectMake(0, 0, 200, 100)];        [vview setBackgroundColor:[UIColor greenColor]];        [self.view addSubview:vview];        NSLog(@"vviewLayer's position : %@", NSStringFromCGPoint(vview.layer.position));    NSLog(@"vviewLayer's anchorPoint : %@", NSStringFromCGPoint(vview.layer.anchorPoint));

2016-01-01 21:12:42.585 iosfighterlb3[29184:301237] vviewLayer's position : {100, 50}

2016-01-01 21:12:42.585 iosfighterlb3[29184:301237] vviewLayer's anchorPoint : {0.5, 0.5}

输出如上，可以看到以anchorPoint 为 (0.5, 0.5) 的锚点得出在superLayer上的position是 { 100, 50 } ，这就是  原来尺寸Rect 的一半。

再试着一个，将尺寸改成：

    [vview setFrame:CGRectMake(50, 50, 200, 100)];

输出如下：

2016-01-01 21:18:08.531 iosfighterlb3[29499:304774] vviewLayer's position : {150, 100}

2016-01-01 21:18:08.531 iosfighterlb3[29499:304774] vviewLayer's anchorPoint : {0.5, 0.5}

在anchorPoint不变的前提下，输出是  { 150, 100 } 

即按照着这样的公式来计算：

150 = 200 * 0.5 + 50 ;        <==>  X = Layer.width * anchorPoint.x  +  Layer.origin.x;

100 = 100 * 0.5 + 50 ;        <==>  Y = Layer.height * anchorPoint.y + Layer.origin.y;

再试着两组不同的数据，在anchorPoint不变的前提下这个是非常好验证的，让我们想是不是就是上面的决定公式呢？

但是如果修改anchorPoint如下，情况就非常有趣了！

    UIView* vview = [UIView new];    [vview setFrame:CGRectMake(50, 50, 300, 100)];        [vview setBackgroundColor:[UIColor greenColor]];        vview.layer.anchorPoint = CGPointMake(1, 1);        [self.view addSubview:vview];        NSLog(@"vviewLayer's position : %@", NSStringFromCGPoint(vview.layer.position));    NSLog(@"vviewLayer's anchorPoint : %@", NSStringFromCGPoint(vview.layer.anchorPoint));

一看这个数据和效果真是坑爹了，怎么算都算不出这个结果啊！！！

position : 

X = Layer.width * anchorPoint.x  +  Layer.origin.x;  

Y = Layer.height * anchorPoint.y + Layer.origin.y;

应该是：300 * 1 + 50  = 350  啊！！！  100 * 1 + 50 = 150 啊！！！

嘻嘻，其实真正理解肯定不是这样惊奇的，让我们来细细解析吧！

首先将修改anchorPoint注释掉，我们得到理所当然的结果：

上面结果非常明确了吧，就是由setFrame来的 origin : { 50, 50 } ， 通过公式生成在anchorPoint（中心位置） 的position { 200, 100 }

这个时候如果我们修改了anchorPoint 为 { 0.5,  0.5 } ，来分析图形做了什么事情！

因为修改！所以anchorPoint变化了 { ^0.5,  ^0.5 }  （这里用^来表示增量）， 所以意味着要偏移 { 150, 50 } 个单位！相当好理解吧！就是原来在中心点现在跑去最右角落了，意味着上面这张图要先向上跑50个单位，再向左跑150个单位，看看现在的结果：

原来如此，bounds的size大小并没有改变： { 300,  100 }， 由于anchorPoint的改变使得需要偏移这么多的单位，这里留个伏笔～但是position为 { 200, 100 } ，所以便向左上方移动了 { 150, 50 } 的单位，使得anchorPoint的现在的位置（最右下角）等于position了，结果就是上图了。

我们把Frame输出：

这里的伏笔是为什么position是 { 200, 100 }！！！！在下一个文章会继续讲解！