Swift3.1动画(二)

2018-05-22 17:37:58 浏览数 (1)

前言：

上一篇Swift3.1动画(一)讲了常见的动画效果，这篇继续深入了解动画的其他属性

一、了解<code>frame</code>、<code>bounds</code>、<code>center</code>

1、<code>frame</code>：描述当前视图在其父视图中的位置和大小 2、<code>bounds</code>：描述当前视图在其自身坐标系统中的位置和大小。 公式：其x和y永远=0，width和height为其本来的宽高 3、<code>center</code>：描述当前视图的中心点在其父视图中的位置。 公式：center.x=(其在父容器的x 其width/2) ，center.y=(其在父容器的y 其height/2)

frame/bounds/center

yellowView

//frame 在其父视图中的位置和大小，{x,y}={35, 74} {width,heigh}={305, 274}}

代码语言：javascript复制
let  yellowViewRect = NSStringFromCGRect(self.yellowView.frame)//{{35, 74}, {305, 274}}```
//center  center.x=(其在父容器的x 其width/2),所以center.x=35 305/2=187.5

let yellowViewCenter = NSStringFromCGPoint(self.yellowView.center)//{187.5, 211}`

//bounds 在其自身坐标系统中的位置和大小

代码语言：javascript复制
let  yellowViewBounds = NSStringFromCGRect(self.yellowView.bounds)//{{0, 0}, {305, 274}}```

#####blueView


//frame <code>blueView</code>的父容器为yellowView，所以其{x,y}={0, 0}

let blueViewRect = NSStringFromCGRect(self.blueView.frame){{0, 0}, {75, 65}}`

//center center.x=(其在父容器的x 其width/2),所以center.x=0 75/2=37.5

代码语言：javascript复制
let  blueViewCenter = NSStringFromCGPoint(self.blueView.center)//{37.5, 32.5}```

#####redView
//frame <code>redView</code>的父容器为yellowView,所以其{x,y}={75, 65}
<pre>let  redViewRect = NSStringFromCGRect(self.redView.frame)//{{75, 65}, {160, 147}}</pre>
//center center.x=75 160/2=155
<pre>let  redViewCenter = NSStringFromCGPoint(self.redView.center)//{155, 138.5}</pre>


因为bounds数值不会根据父容器的位置改变而改变，所以不多说，有疑问欢迎留言

##bounds.size.width、frames.size.width的区别：
>bounds.size.width -= 80.0  
frame.size.width -= 80.0
上面两个是否有区别呢？我下面上图：

![before.png](http://upload-images.jianshu.io/upload_images/1396454-ef33193bbf53097d.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)
刚开始大家的位置宽高都是一样的，即blueView和yellowView的CGRect相同
然后
1、<code>blueView.frame.size.width -= 80.0</code>
2、<code>yellowView.bounds.size.width -= 80.0</code>
得到

![after.png](http://upload-images.jianshu.io/upload_images/1396454-f957155eff6898dc.png?imageMogr2/auto-orient/strip|imageView2/2/w/1240)
可以看出，<code>blueView</code>和<code>yellowView</code>宽高虽然相等，但是<code>blueView</code>中心线发生了偏移,右边<code>-80</code>，而<code>yellowView</code>的中心线保持不变，左右两边同时<code>-40.0</code>
swift

0 人点赞