2012-06-17 7 views
5

Mam kilka pytań otwartych dotyczących tego samego rodzaju rzeczy,Jak mogę utworzyć animację obracania na obiekcie obrazu przy użyciu tylko kod C# (wewnątrz okna WPF)

Jestem całkiem nowy, WPF, ale doświadczenie z C# i WinForm.

Rozejrzałem się po interweb dla przykładu, ale jeszcze nie znalazłem takiego, który działa.

Co chcę osiągnąć jest w funkcję C# utwórz następującą

  • utworzyć obraz (image 1)
  • utworzyć obraz (image 2)
  • umieścić zdjęcie na stronie okna siebie
  • tworzyć scenorys
  • animowania właściwość obracania na image1 od 0 do 360 (animation1)
  • animowanie właściwości nieprzezroczystości obrazu 2 z pełnego do niewidocznego (animation2)
  • Storyboard powinno działać przez dziesięć sekund z animacja 1 rozpoczęciem w 0 sekund i animacji 2 zaczynając od 5 sekund

przeprosiny za wyraźną prośbę o kod, ale , patrzę, i starał, mój poprzedni pytanie miał pełny kod wykonywany ale bez animacji pokazał (link poniżej)

how to create a storyboard and rotating an image in wpf using c# code

z góry dzięki

Dan.

+0

Czy naprawdę trzeba to wszystko w kod C#?części tego (w szczególności tworzenie obrazu i umieszczanie ich w oknie) są po prostu znacznie prostsze w XAML. – Tim

+0

prawda, obraz i lokalizacja może być w XAML, ale scenorys i animacja muszą być w C# –

+1

OK, poszedłem dalej i zrobiłem to wszystko XAML, a następnie wszystkie C#. Możesz mieszać i dopasowywać w razie potrzeby :) – Tim

Odpowiedz

28

Oto działający wersj XAML twojego pytania, a następnie identyczna rzecz w języku C#. Może nie być dokładnie tym, za czym byłeś, ale powinien to zilustrować.

wersja XAML:

<Window x:Class="WpfApplication1.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="350" Width="525"> 
    <Window.Resources> 
     <Storyboard x:Key="Storyboard" BeginTime="00:00:00.000" Duration="00:00:10.000"> 
      <DoubleAnimation Storyboard.TargetName="RotateImage" 
          Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" 
          From="0" To="360" BeginTime="00:00:05.000" Duration="00:00:05.000" /> 
      <DoubleAnimation Storyboard.TargetName="OpacityImage" 
          Storyboard.TargetProperty="Opacity" 
          From="1" To="0" Duration="00:00:10.000" /> 
     </Storyboard> 
    </Window.Resources> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition /> 
      <RowDefinition Height="Auto" /> 
     </Grid.RowDefinitions> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 
     <Image x:Name="RotateImage" Stretch="Uniform" Source="Chrysanthemum.jpg"> 
      <Image.RenderTransform> 
       <RotateTransform Angle="0" /> 
      </Image.RenderTransform> 
     </Image> 
     <Image x:Name="OpacityImage" Grid.Column="1" Stretch="Uniform" Source="Desert.jpg" /> 
     <Button Grid.Row="1" Grid.ColumnSpan="2" Content="Start"> 
      <Button.Triggers> 
       <EventTrigger RoutedEvent="Button.Click"> 
        <BeginStoryboard Storyboard="{StaticResource Storyboard}" /> 
       </EventTrigger> 
      </Button.Triggers> 
     </Button> 
    </Grid> 
</Window> 

i C# wersja:

