locked
Why DoubleAnimation doesn't work smoothly?

    Question

  • Hi,

    I want that a popup slides smoothly from the left to the right, but it doesn't work smoothly.

    If the mouse moves the animation also moves.

        <Popup x:Name="OverlayPopup"
               IsOpen="{Binding IsOpen, Mode=TwoWay}"
               Opened="Popup_OnOpened"
               Closed="Popup_OnClosed">


          <DoubleAnimation Storyboard.TargetName="OverlayPopup"
                                 Storyboard.TargetProperty="(Canvas.Left)"
                                 Duration="0:0:1"
                                 From="-300"
                                 To="0">
                    <DoubleAnimation.EasingFunction>
                        <SineEase EasingMode="EaseInOut" />
                    </DoubleAnimation.EasingFunction>
                </DoubleAnimation>

       private void Popup_OnOpened(object sender, object e)
            {
                var openAnimation = (Storyboard) this.Resources["openFromLeftAnimation"];
                openAnimation.Begin();
            }
    

    I can't find an issue.

    thanks

    Monday, September 01, 2014 12:18 PM

Answers

  • Done,

     <Storyboard x:Key="openFromLeftAnimation">
    
                <DoubleAnimation Storyboard.TargetName="OverlayPopup"
                                 Storyboard.TargetProperty="Opacity"
                                 Duration="0:0:0.1"
                                 From="0"
                                 To="1">
                    <DoubleAnimation.EasingFunction>
                        <SineEase EasingMode="EaseInOut" />
                    </DoubleAnimation.EasingFunction>
                </DoubleAnimation>
    
                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="OverlayPopup"
                                               Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)">
                    <EasingDoubleKeyFrame KeyTime="0"
                                          Value="-500" />
                    <EasingDoubleKeyFrame KeyTime="0:0:0.25"
                                          Value="0" />
                </DoubleAnimationUsingKeyFrames>
    
            </Storyboard>
      <Popup x:Name="OverlayPopup"
               IsOpen="{Binding IsOpen, Mode=TwoWay}"
               Opened="Popup_OnOpened">
                
                <Popup.RenderTransform>
                    <CompositeTransform/>
                </Popup.RenderTransform>


    Tuesday, September 02, 2014 6:56 AM

All replies

  • Done,

     <Storyboard x:Key="openFromLeftAnimation">
    
                <DoubleAnimation Storyboard.TargetName="OverlayPopup"
                                 Storyboard.TargetProperty="Opacity"
                                 Duration="0:0:0.1"
                                 From="0"
                                 To="1">
                    <DoubleAnimation.EasingFunction>
                        <SineEase EasingMode="EaseInOut" />
                    </DoubleAnimation.EasingFunction>
                </DoubleAnimation>
    
                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="OverlayPopup"
                                               Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)">
                    <EasingDoubleKeyFrame KeyTime="0"
                                          Value="-500" />
                    <EasingDoubleKeyFrame KeyTime="0:0:0.25"
                                          Value="0" />
                </DoubleAnimationUsingKeyFrames>
    
            </Storyboard>
      <Popup x:Name="OverlayPopup"
               IsOpen="{Binding IsOpen, Mode=TwoWay}"
               Opened="Popup_OnOpened">
                
                <Popup.RenderTransform>
                    <CompositeTransform/>
                </Popup.RenderTransform>


    Tuesday, September 02, 2014 6:56 AM
  • Ok, nice to know :)

    A best practice is to use Blend, will create everything automatically for you.


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.


    Tuesday, September 02, 2014 9:02 AM
    Moderator