How to add separtor to menu.

6 posts, 0 answers
  1. Alexey
    Alexey avatar
    79 posts
    Member since:
    Oct 2008

    Posted 25 Dec 2008 Link to this post

    Hi,

    I'd like to create simple one level menu. And I need to insert separtors between menu items. What is the best way to do it?

    MenuItem1 <separtor> MenuItem2 <separtor> MenuItem3


    Thanks,
    Alexey Zakharov.
  2. Konstantin Petkov
    Admin
    Konstantin Petkov avatar
    1911 posts

    Posted 26 Dec 2008 Link to this post

    Hi Alexey,

    There is RadSeparator control that you can use with RadMenu for Silverlight. You can find it in the same Telerik.Windows.Controls.Navigation assembly. Please take a look at the live demo here for example:

    http://demos.telerik.com/silverlight/#Menu/FirstLook

    The "File" and "Edit" Menu items both contain Separator. I hope this helps.

    Regards,
    Konstantin Petkov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. DevCraft banner
  4. Alexey
    Alexey avatar
    79 posts
    Member since:
    Oct 2008

    Posted 26 Dec 2008 Link to this post

    That is nice if we add menuitems declarative, but if i'm using databinding it is a problem because if i add separtor inside template it would appear also in the end of menu.
  5. Miroslav
    Admin
    Miroslav avatar
    922 posts

    Posted 29 Dec 2008 Link to this post

    Hi Alexey,

    You can mix RadSeparator instances with your objects. For example I created a menu:

    <nav:RadMenu> 
        <nav:RadMenuItem Header="File" x:Name="file" /> 
        <nav:RadMenuItem Header="Edit" /> 
    </nav:RadMenu> 

    and then added an ItemsSource:

    file.ItemsSource = Enumerable.Range(1, 11).Select<int,object>(num =>  
        {  
            if (num % 3 == 0)  
            {  
                return new RadSeparator();  
            }  
            else 
            {  
                return String.Format("Item {0}", num);  
            }  
        }); 

    This is just a quick test, but it should work like that if you are using HierarchicalDataTemplates and have a more complex structure.

    I realize the RadSeparator objects cannot be easily serialized and they have to mix with data objects, but you can replace them easily just before setting the ItemsSouce and have placeholder data objects for them.

    Please come back to us if you need more help or there are any issues.

    Kind regards,
    Miroslav
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Alexey
    Alexey avatar
    79 posts
    Member since:
    Oct 2008

    Posted 11 Jan 2009 Link to this post

    Hi guys,

    Don't you think that this solution is some kind of hack? =)

    It would be great if you will add separator template or separator style property, which will hold separators template.

    I've made a little experiment with adding separator to standart listbox control and it looks as I need. But it breaks listbox functionality because of its rules to get current item index.

            protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
            {
                var listBoxItem = element as ListBoxItem;

                if (listBoxItem != null)
                {
                    if (SeparatorStyle != null)
                    {
                        if (Items.IndexOf(item) == Items.Count - 1)
                        {
                            var children = (VisualTreeHelper.GetParent(listBoxItem) as Panel).Children;
                            var insertIndex = 1;
                            for (var i = 0; i < Items.Count - 1; ++i)
                            {
                                children.Insert(insertIndex, new ContentControl
                                                                {
                                                                    Style = SeparatorStyle
                                                                });
                                insertIndex += 2;
                            }
                        }
                    }
                }
                base.PrepareContainerForItemOverride(element, item);
            }


    Thanks,
    Alexey Zakharov.
  7. Miroslav
    Admin
    Miroslav avatar
    922 posts

    Posted 14 Jan 2009 Link to this post

    Hello Alexey,

    To be honest, I have never thought about adding the separator to a ListBox. :)

    Indeed, it may not act as a separator because the ListBox will wrap it and it will try to select it.

    Only Separator-aware ItemsControls will not try to wrap it and treat it as a normal item.

    With Telerik ItemsControls you can use the ItemContainerStyleSelector property and give different styles to the container items (like in WPF). This way you can distinguish between different items and provide the necessary style.

    Best wishes,
    Miroslav
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Back to Top
DevCraft banner