最近一直在学 iOS 开发,所以专门创建了这样一个类别,将自己学习中的一些问题整理,记录下来。由于自己是初学者,所以所写的文章非常基础,写这个类别一是为了给自己留下存 档,二是为了给和我有同样问题的初学者留下一些学习的线索,三是希望在整理这些文章的过程中可以看到自己一点点的进步。

今天整理的问题是关于在布局方面, UIView 中的 frame, bounds, center 三个属性相关。三个属性都是用来将 view 定位在它的 Superview 上的,而三个又存在着一定的区别。

简介

  • frame 属性是相对一个 UIView 的 Superview 的坐标来定位的,初始的默认值是位于 Superview 的左上角。以横向为 x,向右为正方向;以纵向为 y,向下为正方向;左上角为坐标原点。
  • bounds 是以一个 UIView 自己 的坐标来定位的,坐标的设置同 frame 相同。上面两个属性是一个 矩形 (CGRect) ,并且有 x,y 坐标,x,y 坐标用于确定矩形左上角那一点的位置,来确定这整个矩形的位置。
  • center 与上两者不同。 center 是一个 点(CGPoint) ,它代表着 View 中心的那一点,通过 x, y 的坐标值来确定整个 View 的位置。同 frame 一样, center 也是通过 Superview 的坐标系统来确定位置的。

下来借用一张 Stanford CS193p 课程 的图来直观地展示三者的关系。

UIView.frame 以及 UIView.bounds

下面是我自己用 Playground 写了两个 UIView 来详细解释。

首先创建了两个矩形的 UIView,

黑色的是 viewA, 红色的是 viewB, viewB 是 viewA 的 subview。

以上是代码。

UIView 在创建时使用了 CGRectMake 函数,四个参数分别是 x 坐标, y 坐标, 矩形的宽,矩形的高,并将坐标值赋给 UIView.frame 或者 UIView.bounds

创建 viewB 时将其 frame 的 x,y 值均设置为 200。前面讲过, frame 是相对于 Superview 的坐标系统来定位的。所以将红色的 viewB 放置在了图中的位置。

在代码的 18–26行可以分别清楚地看到两个 View 的 frame, bounds 的 x, y 值。 viewB 中 frame 的x,y 值是相对于 viewA 左上角的距离。但是 viewB.bounds 属性的 x,y 值为0,这就是因为 bounds 是以它自己的坐标系统为参照,由于 viewB 并没有发生旋转等操作,所以 bounds 的 x,y 值均为0。

假设此事创建了一个 viewC 作为 viewB 的 subview, 那么 viewC 的 Superview 也就是 viewB, 它的 frame 也就是以 viewB 为坐标参照物,而不是 viewA, viewB 则是又以 viewA 作为参照物的。曾经犯过这样的问题。说明一下。虽然本来就该这样。

UIView.center

UIView.center 其实没有什么好说的,学习到现在也很经常使用这个属性来定位。

这个属性代表了 UIView 中间的那一点,以这个点的位置来定位。类型是一个 CGPoint

这三个属性有这样的特征:

UIView.frame.origin = center - (bounds.size / 2.0) UIView.center = frame.origin + (bounds.size / 2.0) UIView.frame.size = bounds.size

大概讲了一些,写的时候发现叙述好真是困难。英语好的人可以看看这个链接,本文参考自这里。

http://stackoverflow.com/questions/5361369/uiview-frame-bounds-and-center

