Comment : animer une zone de découpage

Mise à jour : novembre 2007

Cet exemple montre comment animer la région Clip d'un élément d'infrastructure. Dans l'exemple suivant, une EllipseGeometry est utilisée pour définir une zone de découpage elliptique pour un élément Image. Une PointAnimation anime la propriété Center de la géométrie de l'ellipse de (0, 0) à (200, 150). L'animation commence dès que l'image est chargée et se répète indéfiniment.

Exemple

<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> 

Pour obtenir l'exemple complet, consultez Zone de découpage, exemple.