Cómo: Animar un efecto visual con bisel

Actualización: noviembre 2007

En este ejemplo se muestra cómo animar un objeto BevelBitmapEffect en un botón.

Ejemplo

En el ejemplo siguiente se muestra cómo animar las propiedades BevelWidth y LightAngle de un objeto BevelBitmapEffect. Como resultado, cuando el puntero del mouse se mueve sobre el control Button, el nivel interno del bisel mientras la fuente de luz artificial que se utiliza para el bisel gira alrededor del control Button.

<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" >

  <StackPanel>

    <Button Width="200" Height="80" Margin="50">
      MouseOver ME!
      <Button.BitmapEffect>

        <!-- This BitmapEffect is targeted by the animation. -->
        <BevelBitmapEffect x:Name="myBevelBitmapEffect" BevelWidth="0" EdgeProfile="CurvedIn"  />
      </Button.BitmapEffect>
      <Button.Triggers>
        <EventTrigger RoutedEvent="Button.MouseEnter">
          <BeginStoryboard>
            <Storyboard>

              <!-- Animate the BevelWidth from 0 to 15. -->
              <DoubleAnimation
               Storyboard.TargetName="myBevelBitmapEffect"
               Storyboard.TargetProperty="BevelWidth"
               From="0" To="15" Duration="0:0:0.5" AutoReverse="True"
               />

              <!-- Animate the LightAngle so that the light source and 
                   corresponding bevel shadows move around the button. -->
              <DoubleAnimation
               Storyboard.TargetName="myBevelBitmapEffect"
               Storyboard.TargetProperty="LightAngle"
               From="360" To="0" Duration="0:0:0.5" AutoReverse="True"
               />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Button.Triggers>
    </Button>

  </StackPanel>

</Page>

Para obtener el ejemplo completo, vea Ejemplo Bitmap Effects Gallery.

Vea también

Tareas

Cómo: Crear un efecto visual con bisel

Cómo: Animar varios efectos visuales

Ejemplo Bitmap Effects Gallery

Conceptos

Información general sobre efectos de mapa de bits

Otros recursos

Temas "Cómo..." de efectos de mapa de bits

Ejemplos de efectos de mapa de bits