Floating menu/image/canvas

06-30-2009 11:58 AM |

Hi All, I am working on Silverlight 2.0. I have a grid (which is actually a menu) in my silverlight page. I want this grid to have a floating capability, that is, as and when the user scrolls, it should always stick to the bottom of the page or at the centre of the page page. Even when the page is minimized/maximized, this grid should be placed to the bottom of the page. Is there an option in silverlight to dock a control to the any particular portion of the page ? Is coding necessary to create such an effect? Any pointers to online samples or code snippets will be really helpful.

My requirements are" 

1. A complete silverlight web page.
2. A menu (silverlight control) that floats top of this silverlight page. When the user scrolls the silverlight page, the menu should still be as docked botttom to the page. 

Thanks in advance.

Re: Floating menu/image/canvas

06-30-2009 12:19 PM |

I also want to know how to do it. I found a third party control which has same function. But I'd like to learn how to design it. http://www.divelements.co.uk/net/controls/sanddocksl/livedemo.aspx

Re: Floating menu/image/canvas

06-30-2009 12:33 PM |

The following thread may help: http://silverlight.net/forums/t/98211.aspx

It is very important to understand how Grid works.  It is simple and versatile.

Re: Re: Floating menu/image/canvas

06-30-2009 12:50 PM |

Hi guys,

Know what, i got it working and it is very simple. It just requires very few lines of code. All you have to do is introduce a Scrollvieweer control and get the mousemove events. On mouse move od the scrollbar, just reposition the canvas/image/whatever. The mouse event arguements will give you the current vertical/horizontal offset. Depending on this offset just reposition the canvas.

Here goes the sample:

double dHOffset = ((ScrollViewer)sender).HorizontalOffset;

// send the event to your handler

// update the last position

_dTop += e.VerticalChange; // _dTop is your initial Top value.

_dLeft += e.HorizontalChange; // _dTop is your initial Left value.

MenuGrid.SetValue(Canvas.TopProperty, _dTop);