RadContextMenu animation

2 posts, 0 answers
  1. IsolatedStorage
    IsolatedStorage avatar
    15 posts
    Member since:
    Sep 2009

    Posted 14 Dec 2010 Link to this post

    Is it possible to animate the way a RadContextMenu opens and closes? I have tried using the VisualStateManager (below) but it doesn't produce the results I was hoping for.

    <telerik:RadContextMenu x:Name="GridContextMenu">
        <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="CommonStates">
            <VisualStateGroup.Transitions>
            <VisualTransition From="Closed" To="Opened" GeneratedDuration="00:00:00.5">
                <Storyboard>
                    <DoubleAnimationUsingKeyFrames BeginTime="0" Storyboard.TargetName="GridContextMenu" Storyboard.TargetProperty="Opacity">
                        <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                        <EasingDoubleKeyFrame KeyTime="00:00:00.5" Value="0"/>
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </VisualTransition>
        </VisualStateGroup.Transitions>
    </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    ...
    </telerik:RadContextMenu>
  2.
  3. Konstantina
    Admin
    Konstantina avatar
    2332 posts

    Posted 17 Dec 2010 Link to this post

    Hello,

    Thank you for contacting us.

    To achieve your goal you have to keep in mind the following things:
    1. The VisualStateManager has to be used in a ControlTemplate or a UserControl, cannot be set like this in to the control.
    2. The easiest way to manipulate animation is using Expression Blend.
    3. The ContextMenu already has an animation for the Opacity.
    If you want to open the menu with VisualStateManager, the VisualStateManager has to be to the UserControl and animate the IsOpen property of the Menu, not the Opacity. Instead of DoubleAnimationUsingKeyFrames you can use the ObjectAnimationUsingFeyFrames. Then, change the TargetProperty to IsOpen. Change the
    <EasingDoubleKeyFrame KeyTime="0" Value="1"/>

    to

    <DiscreteObjectKeyFrame KeyTime="0" Value="1"/> 

    Hope this information helps. If you have further questions please let us know.

    Greetings,
    Konstantina
    the Telerik team
    Browse the videos here>> to help you get started with RadControls for Silverlight
Back to Top