[英]UIView frame, bounds and center
我想知道如何以正确的方式使用这些属性。
据我所知, frame
可以从我正在创建的视图的容器中使用。 它设置相对于容器视图的视图位置。 它还设置该视图的大小。
也可以从我正在创建的视图的容器中使用center
。 此属性更改视图相对于其容器的位置。
最后, bounds
是相对于视图本身。 它会更改视图的可绘制区域。
你能提供关于frame
和bounds
之间关系的更多信息吗? clipsToBounds
和masksToBounds
属性怎么样?
由于我问过的问题已多次出现,我将提供详细的答案。 如果您想添加更多正确的内容,请随意修改它。
首先回顾一下这个问题:框架,边界和中心以及它们之间的关系。
框架视图的frame
( CGRect
)是其超superview
坐标系中矩形的位置。 默认情况下,它从左上角开始。
边界视图bounds
( CGRect
)在其自己的坐标系中表示视图矩形。
中心 A center
是以超superview
的坐标系表示的CGPoint
,它确定视图的精确中心点的位置。
从UIView +位置开始,这些是之前属性中的关系(它们在代码中不起作用,因为它们是非正式方程式):
frame.origin = center - (bounds.size / 2.0)
center = frame.origin + (bounds.size / 2.0)
frame.size = bounds.size
注意:如果旋转视图,则这些关系不适用。 有关详细信息,我建议您查看以下基于斯坦福CS193p课程的厨房抽屉 图片 。 积分归@Rhubarb所有 。
使用frame
可以在其superview
重新定位和/或调整视图大小。 通常可以在superview
,例如,在创建特定子视图时。 例如:
// view1 will be positioned at x = 30, y = 20 starting the top left corner of [self view]
// [self view] could be the view managed by a UIViewController
UIView* view1 = [[UIView alloc] initWithFrame:CGRectMake(30.0f, 20.0f, 400.0f, 400.0f)];
view1.backgroundColor = [UIColor redColor];
[[self view] addSubview:view1];
当您需要在view
内绘制坐标时,通常会引用bounds
。 一个典型的例子可能是在view
绘制一个子视图作为第一个插图。 绘制子视图需要知道超级视图的bounds
。 例如:
UIView* view1 = [[UIView alloc] initWithFrame:CGRectMake(50.0f, 50.0f, 400.0f, 400.0f)];
view1.backgroundColor = [UIColor redColor];
UIView* view2 = [[UIView alloc] initWithFrame:CGRectInset(view1.bounds, 20.0f, 20.0f)];
view2.backgroundColor = [UIColor yellowColor];
[view1 addSubview:view2];
更改视图的bounds
时会发生不同的行为。 例如,如果更改bounds
size
,则frame
更改(反之亦然)。 变化发生在视图的center
附近。 使用下面的代码,看看会发生什么:
NSLog(@"Old Frame %@", NSStringFromCGRect(view2.frame));
NSLog(@"Old Center %@", NSStringFromCGPoint(view2.center));
CGRect frame = view2.bounds;
frame.size.height += 20.0f;
frame.size.width += 20.0f;
view2.bounds = frame;
NSLog(@"New Frame %@", NSStringFromCGRect(view2.frame));
NSLog(@"New Center %@", NSStringFromCGPoint(view2.center));
此外,如果更改bounds
origin
,则更改其内部坐标系的origin
。 默认情况下, origin
位于(0.0, 0.0)
(左上角)。 例如,如果更改view1
的origin
,则可以看到(如果需要,请注释前面的代码),现在view2
左上角触及view1
。 动机很简单。 你说view1
它的左上角现在位于(20.0, 20.0)
位置(20.0, 20.0)
但由于view2
的frame
origin
是从(20.0, 20.0)
,它们将重合。
CGRect frame = view1.bounds;
frame.origin.x += 20.0f;
frame.origin.y += 20.0f;
view1.bounds = frame;
origin
表示view
在其超superview
中的位置,但描述了bounds
中心的位置。
最后, bounds
和origin
不是相关的概念。 两者都允许导出视图的frame
(参见前面的等式)。
View1的案例研究
以下是使用以下代码段时发生的情况。
UIView* view1 = [[UIView alloc] initWithFrame:CGRectMake(30.0f, 20.0f, 400.0f, 400.0f)];
view1.backgroundColor = [UIColor redColor];
[[self view] addSubview:view1];
NSLog(@"view1's frame is: %@", NSStringFromCGRect([view1 frame]));
NSLog(@"view1's bounds is: %@", NSStringFromCGRect([view1 bounds]));
NSLog(@"view1's center is: %@", NSStringFromCGPoint([view1 center]));
相对的形象。
相反,如果我更改[self view]
界限,如下所示会发生什么。
// previous code here...
CGRect rect = [[self view] bounds];
rect.origin.x += 30.0f;
rect.origin.y += 20.0f;
[[self view] setBounds:rect];
相对的形象。
在这里你要说[self view]
它的左上角现在位于(30.0,20.0)位置,但由于view1
的帧起点从(30.0,20.0)开始,它们将重合。
其他参考 (如果需要,可与其他参考资料一起更新)
关于clipsToBounds
(源Apple文档)
将此值设置为YES会导致子视图被剪切到接收器的边界。 如果设置为NO,则不会剪切其帧超出接收器可见边界的子视图。 默认值为NO。
换句话说,如果视图的frame
是(0, 0, 100, 100)
0,0,100,100 (0, 0, 100, 100)
并且其子视图是(90, 90, 30, 30)
90,90,30,30 (90, 90, 30, 30)
,您将只看到该子视图的一部分。 后者不会超过父视图的范围。
masksToBounds
相当于clipsToBounds
。 而不是UIView
,此属性应用于CALayer
。 在引擎盖下, clipsToBounds
调用masksToBounds
。 如需进一步参考,请查看UIView的clipsToBounds和CALayer的masksToBounds之间的关系如何? 。
这个问题已经有了一个很好的答案,但我想补充一些更多的图片。 我的完整答案就在这里。
为了帮助我记住框架 ,我想到了墙上的相框 。 就像图片可以移动到墙上的任何地方一样,视图框架的坐标系是超视图。 (wall = superview,frame = view)
为了帮助我记住边界 ,我想到了篮球场的界限 。 篮球就在球场内的某个地方,就像视线边界的坐标系在视野内一样。 (court = view,basketball / players =视图内容)
与框架一样, view.center也在superview的坐标中。
黄色矩形表示视图的框架。 绿色矩形表示视图的边界。 两个图像中的红点表示帧的原点或坐标系内的边界。
Frame
origin = (0, 0)
width = 80
height = 130
Bounds
origin = (0, 0)
width = 80
height = 130
Frame
origin = (40, 60) // That is, x=40 and y=60
width = 80
height = 130
Bounds
origin = (0, 0)
width = 80
height = 130
Frame
origin = (20, 52) // These are just rough estimates.
width = 118
height = 187
Bounds
origin = (0, 0)
width = 80
height = 130
这与示例2相同,除了这次显示视图的整个内容,如果它没有被剪切到视图的边界,它将看起来像。
Frame
origin = (40, 60)
width = 80
height = 130
Bounds
origin = (0, 0)
width = 80
height = 130
Frame
origin = (40, 60)
width = 80
height = 130
Bounds
origin = (280, 70)
width = 80
height = 130
再次,请参阅此处获取更多详细信息的答案。
我发现这个图像最有助于理解框架,边界等。
另请注意,旋转图像时frame.size != bounds.size
。
我想如果你从CALayer
的角度考虑它,一切都会更清楚。
Frame根本不是视图或图层的独特属性,它是一个虚拟属性,根据边界,位置( UIView
的中心)和变换计算。
所以基本上如何通过这三个属性(和anchorPoint)真正决定图层/视图布局,并且这三个属性中的任何一个都不会更改任何其他属性,例如更改变换不会更改边界。
这篇文章的详细解释有很好的答案。 我只是想提一下,在WWDC 2011视频中,有关于Frame,Bounds,Center,Transform,Bounds Origin的含义的视觉表示的另一种解释,从@ 4:22到20:10开始了解UIKit Rendering
阅读完上述答案后,在此添加我的解释。
假设在线浏览, 网页浏览器是决定显示网页的位置和大小的frame
。 浏览器的滚动条是你的bounds.origin
,决定显示哪个网页部分。 bounds.origin
很难理解。 学习的最佳方法是创建单视图应用程序,尝试修改这些参数并查看子视图的更改方式。
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
UIView *view1 = [[UIView alloc] initWithFrame:CGRectMake(100.0f, 200.0f, 200.0f, 400.0f)];
[view1 setBackgroundColor:[UIColor redColor]];
UIView *view2 = [[UIView alloc] initWithFrame:CGRectInset(view1.bounds, 20.0f, 20.0f)];
[view2 setBackgroundColor:[UIColor yellowColor]];
[view1 addSubview:view2];
[[self view] addSubview:view1];
NSLog(@"Old view1 frame %@, bounds %@, center %@", NSStringFromCGRect(view1.frame), NSStringFromCGRect(view1.bounds), NSStringFromCGPoint(view1.center));
NSLog(@"Old view2 frame %@, bounds %@, center %@", NSStringFromCGRect(view2.frame), NSStringFromCGRect(view2.bounds), NSStringFromCGPoint(view2.center));
// Modify this part.
CGRect bounds = view1.bounds;
bounds.origin.x += 10.0f;
bounds.origin.y += 10.0f;
// incase you need width, height
//bounds.size.height += 20.0f;
//bounds.size.width += 20.0f;
view1.bounds = bounds;
NSLog(@"New view1 frame %@, bounds %@, center %@", NSStringFromCGRect(view1.frame), NSStringFromCGRect(view1.bounds), NSStringFromCGPoint(view1.center));
NSLog(@"New view2 frame %@, bounds %@, center %@", NSStringFromCGRect(view2.frame), NSStringFromCGRect(view2.bounds), NSStringFromCGPoint(view2.center));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.