Hinweis
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, sich anzumelden oder das Verzeichnis zu wechseln.
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, das Verzeichnis zu wechseln.
In diesem Beispiel werden zwei Möglichkeiten veranschaulicht, ein Popup-Steuerelement zu animieren.
Beispiel
Im folgenden Beispiel wird die PopupAnimation-Eigenschaft auf einen Wert von Slide festgelegt, sodass das Popup in die Ansicht "gleitet".
Um das Popup zu drehen, wird in diesem Beispiel RotateTransform der RenderTransform-Eigenschaft auf dem Canvas-Element zugewiesen, das ein untergeordnetes Element von Popup ist.
Damit die Transformation ordnungsgemäß funktioniert, muss die AllowsTransparency-Eigenschaft im Beispiel auf true festgelegt werden. Außerdem muss der Margin auf dem Canvas-Inhalt genug Platz für das Popup angeben, damit es gedreht werden kann.
<Popup IsOpen="{Binding ElementName=myCheckBox,Path=IsChecked}"
PlacementTarget="{Binding ElementName=myCheckBox}"
AllowsTransparency="True"
PopupAnimation="Slide"
HorizontalOffset="50"
VerticalOffset="50"
>
<!--The Margin set on the Canvas provides the additional
area around the Popup so that the Popup is visible when
it rotates.-->
<Canvas Width="100" Height="100" Background="DarkBlue"
Margin="150">
<Canvas.RenderTransform>
<RotateTransform x:Name="theTransform" />
</Canvas.RenderTransform>
<TextBlock TextWrapping="Wrap" Foreground="White">
Rotating Popup
</TextBlock>
</Canvas>
</Popup>
Im folgenden Beispiel wird gezeigt, wie ein Click-Ereignis, dass beim Klicken auf ein Button-Element eintritt, das Storyboard auslöst, das die Animation startet.
<Button HorizontalAlignment="Left" Width="200" Margin="20,10,0,0">
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="theTransform"
Storyboard.TargetProperty="(RotateTransform.Angle)"
From="0" To="360" Duration="0:0:5" AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
Click to see the Popup animate
</Button>