Animations in XAML
page 6 of 9
by Keyvan Nayyeri
Feedback
Average Rating: This article has not yet been rated.
Views (Total / Last 10 Days): 45237/ 152

ParallelTimeline

Creating two animations that animate synchronously is as simple as declaring those animations and grouping them into a ParallelTimeline element.

Listing 6 and its results in Figure 16, Figure 17 and Figure 18 are an example for the ParallelTimeline element.  The Angle of RenderTransform of a Button is changing while its width is decreasing.

Listing 6

<Window x:Class="AnimationsInXAML.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Animations In XAML" Height="180" Width="300"
    >
  <StackPanel>
    <StackPanel.Triggers>
      <EventTrigger RoutedEvent="Rectangle.MouseEnter">
        <EventTrigger.Actions>
          <BeginStoryboard>             
            <Storyboard>
              <ParallelTimeline>
                <Storyboard Storyboard.TargetName="btnSend" 
                            Storyboard.TargetProperty="(RenderTransform).(RotateTransform.Angle)">
                  <DoubleAnimation From="0"
                                   To="90" 
                                   Duration="0:0:5"/>
                </Storyboard>
                <Storyboard Storyboard.TargetName="btnSend" 
                            Storyboard.TargetProperty="Width">
                  <DoubleAnimation From="100"
                                   To="70" 
                                   Duration="0:0:5"/>
                </Storyboard>
              </ParallelTimeline>
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger.Actions>
      </EventTrigger>
    </StackPanel.Triggers>
    <Button Name="btnSend" 
            Width="100"
            Height="40"
            Margin="40"
            Background="Plum">
      <Button.RenderTransform>
        <RotateTransform Angle="0" CenterX="40" CenterY="40" />
      </Button.RenderTransform>
      ASP Alliance
    </Button>
  </StackPanel>
</Window>

Figure 16

Figure 17

Figure 18


View Entire Article

User Comments

Title: Well Done and Thank you   
Name: Shrishail V. Halijol
Date: 2009-04-07 2:26:26 PM
Comment:
Hi...
Thanks for such a small article which covered this basics of animation in Silverlight. I really enjoyed reading this article.
Thanks again for the good work. Well done.
Title: Phenomenal   
Name: John A. Blesson
Date: 2009-01-21 4:49:10 AM
Comment:
I just loved the tutorials . Wanting to have more of it.

Keepup the good work.
Title: Go on guy...   
Name: Nima
Date: 2008-01-18 3:34:07 PM
Comment:
Dear Keyvan,
I like the way you do it. Short, fast and complete enough to get start with. I'm proud of such Iranians.
Take care
Title: Useful Information   
Name: Soumya
Date: 2007-06-15 11:00:08 AM
Comment:
Could you please post information/Code about making flyouts in XAML. When we click a button we should be able to get a flyout and then when we click anywhere on the flyout, it should close.
Title: Thanks   
Name: Keyvan Nayyeri
Date: 2006-10-25 12:19:24 PM
Comment:
Thank you Mohammad,

I'll try to follow these turotials :-) I'm glad to see they could be useful.
Title: Very Nicely Done!!1   
Name: AzamSharp
Date: 2006-10-25 11:38:51 AM
Comment:
Hi,

Very nice tutorials. Keep up the good work :)
Title: Resources in XAML   
Name: Keyvan Nayyeri
Date: 2006-10-25 12:34:42 AM
Comment:
Third part of these tutorials about Resources in XAML:
http://aspalliance.com/1032_Resources_in_XAML
Title: Layout in XAML   
Name: Keyvan Nayyeri
Date: 2006-10-25 12:34:11 AM
Comment:
Second part of these tutorials about Layout in XAML:
http://aspalliance.com/1023_Layout_in_XAML
Title: Introduction to XAML   
Name: Keyvan Nayyeri
Date: 2006-10-25 12:33:50 AM
Comment:
First part of these tutorials, Introduction to XAML:
http://aspalliance.com/1019_Introduction_to_XAML

Product Spotlight
Product Spotlight 





Community Advice: ASP | SQL | XML | Regular Expressions | Windows


©Copyright 1998-2019 ASPAlliance.com  |  Page Processed at 2019-12-11 7:59:17 PM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search