Wie kann ich Sie animieren die UserControl-Objekte mithilfe von Storyboard und DoubleAnimation?

In meiner WPF-Anwendung, ich habe ein Canvas-Objekt, das enthält einige UserControl-Objekte.

Möchte ich animieren Sie die UserControl-Objekte im Canvas-Bereich mithilfe der DoubleAnimation so dass Sie gehen von den rechten der Leinwand auf der linken Seite der Leinwand. Dies ist, wie ich es bisher gemacht (wenn man die UserControl-Objekte in die Funktion):

    private void Animate(FrameworkElement e)
    {
        DoubleAnimation ani = new DoubleAnimation()
        {
            From = _container.ActualWidth,
            To = 0.0,
            Duration = new Duration(new TimeSpan(0, 0, 10),
            TargetElement = e
        };

        TranslateTransform trans = new TranslateTransform();
        e.RenderTransform = trans;

        trans.BeginAnimation(TranslateTransform.XProperty, ani, HandoffBehavior.Compose);
    }

Jedoch, das mir nicht erlaubt, zu pausieren die animation, also ich habe gedacht, dass mithilfe eines Storyboards statt dies zu tun, aber ich bin mir nicht sicher, wie Sie diese umsetzen. Dies war mein Versuch bisher:

    private void Animate(FrameworkElement e)
    {
        DoubleAnimation ani = new DoubleAnimation()
        {
            From = _container.ActualWidth,
            To = 0.0,
            Duration = new Duration(new TimeSpan(0, 0, 10),
            TargetElement = e
        };

        Storyboard stb = new Storyboard();
        Storyboard.SetTarget(ani, e);
        Storyboard.SetTargetProperty(ani, "Left");
        stb.Children.Add(ani);
        stb.Begin();
    }

Natürlich, dies nicht als UserControl nicht Left Eigenschaft. Wie kann ich erreichen, was ich mir nach dem?

Dank.

InformationsquelleAutor Neo | 2009-11-24

Neo,

Ich glaube, ich habe dein problem gelöst. Hier ist was ich getan habe:

Erstellte ich ein raster mit Zeilen in es. In der ersten Zeile, habe ich einen stack panel ausrichten, mein start, pause, resume-buttons. In der zweiten Reihe, legte ich ein Rechteck (mein Objekt, das Sie animieren). Ich habe dann verdrahtet einige Auslöser für das starten, anhalten und fortsetzen der Schaltflächen zum starten, anhalten und fortsetzen der animation. Hier ist der code, den ich verwendet habe:

<Window x:Class="Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300">
    <Grid>
        <Grid.Triggers>

            <EventTrigger SourceName="StartBtn" RoutedEvent="Button.Click">
                <EventTrigger.Actions>
                    <BeginStoryboard x:Name="MyStoryboard">
                        <Storyboard >
                            <DoubleAnimation Storyboard.TargetName="MovingRect" Storyboard.TargetProperty="RenderTransform.(TranslateTransform.X)" From="0" To="250"  AutoReverse="True" RepeatBehavior="Forever"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger.Actions>
            </EventTrigger>
            <EventTrigger SourceName="StopBtn" RoutedEvent="Button.Click" >
                <PauseStoryboard BeginStoryboardName="MyStoryboard" />
            </EventTrigger>
            <EventTrigger SourceName="ResumeBtn" RoutedEvent="Button.Click" >
                <ResumeStoryboard BeginStoryboardName="MyStoryboard" />
            </EventTrigger>
        </Grid.Triggers>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
        <StackPanel Orientation="Horizontal" Grid.Row="0">
            <Button  x:Name="StartBtn" Content="Start" Width="100" />
            <Button  x:Name="StopBtn" Content="Pause" Width="100" />
            <Button  x:Name="ResumeBtn" Content="Resume" Width="100" />
        </StackPanel>
        <Rectangle Name="MovingRect" Fill="Red" Width="50" Height="25" Grid.Row="2" HorizontalAlignment="Left">
            <Rectangle.RenderTransform>
                <TranslateTransform X="0" Y="0" />
            </Rectangle.RenderTransform>
        </Rectangle>
    </Grid>
</Window>

Hier ist meine Ausgabe:

Ausgabe http://img34.imageshack.us/img34/5619/1789718.jpg

Ich habe den code Hinzugefügt, um meine Google Code Projekt zum download. Ich habe auch die Zip-Datei der source-code, und es ist unter der folgenden Adresse verfügbar:

http://stackoverflow-answers-by-scott.googlecode.com/files/1789718.zip

Auch hier ist eine sehr gute Referenz für WPF-Animationen:

http://dotnetslackers.com/articles/wpf/IntroductionToWPFAnimations.aspx

Ich hoffe, das hilft,

Dank!

Leider, muss ich dies programmgesteuert (in der C# - code-behind), und einfach ändern möchte, meine Arbeit zu Animieren Funktion zum Anhängen von DoubleAnimation Objekt zu einem Storyboard-Objekt. Dein code scheint in Ordnung für XAML zu erreichen, die Start/Pause - /Resume-Funktionalität, aber ich habe eine viel einfachere Anforderung - das Anhängen einer DoubleAnimation Objekt zu einem Storyboard-Objekt und eine Eigenschaft angeben, die (im Storyboard.SetTargetProperty) veranlasst, dass das Ziel-Objekt bewegt sich über die Leinwand von rechts nach Links. Ist das möglich?

InformationsquelleAutor Scott

0

Nur, um diese Frage aktualisiert, ich habe schließlich das problem gelöst. Die DoubleAnimation und Storyboard wurden erstellt und Storyboard.Begin() aufgerufen, in einem DispatcherTimer-Tick-event-handler.

Der trick war zur Versendung der Aufruf eines Delegaten aufgerufen Storyboard.Begin().
- Könnte u die C# - code, bitte?
- Der Hinweis ist in meinem letzten Kommentar - die dispatcher, um den Anruf auf dem UI-thread.
InformationsquelleAutor Neo

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.