WPF How to enhance or inherit two style for one button

Question

Based from this link How do you completely remove the button border in wpf? The border of button can be remove completely by the following way which works exactly like what I want:

<Button Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">SomeText</Button>

Now I want to define some additional style in my ResourceDictionary but I'm not sure how to refer to another style. Usually I refer to custom style thru following way:

 <Button Style="someSelfDefinedStyle">SomeText</Button>

What can I do if I want to remove the border of button and adding additional styles on top of it?

Update:

I've also tried the following way:

<Style x:Key="someSelfDefinedStyle" BasedOn="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">
    <!--Add additional styling here-->
</Style>

And its giving me the below error:

'System.Windows.SystemThemeKey' cannot be converted to type 'System.Windows.Style'

Use [snoop](https://snoopwpf.codeplex.com/) to find the layout, and then you can just copy paste and play around with it ... — Noctis, Nov 26 '13 at 10:21
http://stackoverflow.com/questions/16096/how-to-apply-multiple-styles-in-wpf — Monika, Nov 26 '13 at 10:22

Sheridan · Accepted Answer · 2013-11-26T10:58:41.450

You need to use the Style.BasedOn property to do that for you:

<Style x:Key="AnotherStyle" BasedOn="{StaticResource someSelfDefinedStyle}">
    <!--Add additional styling here-->
</Style>

UPDATE >>>

To use a default Style as the BasedOn property value, you could do this:

<Style x:Key="AnotherStyle" BasedOn="{StaticResource {x:Type Button}}">
    <!--Add additional styling here-->
</Style>

However, you cannot do that with your ToolBar.ButtonStyleKey as it is an object and not a Style. The DefaultStyleKey for an element is used to lookup the default Style for the related element at runtime.

If you to want further styling on your Button, you have two options... the first is to define a new ControlTemplate for the Button and the second is to put a Border element around the Button and Style that instead:

<Border CornerRadius="8" BorderThickness="1" Padding="5,0" HorizontalAlignment="Center" VerticalAlignment="Center">
    <Button Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">SomeText</Button>
    <Border.Style>
        <Style>
            <Setter Property="Border.BorderBrush" Value="Black" />
            <Style.Triggers>
                <Trigger Property="Border.IsMouseOver" Value="True">
                    <Setter Property="Border.BorderBrush" Value="Gray" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Border.Style>
</Border>

But then of course... you're kind of back where you started.

WPF How to enhance or inherit two style for one button

1 Answers1