Animation Trigger (Storyboard + Trigger) in C#

230 views Asked by At

I have an animation using DoubleAnimationUsingKeyFrames, and I need to turn on the first part of the animation by using triggers. How can i do that?

 <Storyboard x:Key="TargetStoryboard">
     <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="TargetArea" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
         <SplineDoubleKeyFrame KeyTime="00:00:0.0000000" Value="0.001"/>
         <SplineDoubleKeyFrame KeyTime="00:00:0.6000000" Value="1"/>
         <SplineDoubleKeyFrame KeyTime="00:00:3.6000000" Value="1"/>
         <SplineDoubleKeyFrame KeyTime="00:00:4.3000000" Value="0"/>     
     </DoubleAnimationUsingKeyFrames>

     <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="TargetArea" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
         <SplineDoubleKeyFrame KeyTime="00:00:0.0000000" Value="-60"/>
         <SplineDoubleKeyFrame KeyTime="00:00:0.6000000" Value="-222"/>
         <SplineDoubleKeyFrame KeyTime="00:00:3.6000000" Value="-222"/>
         <SplineDoubleKeyFrame KeyTime="00:00:4.8000000" Value="3.35"/>   
     </DoubleAnimationUsingKeyFrames>
  </Storyboard>

It must be something like this, but it doesnt work.

<Storyboard x:Key="TargetStoryboard">
            <Trigger Property="dAnimTrigger" Value="True">
                <Trigger.EnterActions>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="TargetArea" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
                <SplineDoubleKeyFrame KeyTime="00:00:0.0000000" Value="0.001"/>
                <SplineDoubleKeyFrame KeyTime="00:00:0.6000000" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:3.6000000" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:4.3000000" Value="0"/>

            </DoubleAnimationUsingKeyFrames>
                </Trigger.EnterActions>
            </Trigger>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="TargetArea" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeyTime="00:00:0.0000000" Value="-60"/>
                <SplineDoubleKeyFrame KeyTime="00:00:0.6000000" Value="-222"/>
                <SplineDoubleKeyFrame KeyTime="00:00:3.6000000" Value="-222"/>
                <SplineDoubleKeyFrame KeyTime="00:00:4.8000000" Value="3.35"/>

            </DoubleAnimationUsingKeyFrames>

        </Storyboard>

Help me to solve this problem, please.

1

There are 1 answers

0
ReeganLourduraj On BEST ANSWER

Change your trigger with beginstoryboard inside of EnterActions and ExitActions

Please look into following piece of code:

<Trigger.EnterActions>
            <BeginStoryboard>
              <Storyboard>
                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                  To="1" Duration="0:0:1" />
              </Storyboard>
            </BeginStoryboard>
          </Trigger.EnterActions>
          <Trigger.ExitActions>
            <BeginStoryboard>
              <Storyboard>
                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                  To="0.25" Duration="0:0:1" />
              </Storyboard>
            </BeginStoryboard>
          </Trigger.ExitActions>          
        </Trigger>