Vorgehensweise: Verwenden von Ereignistriggern zum Steuern eines Storyboards nach dessen StartHow to: Use Event Triggers to Control a Storyboard After It Starts

In diesem Beispiel wird gezeigt, wie Storyboard ein nach dem Starten gesteuert wird.This example shows how to control a Storyboard after it starts. Verwenden XAMLXAML Storyboard Sie,umeinmitzustarten,mithilfevon,wodurchdieAnimationenandievonIhnenanimiertenObjekteundEigenschaftenverteiltwerden,undstartenSiedanndasStoryboard.BeginStoryboardTo start a Storyboard by using XAMLXAML, use BeginStoryboard, which distributes the animations to the objects and properties they animate and then starts the storyboard. Wenn Sie BeginStoryboard einen Namen angeben, indem Sie Name die zugehörige-Eigenschaft angeben, legen Sie ihn als steuerbares Storyboard fest.If you give BeginStoryboard a name by specifying its Name property, you make it a controllable storyboard. Sie können das Storyboard dann interaktiv steuern, nachdem es gestartet wurde.You can then interactively control the storyboard after it starts.

Verwenden Sie die folgenden storyboardaktionen in EventTrigger Verbindung mit-Objekten, um ein Storyboard zu steuern.Use the following storyboard actions together with EventTrigger objects to control a storyboard.

BeispielExample

Im folgenden Beispiel werden steuerbare storyboardaktionen verwendet, um ein Storyboard interaktiv zu steuern.The following example uses controllable storyboard actions to interactively control a storyboard.

Hinweis

Ein Beispiel für die Steuerung eines Storyboards mithilfe von Code finden Sie unter Steuern eines Storyboards, nachdem es mit seiner interaktiven Methode begonnenhat.To see an example of controlling a storyboard by using code, see Control a Storyboard After It Starts Using Its Interactive Methods.

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  WindowTitle="Controlling a Storyboard" >
  <StackPanel Margin="20" >

    <!-- This rectangle is animated. -->
    <Rectangle Name="myRectangle"
      Width="100" Height="20" Margin="12,0,0,5" Fill="#AA3333FF" HorizontalAlignment="Left" />

    <!-- This StackPanel contains all the Buttons. -->
    <StackPanel Orientation="Horizontal" Margin="0,30,0,0">

      <Button Name="BeginButton">Begin</Button>
      <Button Name="PauseButton">Pause</Button>
      <Button Name="ResumeButton">Resume</Button>
      <Button Name="SeekButton">Seek</Button>
      <Button Name="SkipToFillButton">Skip To Fill</Button>
      <Button Name="SetSpeedRatioButton">Triple Speed</Button>
      <Button Name="StopButton">Stop</Button>

      <StackPanel.Triggers>
        
        <!-- Begin the Storyboard -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="BeginButton">
          <BeginStoryboard Name="MyBeginStoryboard">
            <Storyboard >
              <DoubleAnimation 
                Storyboard.TargetName="myRectangle" 
                Storyboard.TargetProperty="Width" 
                Duration="0:0:5" From="100" To="500" />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>

        <!-- Pause the Storyboard -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="PauseButton">
          <PauseStoryboard BeginStoryboardName="MyBeginStoryboard" />
        </EventTrigger>

        <!-- Resume the Storyboard -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="ResumeButton">
          <ResumeStoryboard BeginStoryboardName="MyBeginStoryboard" />
        </EventTrigger>
 
         <!-- Seek one second into the storyboard's active period. -->
         <EventTrigger RoutedEvent="Button.Click" SourceName="SeekButton">
           <SeekStoryboard 
            BeginStoryboardName="MyBeginStoryboard" 
            Offset="0:0:1" Origin="BeginTime" />
        </EventTrigger>   

        <!-- Skip to Fill -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="SkipToFillButton">
          <SkipStoryboardToFill BeginStoryboardName="MyBeginStoryboard" />
        </EventTrigger>

        <!-- Stop the Storyboard -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="StopButton">
          <StopStoryboard BeginStoryboardName="MyBeginStoryboard" />
        </EventTrigger>
        
        <!-- Triple the speed of the Storyboard -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="SetSpeedRatioButton">
          <SetStoryboardSpeedRatio SpeedRatio="3" BeginStoryboardName="MyBeginStoryboard" />
        </EventTrigger>
      </StackPanel.Triggers>
    </StackPanel>
  </StackPanel>
</Page>

Weitere Beispiele finden Sie in der Animation Example Gallery.For additional examples, see the Animation Example Gallery.

Siehe auchSee also