Silverlight how-to: Inherit from an Implicit Style

Silverlight 4Since Silverlight 4 you can use Implicit Styles:

Basically it is just a style defined in resource without a key. As you don’t have a key you may wonder how you could inherit (BasedOn) from an implicit style?

Surprisingly lots of people are not aware of this, so here is how you can inherit from an implicit style:


1. Add a key to your implicit style (so it won’t be implicit anymore… but wait)

Microsoft use this technique in the Silverlight Toolkit, and their naming convention is DefaultXXXStyle.

So for a Button you would create DefaultButtonStyle like this sample:

<Style TargetType="Button" x:Key="DefaultButtonStyle">

    <Setter Property="Background" Value="BlueViolet"/>

    <Setter Property="Foreground" Value="White"/>

    <Setter Property="FontFamily" Value="Verdana"/>

    <Setter Property="FontSize" Value="11"/>

    <Setter Property="FontWeight" Value="SemiBold"/>


2. Create a new Implicit Style based on this style:

<Style TargetType="Button" BasedOn="{StaticResource DefaultButtonStyle}" />

Now all your button will take DefaultButtonStyle as their implicit style.


3. The beauty is you can now create other Styles also based on DefaultButtonStyle, which make your new Styles inherit from the “Implicit Style”!

<Style TargetType="Button" x:Key="BigButtonStyle" BasedOn="{StaticResource DefaultButtonStyle}">

    <Setter Property="FontFamily" Value="Arial Black"/>

    <Setter Property="FontSize" Value="32"/>



<Style TargetType="Button" x:Key="BigRedButtonStyle" BasedOn="{StaticResource BigButtonStyle}">

    <Setter Property="Foreground" Value="Red"/>



Which gives me this Styles hierarchy:

Silverlight inheriting from implicit style