UIView 中 frame, bounds, center 属性的关系的更多相关文章

  1. 初见IOS的UI之:UI控件的属性frame bounds center 和transform

    这些属性,内部都是结构体:CGRect CGPoint CGFloat 背景知识:所有的控件都是view的子类,屏幕就是一个大的view:每个view都有个viewController,它是view的 ...

  2. iOS编程(双语版)-视图-Frame/Bounds/Center

    1. Frame 每个视图都有一个frame属性,它是CGRect结构,它描述了视图所在的矩形在其父视图中的位置. (屏幕坐标系默认的原点在左上角,x轴向右伸展,y轴向下伸展) 设置frame通常通过 ...

  3. frame,bounds,center分析

    采用CGPoint来表示坐标系X,Y位置,创建一个坐标的方式为:CGPoint point=CGPointMake(x,y) CGSize用来表示视图的宽度和高度,可以用CGSizeMake(widt ...

  4. js中Frame框架的属性获取(1)

    js中window和document对象及如何操作iframe 一. window对象 . 什么是window对象? Window对象表示浏览器打开的窗口.如果文档包含iframe或者是frame标签 ...

  5. iOS--------坐标系统(UIView的frame、bounds跟center属性)

    1.概要翻开ios官方开发文档,赫然发现上面对这三个属性的解释如下: frame:描述当前视图在其父视图中的位置和大小. bounds:描述当前视图在其自身坐标系统中的位置和大小. center:描述 ...

  6. 详解UIView的frame、bounds和center属性

    From: http://ios.wpjam.com/2011/08/29/uiview-frame-bounds-center/ 1.概要 翻开ios官方开发文档,赫然发现上面对这三个属性的解释如下 ...

  7. 手写控件,frame,center和bounds属性

    一.手写控件 1.手写控件的步骤 (1)使用相应的控件类创建控件对象 (2)设置该控件的各种属性 (3)添加控件到视图中 (4)如果是button等控件,还需考虑控件的单击事件等 (5)注意:View ...

  8. iOS开发UI篇—手写控件,frame,center和bounds属性

    iOS开发UI基础—手写控件,frame,center和bounds属性 一.手写控件 1.手写控件的步骤 (1)使用相应的控件类创建控件对象 (2)设置该控件的各种属性 (3)添加控件到视图中 (4 ...

  9. iOS开发UI基础—手写控件,frame,center和bounds属性

    iOS开发UI基础—手写控件,frame,center和bounds属性 一.手写控件 1.手写控件的步骤 (1)使用相应的控件类创建控件对象 (2)设置该控件的各种属性 (3)添加控件到视图中 (4 ...

随机推荐

  1. MYSQL中的普通索引,主健,唯一,全文索引区别

    MYSQL索引用来快速地寻找那些具有特定值的记录,所有MySQL索引都以B-树的形式保存.如果没有索引,执行查询时MySQL必须从第一个记录开始扫描整个表的所有记录,直至找到符合要求的记录.表里面的记 ...

  2. C#学习日志 day8 -------------- async await 异步方法入门(引用博客)以及序列化和反序列化的XML及json实现

    首先是异步方法的介绍,这里引用自http://www.cnblogs.com/LoveJenny/archive/2011/11/01/2230933.html async and await 简单的 ...

  3. 【Chromium中文文档】多进程资源加载

    多进程资源加载(需要更新) 转载请注明出处:https://ahangchen.gitbooks.io/chromium_doc_zh/content/zh//General_Architecture ...

  4. js的replace的用法;

    obj.replace("需要替换的字符串","替换后的字符串")

  5. bootstrap-dialog的使用

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. How To Set Dark Theme in Visual Studio 2010

    Want to use the visual studio color theme editor to set the dark theme or other themes? Below shows ...

  7. 关于ECMAScript6一些知识

    ECMAScript 是当前 JavaScript 语言规范的最新标准,一般称为 es6, 但是因为 该标准规范是在 2015年6月份发布的,所以也叫作 ECMAScript 2015 let 变量声 ...

  8. JavaScript之怎样获取元素节点

    JavaScript获取元素节点一共有三种方法,分别是通过元素ID.通过标签名字和通过类名字来获取: 1.通过元素ID属性的ID值来获得元素对象-getElementById() DOM提供了一个名为 ...

  9. MVC定义路由

    标准路由配置 routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); routes.MapRoute( name: "Defa ...

  10. 关于XPath的基本语法

    关于XPath基础语法 关于XPath基础语法 更详细的请看: XPath语法 XPath 使用路径表达式来选取 XML 文档中的节点或节点集.节点是通过沿着路径 (path) 或者步 (steps) ...