Animations not working???

5 posts, 0 answers
  1. Marc
    Marc avatar
    88 posts
    Member since:
    Jul 2011

    Posted 24 Jan 2012 Link to this post

    First of all: I use the Metro theme and I've read this post.

    What I'm actually trying to do is to completely disable any animations of the popup menu of all my top level menu items. But lets start from the beginning...

    Looking at your Metro sources I found this:

    <Style TargetType="telerikNavigation:RadMenu"  >
    ...
            <Setter Property="animation:AnimationManager.AnimationSelector">
                <Setter.Value>
                    <animation:AnimationSelector>
                        <animation:SlideAnimation Direction="In" SlideMode="Top" AnimationName="Expand"
                                TargetElementName="PopupContentElement" />
                    </animation:AnimationSelector>
                </Setter.Value>
            </Setter>

    However, I can't see any slide animation in my application. Still, the popup doesn't appear instantly, so it seems to me that there must be an animation. But neither setting "telerikAnimation:AnimationManager.IsAnimationEnabled="False"" nor "AnimationManager.IsGlobalAnimationEnabled = false;" changed anything. So I tried to explicitly set an this animation selector for testing purposes

    <telerikAnimation:AnimationManager.AnimationSelector>
                    <telerikAnimation:AnimationSelector>
                        <telerikAnimation:SlideAnimation Direction="In"
                                                 SlideMode="Bottom"
                                                 AnimationName="Expand"
                                                 TargetElementName="PopupContentElement"
                                                 SpeedRatio="3.0" />
                        <telerikAnimation:SlideAnimation Direction="Out"
                                                 SlideMode="Bottom"
                                                 AnimationName="Collapse"
                                                 TargetElementName="PopupContentElement"
                                                 SpeedRatio="3.0" />
                    </telerikAnimation:AnimationSelector>
                </telerikAnimation:AnimationManager.AnimationSelector>


    as the content of my RadMenu and/or my top level RadMenuItem. Still no effect. No animations visible.

    So, are animations broken for RadMenu in general?
    Is there anything I missed?

    And, most important: How can I completely disable any animations of the popup menu of all my top level menu items?

    Thanks.
  2. Dani
    Admin
    Dani avatar
    848 posts

    Posted 27 Jan 2012 Link to this post

    Hello Stephan,

    You can disable animation of RadMenu by setting the AnimationSelector to null:
    telerik:AnimationManager.AnimationSelector="{x:Null}"

    I hope this will be helpful in your case.


    All the best,
    Dani
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  3. DevCraft banner
  4. Marc
    Marc avatar
    88 posts
    Member since:
    Jul 2011

    Posted 27 Jan 2012 Link to this post

    Hmmm, neighter this

    <Telerik:RadMenu Background="Transparent" NotifyOnHeaderClick="True" Telerik:AnimationManager.AnimationSelector="{x:Null}">
            <Telerik:RadMenuItem
                    Click="OnTopMenuItemClick"
                    ItemContainerStyle="{StaticResource SubMenuItemContainerStyle}"
                    ItemsSource="{Binding Source={StaticResource SubMenuItemsSource}}"
                    ItemTemplate="{StaticResource SubMenuItemDataTemplate}"
                    Telerik:RadMenuItem.TopLevelHeaderTemplateKey="{StaticResource TopMenuItemControlTemplate}" />
        </Telerik:RadMenu>

    nor that

    <Telerik:RadMenu Background="Transparent" NotifyOnHeaderClick="True">
            <Telerik:AnimationManager.AnimationSelector>
                <Telerik:AnimationSelector>
                    <Telerik:SlideAnimation Direction="In"
                                                 SlideMode="Bottom"
                                                 AnimationName="Expand"
                                                 TargetElementName="PopupContentElement"
                                                 SpeedRatio="3.0" />
                    <Telerik:SlideAnimation Direction="Out"
                                                 SlideMode="Bottom"
                                                 AnimationName="Collapse"
                                                 TargetElementName="PopupContentElement"
                                                 SpeedRatio="3.0" />
                </Telerik:AnimationSelector>
            </Telerik:AnimationManager.AnimationSelector>
            <Telerik:RadMenuItem
                    Click="OnTopMenuItemClick"
                    ItemContainerStyle="{StaticResource SubMenuItemContainerStyle}"
                    ItemsSource="{Binding Source={StaticResource SubMenuItemsSource}}"
                    ItemTemplate="{StaticResource SubMenuItemDataTemplate}"
                    Telerik:RadMenuItem.TopLevelHeaderTemplateKey="{StaticResource TopMenuItemControlTemplate}" />
        </Telerik:RadMenu>

    changes anything regarding the animation of the menu popup. that's why I think animation is broken in RadMenu (Metro/SL4).

    By the way: your silverlight docs are outdated. it is called "TargetElementName" not "TargetName" and the popup control is named "PopupContentElement" not "DropDownBorder".

    Besides that, I think I can't get an instant popup because your internal PopupWrapper uses a hardcoded Opacity-animation with 130 ms (see your current sources). That's a shame. Any idea on how to remove/modify this.

  5. Marc
    Marc avatar
    88 posts
    Member since:
    Jul 2011

    Posted 27 Jan 2012 Link to this post

    I tried everything but I can't remove this animation. Could you PLEASE make this animation somehow configurable/deactivatable via an attached property, via override of RadMenuItem or just disable it if animations have been deactivated for that control or globally.

    Another thing which currently makes menu item feel sluggish is that when I move my mouse outside of them and directly on another ui element which has a mouseover-effect, this effect just doesn't start. only after moving the mouse on the other ui element for a while, the effect eventually becomes visible. I'm not sure about the reason. Is it due to the opacity-animation of the menu (which then probably reverts to 0) or is it a dynamically created rectangle to catch "outsideclicks" of the popup thereby preventing the events on the other element to be triggered???

    Is there anything I can do about it?
  6. Dani
    Admin
    Dani avatar
    848 posts

    Posted 30 Jan 2012 Link to this post

    Hi Stephan,

    I cannot reproduce a problem removing the slide animation. I attach here an illustrative sample - setting the AnimationSelector to null removes RadMenu animation as expected.

    Could you try and reproduce the issue in a sample ?

    Thank you for your feedback on the documentation. We will update information on the Animation section.

    On your inquiry about the PopupWrapper, I would like to inform you that changes have been made on RadMenu for 2012 Q1 release , which is fast approaching. RadMenu control will be using for its popup a class which does not provide a built-in animation, nor hard-coded Opacity changes.

    The last issue you described about mouse over effects on other UI elements is related, as you suggested, to capturing OutSide clicks. This issue will again be fixed in the updacoming 2012 Q1 release.

    I hope this information will be helpful.

    All the best,
    Dani
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
Back to Top
DevCraft banner