RadDropDownButton Control Template

[Joao]

Hi.

I'm trying to customize the RadDropDownButton and in order to do so i have to rewrite some triggers but in order to do so I must rewrite the complete control template!!!!

I've followed the tutorials to extract the template using Blend or Visual Studio but it seems somehow incomplete:

 

<Style x:Key="FocusVisual">
     <Setter Property="Control.Template">
         <Setter.Value>
             <ControlTemplate>
                 <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
             </ControlTemplate>
         </Setter.Value>
     </Setter>
 </Style>
 <SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/>
 <SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>
 <SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/>
 <SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/>
 <SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/>
 <SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/>
 <SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/>
 <SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/>
 <SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/>
 <Style x:Key="RadDropDownButtonStyle1" TargetType="{x:Type Button}">
     <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
     <Setter Property="Background" Value="{StaticResource Button.Static.Background}"/>
     <Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/>
     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
     <Setter Property="BorderThickness" Value="1"/>
     <Setter Property="HorizontalContentAlignment" Value="Center"/>
     <Setter Property="VerticalContentAlignment" Value="Center"/>
     <Setter Property="Padding" Value="1"/>
     <Setter Property="Template">
         <Setter.Value>
             <ControlTemplate TargetType="{x:Type Button}">
                 <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
                     <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                 </Border>
                 <ControlTemplate.Triggers>
                     <Trigger Property="IsDefaulted" Value="true">
                         <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                     </Trigger>
                     <Trigger Property="IsMouseOver" Value="true">
                         <Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/>
                         <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/>
                     </Trigger>
                     <Trigger Property="IsPressed" Value="true">
                         <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/>
                         <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/>
                     </Trigger>
                     <Trigger Property="IsEnabled" Value="false">
                         <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/>
                         <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/>
                         <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/>
                     </Trigger>
                 </ControlTemplate.Triggers>
             </ControlTemplate>
         </Setter.Value>
     </Setter>
 </Style>

 

 

How can i get a complete copy of the RadDropDownButton styles and templates?

 

[Vicky]

Hi Joao,

There are two different approaches on how to extract and edit the default control templates of the Telerik UI for WPF controls, and it seems that you tried one of them, yet the result does not seem to be the desired one. However, I recommend using the other approach if the results that you get are not the ones that you are looking for.
I suggest you to extract the control template from the theme XAML file, which can be found inside the installation folder of your version of Telerik UI for WPF. There you can find a folder named Themes.Implicit, which contains the XAML files of the different themes for all of the controls.

For example, if you are using the Fluent theme, you need to go to the Themes.Implicit\Fluent\Themes folder and find the Telerik.Windows.Controls.xaml file, which contains RadDropDownButton's template. I believe that you followed the steps in this article, which describes the above mentioned approaches.

Please pay attention that in your sample snippet, the Style has a TargetType="{x:Type Button}" and the correct one is {x:Type telerik:RadDropDownButton}. The same goes for the ControlTemplate's TargetType.

Please, try the suggested approach and do not hesitate to contact me if you need further assistance.

Regards,
Vicky
Progress Telerik