Button Border

[Jerome]

I have a RadToolBar with two buttons in it. First, directly, a RadButton. This looks fine. It's border is removed, it's text is colored properly. I *assume* that the RadToolBar is applying a style to it.

Next, I have a custom control, local:DialogButton. The Template for this Control contains a RadButton. local:DialogButton is just a simple wrapper around a Rad:Button that sets it's command, and uses it differently. To encapsulate some functionality.

The RadButton inside of local:DialogButton is not styled properly.

How can I resolve this?

I was THINKING that the RadToolBar would have Style's for RadButton set in it's dictionary: and that they would thus be resolved for any children. This doesn't seem to be the case.

Or, is there a better way to encapsulate RadButton where all the expected stuff will work properly?

I chose to not inherit from RadButton because I wanted to hide the properties of RadButton that the user will not be able to use. The button does one thing. It requires the user only to set the Command. It dispatches this command differently than RadButton itself does. The user has no control over much else.

[Petar Mladenov]

Hi Jerome,

The RadToolBar has built-in predefined styles for some controls including RadButton but it does not apply these styles if the control in question is wrapped in other control (in border for example, or in custom controltemplate of control).
In the attached sample which uses implicit styles, you can find RadToolBar with two buttons - a single one and one nested in Border.
The second Button's Style is set explicitly:

<Grid.Resources>
           <Style x:Key="ToolBarRadButton" TargetType="telerik:RadButton" BasedOn="{StaticResource RadButtonStyle}">
               <Setter Property="Margin" Value="1" />
               <Setter Property="Padding" Value="2" />
               <Setter Property="BorderThickness" Value="1" />
               <Setter Property="BorderBrush" Value="Transparent" />
               <Setter Property="Background" Value="Transparent" />
               <Setter Property="HorizontalContentAlignment" Value="Center" />
               <Setter Property="VerticalContentAlignment" Value="Center" />
               <Setter Property="IsBackgroundVisible" Value="False" />
           </Style>
       </Grid.Resources>
       <telerik:RadToolBar Width="300" Height="30">
           <telerik:RadButton Content="Button"/>
           <Border>
               <telerik:RadButton Content="BorderedButton" Style="{StaticResource ToolBarRadButton}"/>
           </Border>
       </telerik:RadToolBar>

"ToolBaRadButton" style is copied from the RadToolBar's Style - you can also get  it from the Telerik.Windows.Controls.Navigation.xaml file. 
In your scenario - your custom control may expose "RadButtonStyle" property (with TargetType RadButton) and you can set it to the predefined ToolBarRadButtonStyle. This ButtonStyle will be applied via TemplateBinding:

<ControlTemplate targettype=local:YourCustomControl>
            ....
           <RadButton Style={TemplateBinding RadButtonStyle}
                    ....

Hope this helps you proceed further.

Regards,
Petar Mladenov
the Telerik team

[Jerome]

Um. Is there anyway to retrieve this style dynamically? So when themes are changed, it applies properly? A ThemeResourceKey or something?

[Petar Mladenov]

Hi Jerome,

 There are no public properties for these predefined styles. But if you use the mentioned implicit styles approach, you will have folder for each theme you use. When changing theme, you merge the resources from this folder in a common resource dictionary that is visible in your MainPage. This way you will be able to directly use the "ToolBarButton" style:

<local:MyCustomButton Style="{StaticResource ToolBarRadButton}" ...

Greetings,
Petar Mladenov
the Telerik team