How to: Crop an Object

You can crop an object by clipping out an area of the object's display. This is done by using the Clip property. You set this property to a Geometry, which means that you can cut out a variety of geometric shapes (for example, ellipse, line, or complex path) from your object. For more information about creating geometries, see Geometries.

Note:
An alternate way to create a cropping effect is to apply an OpacityMask by using a gradient. Because you are using the Opacity property, you are able to create a "blurry edge" to your cropping. For more information, see OpacityMask.

The following example shows how to clip an elliptical (circular) area out of a rectangle. To conceptualize this example, consider the rectangle in the illustration.

The following illustration shows an ellipse with a radius of 50 centered at the position 200, 100.

The following illustration shows how the two shapes overlap.

The following illustration shows the results of clipping the rectangle with the ellipse as the clipping geometry.

The following code shows how to create the shape in the preceding illustration by using the Clip property.

<Rectangle Fill="Yellow" Height="100" Width="200"
 StrokeThickness="2" Stroke="Black">
  <Rectangle.Clip>

    <EllipseGeometry Center="200,100" RadiusX="50" RadiusY="50" />

  </Rectangle.Clip>

</Rectangle>