Animation

The attached properties of the Telerik AnimationManager allow you to apply animation to the expanding and collapsing of the RadMenuItems. By default there is one animation defined and it applies to the expanding of the RadMenuItem.

In order to use the AnimationManager you have to add the following namespace: xmlns:telerikAnimation="clr-namespace:Telerik.Windows.Controls.Animation;assembly=Telerik.Windows.Controls"

Here is the default animation value.

<telerik:RadMenu> 
    <telerikAnimation:AnimationManager.AnimationSelector> 
        <telerikAnimation:AnimationSelector> 
            <telerikAnimation:SlideAnimation Direction="In" 
                                     SlideMode="Top" 
                                     AnimationName="Expand" 
                                     TargetElementName="DropDownBorder" 
                                     SpeedRatio="3.0" /> 
        </telerikAnimation:AnimationSelector> 
    </telerikAnimation:AnimationManager.AnimationSelector> 
    <!--...--> 
</telerik:RadMenu> 

The animation which the AnimationManager provides is of type SlideAnimation. This type of animation is used for hiding and showing popups. It exposes the following properties:

• AnimationName - the name of the animation.

• Direction - the direction of the animation. Indicates whether the animated object is sliding in or out of view.

• SlideMode - the mode of the animation. Top value indicates that the direction is from top to bottom. Bottom value indicates the opposite.

• SpeedRatio - the coefficient that is applied to the animation duration.

• TargetName - the name of the control that the animation should affect.

In order to add an animation for the collapsing of the popup you have to define one more SlideAnimation in the scope of the AnimationSelector and set its properties to the appropriate values. Here is an example how to do this.

<telerik:RadMenu VerticalAlignment="Top" 
                 HorizontalAlignment="Left"> 
    <telerikAnimation:AnimationManager.AnimationSelector> 
        <telerikAnimation:AnimationSelector> 
            <telerikAnimation:SlideAnimation Direction="In" 
                                     SlideMode="Bottom" 
                                     AnimationName="Expand" 
                                     TargetElementName="DropDownBorder" 
                                     SpeedRatio="3.0" /> 
            <telerikAnimation:SlideAnimation Direction="Out" 
                                     SlideMode="Bottom" 
                                     AnimationName="Collapse" 
                                     TargetElementName="DropDownBorder" 
                                     SpeedRatio="3.0" /> 
        </telerikAnimation:AnimationSelector> 
    </telerikAnimation:AnimationManager.AnimationSelector> 
    <!--...--> 
</telerik:RadMenu> 

See Also

• Icons

• Opening Modes

• Opening and Closing Delays