Search code examples
ioscore-animationcore-graphics

Clipping multiple layers to a set frame? (CoreAnimation/Quartz2d)


Im not sure how to word this, or what the correct terminology is. Hopefully I can explain...

Setup:

  • Basically I have a UIView made up of multiple CALayers.
  • Each layer has an object on it (custom drawn with a Draw method override)
  • I animate using a scale transform (ie: grow), so it grows until it expands past the full size of the frame of the parent
  • I what each layer to be clipped when it reaches the edge of the UIView, so it doesn't display past the border of the UIView

Hopefully this image can explain what im trying to do: Example image


Solution

  • Is the clipsToBounds property off? From the UIView docs:

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

    @property(nonatomic) BOOL clipsToBounds

    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.

    You can turn this on by setting the property in code, or if the view comes from a xib file there's a "Clips Subviews" checkbox in the Attributes inspector in Interface Builder.