Information
The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

UIElement.Clip Property

Gets or sets the geometry used to define the outline of the contents of an element. This is a dependency property.

Namespace:  System.Windows
Assembly:  PresentationCore (in PresentationCore.dll)

public Geometry Clip { get; set; }

Property Value

Type: System.Windows.Media.Geometry
The geometry to be used for clipping area sizing. The default is a null Geometry.

Identifier field

ClipProperty

Metadata properties set to true

None

Elements outside the geometry will be visually clipped in the rendered layout. The geometry does not have to be rectangular.

This example shows how to define a framework element's Clip region. To define a clip, use a Geometry (for example, an EllipseGeometry to set the element's Clip property. Only the area that is within the region of the geometry will be visible.

The following example shows an Image element without a defined clip region. Because no clip region is defined, the entire image is displayed.

<Image Source="sampleImages\Waterlilies.jpg" 
  Width="200" Height="150" HorizontalAlignment="Left" />
Image with No Clip Region

An object before applying a clip region

In the next example, an identical Image is created, except that it has a defined clip region. Only the part of the image that is within the area the EllipseGeometry will be displayed.

<Image 
  Source="sampleImages\Waterlilies.jpg" 
  Width="200" Height="150" HorizontalAlignment="Left">
  <Image.Clip>
    <EllipseGeometry
      RadiusX="100"
      RadiusY="75"
      Center="100,75"/>
  </Image.Clip>
</Image>
Image with an Elliptical Clip Region

A clipped object

The following example shows how animate a framework element's Clip region. In this example, an EllipseGeometry is used to define an elliptical clip region for an Image element. A PointAnimation animates the ellipse geometry's Center property from (0, 0) to (200, 150). The animation starts playing after the image is loaded and repeats indefinitely.

<Image
  Source="sampleImages\Waterlilies.jpg" 
  Width="200" Height="150" HorizontalAlignment="Left">
  <Image.Clip>
    <EllipseGeometry x:Name="MyEllipseGeometry1"
      RadiusX="100"
      RadiusY="75"
      Center="100,75"/>
  </Image.Clip>
  <Image.Triggers>
    <EventTrigger RoutedEvent="Image.Loaded">
      <BeginStoryboard>
        <Storyboard>
          <PointAnimation 
            Storyboard.TargetName="MyEllipseGeometry1" 
            Storyboard.TargetProperty="(EllipseGeometry.Center)"
            From="0,0" To="200,150" Duration="0:0:3" RepeatBehavior="Forever" 
            AutoReverse="True" />
          </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Image.Triggers>
</Image> 

For the full sample, see the Clip Region Sample.

.NET Framework

Supported in: 4.6, 4.5, 4, 3.5, 3.0

.NET Framework Client Profile

Supported in: 4, 3.5 SP1

Windows 8.1, Windows Server 2012 R2, Windows 8, Windows Server 2012, Windows 7, Windows Vista SP2, Windows Server 2008 (Server Core Role not supported), Windows Server 2008 R2 (Server Core Role supported with SP1 or later; Itanium not supported)

The .NET Framework does not support all versions of every platform. For a list of the supported versions, see .NET Framework System Requirements.

Show:
© 2014 Microsoft