clipsToBounds如何工作？ [英] How does clipsToBounds work?

问题描述

我想知道如何使用 UIView 属性 clipsToBounds 。

I would like to know how to use the UIView property clipsToBounds.

官方文档说明如下：

clipsToBounds property

一个布尔值，用于确定子视图是否仅限于视图的
范围。

A Boolean value that determines whether subviews are confined to the bounds of the view.

讨论

将此值设置为 YES 会导致子视图被剪切为
接收器的界限。如果设置为否，则不会剪切其帧超出接收器可见边界的
的子视图。默认的
值是否。

Discussion
Setting this value to YES causes subviews to be clipped to the bounds of the receiver. If set to NO, subviews whose frames extend beyond the visible bounds of the receiver are not clipped. The default value is NO.

但我是不清楚这究竟意味着什么。我应该如何使用 clipsToBounds ？将此属性设置为 YES 的确切后果是什么？或者否？

But I'm unclear on what this means exactly. How should I be using clipsToBounds? What are the consequences of setting this property to YES exactly? Or to NO?

推荐答案

如果我的超级视图是一个10的盒子每边的单位，我的子视图是20个单位宽， clipsToBounds 设置为 YES ，我只会看到子视图中适合超视图范围的部分。否则，如果 clipsToBounds 设置为否，我将看到整个子视图，甚至是superview之外的部分（假设我们仍然在屏幕上。）

If my superview is a box measuring 10 units on each side, and my subview is 20 units wide, with clipsToBounds set to YES, I'll only see the part of the subview that fits within the bounds of the superview. Otherwise, if clipsToBounds is set to NO, I'll see the entire subview, even the parts outside the superview (assuming we're still on the screen).

作为一个直观的例子，考虑在故事板上设置的以下视图：

As a visual example, consider the following views set up on the storyboard:

这是一个白色的 UIView ，左上角有一个简单的1或2的标签，所以我可以将它们作为讨论view1 或 view2 。此外，黑色视图与白色视图的大小相同，但它的原点位于白色视图的中心。

This is a white UIView, a label in the top left corner with either a simple "1" or "2" so that I can discuss these as view1 or view2. Additionally, the black view is the same size as the white view, but it's origin is at the white view's center.

在视图控制器的 viewDidLoad中方法，我们有以下代码：

In the view controller's viewDidLoad method, we have the following code:

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view1.clipsToBounds = YES;
    self.view2.clipsToBounds = NO;
}

Swift：

Swift:

override func viewDidLoad() {
    super.viewDidLoad()
    self.view1.clipsToBounds = true
    self.view2.clipsToBounds = false
}

当我们运行代码并在模拟器中查看或在设备上，我们得到以下结果：

When we run the code and look at in the simulator or on the device, we get the following results:

所以，尽管这些视图设置相同（除了 clipsToBounds ），它们看起来不同。这就是 clipsToBounds 的作用。将其设置为 YES 将提供最高结果，而将其设置为否提供最低结果。

So, despite these views being set up identically (except clipsToBounds), they look different. This is what clipsToBounds does. Setting it to YES will provide the top result, while setting it to NO provides the bottom result.

如果我们调试视图层次结构，我们可以更清楚地看到黑框实际上都延伸到白色视图的边界之外，但只有视图2显示了这个应用实际上是正在运行：

If we debug the view hierarchy, we can see more clearly that the black boxes both do actually extend past the boarders of the white view, but only view 2 shows this when the app is actually running:

这篇关于clipsToBounds如何工作？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！