public MainWindow() 
    { 
     InitializeComponent(); 

     Image rotateImage = new Image() 
     { 
      Stretch = Stretch.Uniform, 
      Source = new BitmapImage(new Uri("pack://application:,,,/Chrysanthemum.jpg")), 
      RenderTransform = new RotateTransform() 
     }; 
     Image opacityImage = new Image() 
     { 
      Stretch = Stretch.Uniform, 
      Source = new BitmapImage(new Uri("pack://application:,,,/Desert.jpg")) 
     }; 

     LayoutRoot.Children.Add(rotateImage); 
     LayoutRoot.Children.Add(opacityImage); 

     Grid.SetColumn(opacityImage, 1); 

     Storyboard storyboard = new Storyboard(); 
     storyboard.Duration = new Duration(TimeSpan.FromSeconds(10.0)); 
     DoubleAnimation rotateAnimation = new DoubleAnimation() 
     { 
      From = 0, 
      To = 360, 
      Duration = storyboard.Duration 
     }; 
     DoubleAnimation opacityAnimation = new DoubleAnimation() 
     { 
      From = 1.0, 
      To = 0.0, 
      BeginTime = TimeSpan.FromSeconds(5.0), 
      Duration = new Duration(TimeSpan.FromSeconds(5.0)) 
     }; 

     Storyboard.SetTarget(rotateAnimation, rotateImage); 
     Storyboard.SetTargetProperty(rotateAnimation, new PropertyPath("(UIElement.RenderTransform).(RotateTransform.Angle)")); 
     Storyboard.SetTarget(opacityAnimation, opacityImage); 
     Storyboard.SetTargetProperty(opacityAnimation, new PropertyPath("Opacity")); 

     storyboard.Children.Add(rotateAnimation); 
     storyboard.Children.Add(opacityAnimation); 

     Resources.Add("Storyboard", storyboard); 

     Button button = new Button() 
     { 
      Content = "Begin" 
     }; 
     button.Click += button_Click; 

     Grid.SetRow(button, 1); 
     Grid.SetColumnSpan(button, 2); 

     LayoutRoot.Children.Add(button); 
    } 

    void button_Click(object sender, RoutedEventArgs e) 
    { 
     ((Storyboard)Resources["Storyboard"]).Begin(); 
    } 
+0

Skałasz, że jest absolutnie doskonały. dziękuję ... –

+0

To świetnie - jedno pytanie, jak ustawić środkowy punkt obrotu na środek obrazu (używam ścieżki, a nie obrazu). –

+1

@Duncan, spróbuj ustawić RenderTransformOrigin na (0.5,0.5). – mickeymicks

1

Animacja jest praca w następujący sposób.

1-Program tworzy zegar.

2-Program sprawdza licznik w określonych odstępach czasu, aby sprawdzić, ile czasu upłynęło.

3-Za każdym razem, gdy program sprawdza zegar, oblicza aktualną wartość krycia dla prostokąta na podstawie czasu, który upłynął.

4-Program następnie aktualizuje prostokąt z nową wartością i ponownie rysuje.

Poniżej znajduje się Kod, który tworzy prostokąt i ożywia go.

<Window x:Class="Animation.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Animated Rectangle" Height="350" Width="525"> 
<Grid> 
    <StackPanel Margin="10"> 
     <Image Name="MyImage" Source="e:\a.jpg" Width="100" Margin="50" ></Image> 
     <Rectangle 
      Name="MyRectangle" 
      Width="100" 
      Height="100" 
      Fill="Blue"> 

      <Rectangle.Triggers> 
       <!-- Animates the rectangle's opacity. --> 
       <EventTrigger RoutedEvent="Rectangle.Loaded"> 
        <BeginStoryboard> 
         <Storyboard> 
          <DoubleAnimation 
           Storyboard.TargetName="MyImage" 
           Storyboard.TargetProperty="Opacity" 
           From="1.0" To="0.0" Duration="0:0:3" 
           AutoReverse="True" RepeatBehavior="Forever" /> 
         </Storyboard> 
        </BeginStoryboard> 
       </EventTrigger> 
      </Rectangle.Triggers> 
     </Rectangle> 
    </StackPanel> 
</Grid> 

Powiązane problemy