How to: Crop an Object

Microsoft Silverlight will reach end of support after October 2021. Learn more.

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.

A rectangle

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

An ellipse centered at 200, 100

The following illustration shows how the two shapes overlap.

The shapes overlapping

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

Shape resulting from the clip

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>

See Also

Concepts

Imaging

Geometries