Screen Boundaries/ Scrolling

[Vassili King]

Hello,

I've been trying to work with the RadMenu (using the Coursework by Telerik).  I've got all the items generated from code (will plug in to WCF RIA later).  Everything is fine, except for scrolling and screen boundary recognition.  I guess it's harder with Silverlight, but I was wondering if there is a solution that works.  I've seen these so far, but none actually helped for the reasons provided next to the sample:

Sample #1: Replacing StackPanel with WrapPanel
(I've lost the URL for this post)
...
        <Style x:Key="ItemStyle" TargetType="telerikNavigation:RadMenuItem">
            <Setter Property="ItemsPanel">
                <Setter.Value>
                    <ItemsPanelTemplate>
                        <telerik:RadWrapPanel Orientation="Vertical" MaxHeight="300" />
                    </ItemsPanelTemplate>
                </Setter.Value>
            </Setter>
        </Style>
...
        <telerikNavigation:RadMenu Orientation="Vertical" ItemContainerStyle="{StaticResource ItemStyle}" ...

My menu is vertically oriented.  This solution, obviously, wraps the menu items into side-wise expanding container that is 300 pixels high.  This is not a very good solution though for a few reasons.  First, if there are enough items in the menu and the screen size is relatively small, the items may be forced outside of the screen boundaries ( what happened to the promised boundary detection (see References section of this post), by the way? :)  The menu in all Telerik examples slides beyond the screen boundaries if the screen is small enough ).  Second (partially explained in the previous one), the solution still does not address the boundary problem.  That is, if the screen is resized (or just small to start with), the menu is expanded beyond the screen boundaries.  Third, there is no scroller by default.

Sample #2: How to add a scrollbar to Telerik RadMenu for Silverlight
(http://blogs.telerik.com/blogs/posts/09-12-10/how_to_add_a_scrollbar_to_telerik_radmenu_for_silverlight.aspx)

Problem is that Blend creates too much stuff that is hard to decypher with no Blend experience.  I'm not exactly sure how to port it into the RadMenu Binding example from the Coureware.  And, again, you have to specify the scroller's hight in pixels and thus would run into screen boundary problems again.


My question is, is it possible to build a screen size conscious (i.e., one that respects screen boundaries) scroller with Telerik Silverlight RadMenu?  And if not, is there an easier way to implement a scroller similar to the one implemented in Sample #2?

Thank you!


References:

From http://www.telerik.com/products/silverlight/menu.aspx:

Boundary Detection

Telerik RadMenu detects the Silverlight plug-in boundaries and opens its child item-groups  in the opposite direction when the screen boundaries are to be crossed. When there is not enough space in both directions, the control will adjust its items’ position in order to make them visible whenever possible.

[Dani]

Hi Vassili,

Thank you for your question.

Currently adding a ScrollViewer around the ItemsPresenter in the template of radMenu is the only way you can force the Menu to have a scrollbar. The approach described in the article is the one you should take. If you have any difficulties while generating the RadMenu templates or while trying to find the spot which you should modify, we are ready to help.

Two things need to be done:

1. Add a ScrollViewer around the ItemsPresenter
2. Set a MaxHeight in the ScrollViewer for the scrollbar to work properly.

If you have any questions, please feel free to contact us again.


Greetings,
Dani
the Telerik team