MVVM Drop Down Buttons

[Marcello]

Hi,

I tested the code of samples "Paint with MVVM".
All works good but how to add sub Items to a DropDownsButton?
I tryed a lot of strategies without success...

Thank's,
marc.

[Pavel R. Pavlov]

Hello marc,

As you can see in our demo we define different HierarchicalDataTemplates for the RadRibbonTabs and RadRibbonGroups. In order to populate the groups with RadRibbonDropDownButtons you can define a DataTemplate and set it as ItemTemplate of the groups. Furthermore, can define a DataTemplate for the DropDownContent of the RadRibbonDropDownButtons. In order to populate the buttons you can define them as follows:

<telerik:RadRibbonDropDownButton Content="{Binding Content}"
DropDownContent="{Binding}"
DropDownContentTemplate="{StaticResource DropDownContentTemplate}"
 Size="{Binding Size}" />

For your convenience I implemented this approach in the attached project. Please take a look at it and let me know if you have any other questions.

Regards,
Pavel R. Pavlov
the Telerik team

[Marcello]

Hi Pavel,

thank's very much.
but the problem is little more complex beacause is possible that a dropdownitem contains sub items (also check box radio box...)
Don't exist an example with a complete ribbon use via mvvm?

thank's marc.

[Pavel R. Pavlov]

Hello marc,

In order to achieve your requirement you can change the DropDownContentTemplate and set it to a hierarchical control (e.g. RadTreeView or RadContextMenu). By doing so you will be able to create one more logical level in your business object. Please take a look at the attached project where I used the RadContextMenu control to create two levels of items in the DropDownContent of the RadRibbonDropDownButton control. You can follow this approach and create as much levels as you need. Also, instead TextBlock you can use any other control to structure your items and subitems.

Regards,
Pavel R. Pavlov
Telerik

[Pavel R. Pavlov]

Hi marc,

I wanted to follow you up on this. Please note that if you have any issues closing the DropDownContent of the RadRibbonDropDownButton you can define the "ButtonTemplate" like this:

<DataTemplate x:Key="ButtonTemplate">
    <telerik:RadRibbonDropDownButton Size="{Binding Size}" Content="{Binding Content}" >
        <telerik:RadRibbonDropDownButton.DropDownContent>
            <telerik:RadContextMenu ItemsSource="{Binding DropDownContentItems}">
                <telerik:RadContextMenu.ItemContainerStyle>
                    <Style TargetType="telerik:RadMenuItem">
                        <Setter Property="Header" Value="{Binding Header}"/>
                        <Setter Property="ItemsSource" Value="{Binding Children}"/>
                    </Style>
                </telerik:RadContextMenu.ItemContainerStyle>
            </telerik:RadContextMenu>
        </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
</DataTemplate>

Regards,
Pavel R. Pavlov
Telerik