iOS CALayer中position和anchorPoint关系正确解读

前言

第一:本文揭示了决定CALayer 大小和位置的其实是它的属性bounds和position;CALayer的frame属性,实际上是从bounds和position属性中的值派生的,并且使用频率较低。也即frame的origin是通过position得到的,frame的size是通过bounds的size得到的。
第二:anchorPoint和position根本不是一个点。并不是网上说的那样position是layer中的anchorPoint点在superLayer中的位置坐标。

CALayer的坐标系类型

CALayer有两种坐标系类型:"基于点的坐标系""基于单位的坐标系";使用哪种坐标系取决于所传达的信息类型。
ⅰ、指定直接映射到屏幕坐标的值或必须相对于另一个图层指定的值时使用基于点的坐标,例如图层的position属性。基于点的坐标系相关的属性:bounds、position、frame
ⅱ、当值不应与屏幕坐标相关联时使用单位坐标,因为它与某个其他值相关。例如,图层的anchorPoint属性指定相对于图层本身边界的点,该点可以更改。基于单位的坐标系相关的属性:anchorPoint.

先介绍下这四个属性:

@property  frame  当前layer相当于 superLayer的坐标系,frame.origin是相对于superLayer左上角的位置,frame.size就是当前layer的大小。这个和UIView的frame是类似的。

@property  bounds  当前layer相对于自身的坐标系,bounds.size 和 frame.size是一样的。bounds.origin是相对于自身的左上角的位置。因此bounds.origin = (0,0);

@property  position  是当前layer上的一个点,相对于superLayer左上角的位置。这个position和frame.origin有何区别呢?下面会讲到。

@property  anchorPoint  该值是相对bounds.size的比例值来确定的. 例如(0,0), (1,1)分别表示左上角、右下角,依此类推.锚点都是对于自身来讲的. 确定自身的锚点,通常用于做相对的tranform变换.当然也可以用来确定位置.

四者之间的关系:

frame 和 bounds 之间的关系很简单, frame.origin = CGMakePoint(0,0)就是bounds。

CALayer中决定Layer大小和在superLayer中位置的是bounds 和 position尽管Layer具有frame属性,但该属性实际上是从bounds和position属性中的值派生的,并且使用频率较低。

anchorPoint、position、frame之间的相对关系.

Ⅰ、当确定锚点时,改变frame时, position的值为:
position.x= frame.origin.x+ anchorPoint.x* bounds.size.width;
position.y= frame.origin.y+ anchorPoint.y* bounds.size.height;

Ⅱ、当确定锚点时,改变position时, frame的值为:
frame.origin.x= position.x- anchorPoint.x* bounds.size.width; 
frame.origin.y= position.y- anchorPoint.y* bounds.size.height;

Ⅲ、改变锚点, frame的值变化为:
frame.origin.x= - anchorPoint.x* bounds.size.width+ position.x; 
frame.origin.y= - anchorPoint.y* bounds.size.height+ position.y;

影响关系

第一条关系说明:锚点不变时,frame改变,position会随着变化
第二条关系说明:锚点不变时,position变化,frame会随着变化
第三条关系说明:锚点改变, position不影响,frame会随着变化

为什么第三条关系中的锚点改变了,变化的是frame,而不是 position呢?因为position是真正相对于superLayer的位置。而frame.origin只是通过anchorPoint关系被动推到出来的,当改变anchorPoint的值时,改变的是frame的origin就可以看出position是实际位置的控制点,当锚点变化时,position的值是固定不变的。动态变化的是frame的origin。

网上一大堆说position是layer中的anchorPoint点在superLayer中的位置坐标(即同一个点,在不同坐标系的表现), 那为什么anchorPoint改变了,变得不是position的值,而是frame的,是不是很疑惑。真相只有一个position和anchorPoint根本就不是一个点, 因为它俩改变哪一个值,另一个值都不会改变的。Ⅱ和Ⅲ的关系中分别改变position的值和anchorPoint的值,被动改变者都是frame。position没有因为anchorPoint的改变而改变。anchorPoint也没有因为position的改变而改变。

代码验证:

anchorPoint不变,改变frame 时,position的值改变了

关系变化图一

anchorPoint不变,改变position 时,frame的值改变了

关系变化图二

anchorPoint变化时,position不变,frame改变了。

关系变化图三

总结:

当你在做Core Animation时,牵涉到rotation、scale、translation、position、frame改变时,就会用到anchorPoint或者position。正确的理解anchorPoint、position、frame的关系,你才能制作出炫酷美妙的动画。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,214评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,307评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,543评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,221评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,224评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,007评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,313评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,956评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,441评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,925评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,018评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,685评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,234评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,240评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,464评论 1 261
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,467评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,762评论 2 345

推荐阅读更多精彩内容