Condividi tramite


Procedura: animare un effetto visivo di smusso

Aggiornamento: novembre 2007

In questo esempio viene illustrato come animare BevelBitmapEffect su un pulsante.

Esempio

Nell'esempio seguente viene illustrato come animare le proprietà BevelWidth e LightAngle di BevelBitmapEffect. Di conseguenza, quando il puntatore del mouse viene spostato su Button, il livello interno della smussatura aumenta mentre la sorgente di luce artificiale utilizzata per la smussatura gira intorno a 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>

Per l'esempio completo, vedere Esempio di raccolta di effetti bitmap.

Vedere anche

Attività

Procedura: creare un effetto visivo smussato

Procedura: animare più effetti visivi

Esempio di raccolta di effetti bitmap

Concetti

Cenni preliminari sugli effetti bitmap

Altre risorse

Procedure relative agli effetti bitmap

Esempi di effetti bitmap