Small knowledge, big challenge! This paper is participating in theEssentials for programmers”Creative activities

Abstract

CornerRadius and masksToBounds are automatically written as the cornerRadius and masksToBounds are searched for. Why masksToBounds?

For example, if I set the rounded corner of a button to 5, I would immediately write these two lines of code:

btn.layer.cornerRadius = 5
btn.layer.masksToBounds = true
Copy the code

There is no problem with the presentation. But why set masksToBounds to true? Can we not write it?

With questions in mind, let’s see what masksToBounds do.

masksToBounds

MasksToBounds indicates a settable flag that specifies whether all sublayers in the bounds area of the current layer are cropped. My understanding is that if set to true then sub-layers in this layer are clipped out of bounds.

So the question is, how does it do that? Continue to read apple’s explanation, blah blah blah… Here’s what I understand:

To summarize, if this property is set to true, it generates a mask that has a value of 1 in the bounds area and 0 beyond. After that, the mask is covered on the layer, mixed rendering, the part of 1 will show the original, the part of 0 will be blank, which realizes the clipping effect, because the mask contains the set rounded corners, so in the process, the rounded corners will also be taken into account.

Now let’s see what the cornerRadius does.

cornerRadius

Set the layer background four corners to the radius of the rounded corner.

And then it says the cornerRadius limit, which only applies to the background and the border, and the contents in the layer are not affected, such as the image placed on top of it.

If you want the cornerRadius effect to apply to contents as well, you need to set masksToBounds to True.

conclusion

I do set masksToBounds to True when displaying images. But if you look at it now, if you’re going to use masksToBounds you have to make it clear that you want rounded content to be layer contents? Does this content go beyond the bounds of the rounded corners?

If the answer to both questions is true. You must set masksToBounds to true.

So those are in thelayer 的 contents? I’ll give you the details after I verify them

digression

Time is short and what you said may not be comprehensive. If you have any problems during your review, please leave a message in the comment section and I will reply as soon as possible