Reuse RadRibbonGroup

[Manuel]

Hello,

in many menus I use the same buttons.
Is it possible to create a kind of a base class?

In this case it would be nice to have a base class of the complete group header "actions".

eg:

<telerik:RadRibbonView ApplicationButtonVisibility="Collapsed"TitleBarVisibility="Collapsed" HelpButtonVisibility="Collapsed">
            <telerik:RadRibbonTab Header="Home" HeaderVisibility="Collapsed">
                <telerik:RadRibbonGroup Header="Actions">
                    <telerik:RadRibbonButton LargeImage="{StaticResource Back}" Text="Close" Size="Large"
                                                      Command="{Binding CloseViewCommand}" />
                    <telerik:RadRibbonButton LargeImage="{StaticResource Edit}" Text="Edit" Size="Large"
                                                      Command="{Binding EditItemCommand}" />
                    <telerik:RadRibbonButton LargeImage="{StaticResource Save}" Text="Save" Size="Large"
                                                      Command="{Binding SaveItemCommand}" />
                    <telerik:RadRibbonButton SmallImage="{StaticResource Cancel}" Text="Cancel" Size="Large"
                                                      Command="{Binding CancelItemCommand}" />
                </telerik:RadRibbonGroup>

                <telerik:RadRibbonGroup Header="Print">
                    <telerik:RadRibbonButton SmallImage="{StaticResource Print}"  Text="xxx" Size="Large"
                                                      Command="{Binding PrintItemCommand}"/>
                </telerik:RadRibbonGroup>

                <telerik:RadRibbonGroup Header="Extras">
                    <telerik:RadRibbonButton SmallImage="{StaticResource UpdatePortrait}"  Text="xxxxx" Size="Large"
                                                      Command="{Binding UpdatePictureCommand}"/>
                </telerik:RadRibbonGroup>
            </telerik:RadRibbonTab>
        </telerik:RadRibbonView>

Thank you,
Manuel

[Pavel R. Pavlov]

Hello Manuel,

As far as I understand your scenario you want to reuse exactly the same RadRibbonGroup (in your snippet called "Actions"). You can achieve your requirement by creating a custom UserControl that will derive from our RadRibbonGroup class and define your RadRibbonButtons in it. Furthermore, you can use your UserControl instead of RadRibbonGroup.

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

Regards,
Pavel R. Pavlov
Telerik

[Manuel]

Hi Pavel,

thanks for your help. it is woking!

Now i have another idea but i cannot get it to work.
Error: Specified element is already the logical child of another element. Disconnect it first.

I like to place the "default buttons" and a ContentPresenter in a RadRibbenTab.
The content of the ContentPresenter is bound to a dependency property.
the Idea is to have a complete base class of the RibbenTab, the goal is to put only the required RadRibbonButtons / RadRibbonGroups in it.

<telerik:RadRibbonView....                     
ApplicationButtonVisibility="Collapsed"                    
xmlns:local="clr-namespace:Tortuga.Controls.Core"                                    
 TitleBarVisibility="Collapsed" HelpButtonVisibility="Collapsed">
         
<telerik:RadRibbonTab Header="Home" HeaderVisibility="Collapsed">        
<local:DefaultButtons />      
<ContentPresenter Content="{Binding Content}" /> 
 
</telerik:RadRibbonTab>
</telerik:RadRibbonView>



public partial class DetailsMenu : RadRibbonView
    {
        public DetailsMenu()
        {
            InitializeComponent();
        }
        public FrameworkElement Content
        {
           get { return (FrameworkElement)GetValue(ContentProperty); }
            set { SetValue(ContentProperty, value); }
        }
        public static readonly DependencyProperty ContentProperty =
            DependencyProperty.Register("Content", typeof(FrameworkElement), typeof(DetailsMenu), new PropertyMetadata(null));
 
    }

Impelmentation:

        <local:DetailsMenu>
            <local:DetailsMenu.MyContent>
                <local:SpecificButtons/>
            </local:DetailsMenu.MyContent>
        </local:DetailsMenu>

Thank you,
Manuel

[Pavel R. Pavlov]

Hi Manuel,

As I can see in your code you create a custom user control which derives from our RadRibbonView control. Furthermore, you expose a Content property and now your requirement is to visualize that content. You need to have in mind that when you create a custom Control with custom properties in it, you also need to define a custom ControlTemplate that will define how your properties will be visualized. Please note that the RadRibbonView do not expose Content property and this is why your content will not be visualized.

Maybe you need to derive only the RadRibbonGroup and define the Content property in it. Furthermore, you will have to extract its default ControlTemplate and customize it. You can replace the ItemsPresenter (defined in the ControlTemplate) with a ContentPresenter and bind its Content to your custom property. Also, please note that you will be able to define all the buttons that you need to reuse in the same ControlTemplate.

Let me now get to the error that you report. Such error may be caused by the fact that elements with the same (x:)Name property exist more than once in your application. Please make sure that there are no (x:)Name properties set.

On the other hand, you can consider using an MVVM approach in your application. For more information you can take a look at our online demonstration project.

For your convenience I implemented the approach with the derived RadRibbonGroup in the attached project. Also, you will be able to find a basic implementation of the MVVM approach that can be used as a start up project. Please take a look at the attached project and let me know if it works for you.

Regards,
Pavel R. Pavlov
Telerik

[Jacob]

This approach of creating a class derived from RadRibbbonGroup sounded just like what I was looking for. But I can't get this to work (anymore, in VS2019 with recent Telerik version). Neither the enclosed example, nor if I put it in my own solution, will show the RibbonGroup.

Can this still be done, and if so how?

Jacob

[Martin Ivanov]

The Pavel's project is designed with the XAML dlls in mind. I have downloaded and tested it, and on my side it works properly.

If you use the NoXaml dlls, you will need to create a custom Style that targets the DerivedGroup class and base it on RadRibbonGroupStyle.

<Application x:Class="WpfApp1.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <!-- merged Telerik resoruces here -->
            </ResourceDictionary.MergedDictionaries>
            <Style TargetType="telerik:RadRibbonGroup" BasedOn="{StaticResource RadRibbonGroupStyle}" />
        </ResourceDictionary>
    </Application.Resources>
</Application>