前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Swift3.1动画(二)

Swift3.1动画(二)

作者头像
Dwyane
发布2018-05-22 17:37:58
7470
发布2018-05-22 17:37:58
举报
文章被收录于专栏:技术总结

前言:

上一篇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%7CimageView2/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%7CimageView2/2/w/1240)
可以看出,<code>blueView</code>和<code>yellowView</code>宽高虽然相等,但是<code>blueView</code>中心线发生了偏移,右边<code>-80</code>,而<code>yellowView</code>的中心线保持不变,左右两边同时<code>-40.0</code>
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2017.03.12 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、了解<code>frame</code>、<code>bounds</code>、<code>center</code>
    • yellowView
    相关产品与服务
    容器服务
    腾讯云容器服务(Tencent Kubernetes Engine, TKE)基于原生 kubernetes 提供以容器为核心的、高度可扩展的高性能容器管理服务,覆盖 Serverless、边缘计算、分布式云等多种业务部署场景,业内首创单个集群兼容多种计算节点的容器资源管理模式。同时产品作为云原生 Finops 领先布道者,主导开源项目Crane,全面助力客户实现资源优化、成本控制。
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档