Powered by MSDN

US - English
NEW! Silverlight 5 is available Learn More

Any idea how to create a horizontal sliding menu that g... RSS

2 replies

Last post Oct 02, 2008 04:25 PM by donmarais

(0)
  • donmarais

    donmarais

    Member

    27 Points

    82 Posts

    Any idea how to create a horizontal sliding menu that gets mouse position and moves canvas either...

    Oct 02, 2008 03:49 PM | LINK

    I have a menu of links within a canvas and would like to create a horizontal scrolling feature that scrolls to either side depending on mouse postion. Furthermore, the canvas scrolling would need to increase as the mouse moves closer to the left side of the canvas and then slows down as the mouse moves closer towards the center of hte canvas.

     

    By the way, this is for SL2B2 and not RCO.

    Donavan Marais
    www.2browndogs.com
    donavan@2browndogs.com
  • cyberwin

    cyberwin

    Member

    80 Points

    54 Posts

    Re: Any idea how to create a horizontal sliding menu that gets mouse position and moves canvas ei...

    Oct 02, 2008 03:55 PM | LINK

     Canvas.MouseEnter

    In your event, the mouse's position can be obtained from the MouseEventArgs ( GetPosition(null).X and GetPosition(null).Y )

     

    Andrew S. Erwin
    Software Developer


  • donmarais

    donmarais

    Member

    27 Points

    82 Posts

    Re: Any idea how to create a horizontal sliding menu that gets mouse position and moves canvas ei...

    Oct 02, 2008 04:25 PM | LINK

    Let me see if I understand correctly:

    1. I create a canvas, nest a stack panel with objects (images or textblocks) and define a starting point and ending point (x position). The canvas would be wider than the grid that it is placed in. So if the grid is 400pixels wide, then say the canvas is 800pixels wide.

    2. Add an event handler on the canvas in xaml, e.g. mouse enter

    3. The mouse enter event would get the x position of the mouse and somehow figure out where it is in relation to the canvas x position.

    Would I need to create an animation for the canvas to move left and right? If so, how would I wire up the event handler to fire up the respective animation depending on the x position in relation to the canvas?

     I created something similar with a animation left and animation right and had left and right buttons. With a mouse enter event, the respective animation would fire, and when mouse leave occurred, the animation would pause. When mouse enter occurred again, the animation would resume.

    The only problem was that it worked fine if you kept using only one of the buttons. If you changed to the other button after a mouse leave event occurred, it would not fire the alternate animation.

    Donavan Marais
    www.2browndogs.com
    donavan@2browndogs.com