Como: Recieve Notification When a Timeline Completes

O evento Completed notifica você quando a Timeline completa. Uma linha do tempo é considerada completada após alcançar o fim de seu período ativo e não mais continuará a não ser que seja reiniciada interativamente. Observe que "concluída" não é a mesma "interrompido executando": interromper um linha do tempo não aciona o Completed evento (mas pulando para a linha da tempo preencher faz período).

Exemplo

No exemplo a seguir, dois objetos Storyboard são usados para criar uma transição de animação entre duas imagens, armazenadas usando objetos ImageSource e exibidas usando um controle Image. Um storyboard reduz o controle de imagem até que desapareça. Depois de completado, o antigo ImageSource é trocado com o outro ImageSource, e um segundo storyboard que expande o controle de imagem até que volte ao tamanho original.

<!-- TimelineCompletedExample.xaml 
     This example creates an animated transition between
     two images. When the user clicks the Start Transition button,
     a storyboard shrinks an image until it disappears. 
     The Completed event is used to notify the class when this
     storyboard has completed. The code behind file handles
     this event by swapping the image and making it visible again.
-->
<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="SDKSample.TimelineCompletedExample"
  WindowTitle="Timeline Completed Example"
  Loaded="exampleLoaded">
  <Page.Resources>

    <!-- A simple picture of a rectangle. -->
    <DrawingImage x:Key="RectangleDrawingImage">
      <DrawingImage.Drawing>
        <DrawingGroup>
          <GeometryDrawing Brush="White">
            <GeometryDrawing.Geometry>
              <RectangleGeometry Rect="0,0,100,100"  />
            </GeometryDrawing.Geometry>
          </GeometryDrawing>
          <GeometryDrawing Brush="Orange">
            <GeometryDrawing.Geometry>
              <RectangleGeometry Rect="25,25,50,50"  />
            </GeometryDrawing.Geometry>
          </GeometryDrawing>
        </DrawingGroup>
      </DrawingImage.Drawing>
    </DrawingImage>

    <!-- A simple picture of a cirlce. -->
    <DrawingImage x:Key="CircleDrawingImage">
      <DrawingImage.Drawing>
        <DrawingGroup>
          <GeometryDrawing Brush="White">
            <GeometryDrawing.Geometry>
              <RectangleGeometry Rect="0,0,100,100"  />
            </GeometryDrawing.Geometry>
          </GeometryDrawing>
          <GeometryDrawing>
            <GeometryDrawing.Geometry>
              <EllipseGeometry Center="50,50" RadiusX="25" RadiusY="25"  />
            </GeometryDrawing.Geometry>
            <GeometryDrawing.Brush>
              <RadialGradientBrush GradientOrigin="0.75,0.25" Center="0.75,0.25">
                <GradientStop Offset="0.0" Color="White" />
                <GradientStop Offset="1.0" Color="LimeGreen" />
              </RadialGradientBrush>
            </GeometryDrawing.Brush>
          </GeometryDrawing>
        </DrawingGroup>
      </DrawingImage.Drawing>
    </DrawingImage>

    <!-- Define the storyboard that enlarges the image.
         This storyboard is applied using code when
         ZoomOutStoryboard completes. -->
    <Storyboard x:Key="ZoomInStoryboardResource">
      <DoubleAnimation 
        Storyboard.TargetName="AnimatedImageScaleTranform" 
        Storyboard.TargetProperty="ScaleX" 
        Duration="0:0:5" To="1" />
      <DoubleAnimation 
       Storyboard.TargetName="AnimatedImageScaleTranform" 
       Storyboard.TargetProperty="ScaleY" 
       Duration="0:0:5" To="1" />
    </Storyboard>
  </Page.Resources>

  <StackPanel Margin="20" >
    <Border 
      BorderBrush="Gray" BorderThickness="2" 
      HorizontalAlignment="Center" VerticalAlignment="Center">

      <!-- Displays the current ImageSource. -->
      <Image
        Name="AnimatedImage" 
        Width="200" Height="200"
        RenderTransformOrigin="0.5,0.5">
        <Image.RenderTransform>
          <ScaleTransform x:Name="AnimatedImageScaleTranform" 
            ScaleX="1" ScaleY="1" />
        </Image.RenderTransform>
      </Image>
    </Border>


    <!-- This StackPanel contains buttons that control the storyboard. -->
    <StackPanel Orientation="Horizontal" Margin="0,30,0,0">

      <Button Name="BeginButton">Start Transition</Button>
      <Button Name="SkipToFillButton">Skip To Fill</Button>
      <Button Name="StopButton">Stop</Button>

      <StackPanel.Triggers>

        <!-- Begin the storyboard that shrinks the image. After the storyboard
             completes, -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="BeginButton">
          <BeginStoryboard Name="ZoomOutBeginStoryboard">
            <Storyboard x:Name="ZoomOutStoryboard" 
              Completed="zoomOutStoryboardCompleted" FillBehavior="Stop">
              <DoubleAnimation 
                Storyboard.TargetName="AnimatedImageScaleTranform" 
                Storyboard.TargetProperty="ScaleX" 
                Duration="0:0:5" To="0" FillBehavior="Stop" />
              <DoubleAnimation 
               Storyboard.TargetName="AnimatedImageScaleTranform" 
               Storyboard.TargetProperty="ScaleY" 
               Duration="0:0:5" To="0" FillBehavior="Stop" />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>

        <!-- Advances ZoomOutStoryboard to its fill period.
             This action triggers the Completed event. -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="SkipToFillButton">
          <SkipStoryboardToFill BeginStoryboardName="ZoomOutBeginStoryboard" />
        </EventTrigger>

        <!-- Stops the storyboard. This action does not
             trigger the completed event. -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="StopButton">
          <StopStoryboard BeginStoryboardName="ZoomOutBeginStoryboard" />
        </EventTrigger>
      </StackPanel.Triggers>
    </StackPanel>
  </StackPanel>
</Page>

// TimelineCompletedExample.xaml.cs
// Handles the ZoomOutStoryboard's Completed event.
// See the TimelienCompletedExample.xaml file
// for the markup that creates the images and storyboards.

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Navigation;


namespace SDKSample
{

    public partial class TimelineCompletedExample : Page
    {

        private Storyboard zoomInStoryboard;
        private ImageSource currentImageSource;
        private ImageSource nextImageSource;

        public TimelineCompletedExample()
        {
            InitializeComponent();
        }

        private void exampleLoaded(object sender, RoutedEventArgs e)
        {
            // Cache the zoom-out storyboard resource.
            zoomInStoryboard = 
                (Storyboard) this.Resources["ZoomInStoryboardResource"];

            // Cache the ImageSource resources.
            currentImageSource = 
                (ImageSource) this.Resources["RectangleDrawingImage"];
            nextImageSource = 
                (ImageSource) this.Resources["CircleDrawingImage"];

            // Display the current image source.
            AnimatedImage.Source = currentImageSource;
        }

        // Handles the zoom-out storyboard's completed event. 
        private void zoomOutStoryboardCompleted(object sender, EventArgs e)
        {
            AnimatedImage.Source = nextImageSource;
            nextImageSource = currentImageSource;
            currentImageSource = AnimatedImage.Source;
            zoomInStoryboard.Begin(AnimatedImage, HandoffBehavior.SnapshotAndReplace);
        }

    }
}

Para obter mais informações sobre eventos de temporização , consulte Visão geral Eventos de Temporizadores.

Consulte também

Referência

Completed