What could be preventing styles from applying to a Silverlight control at runtime?

Question

I wrote a simple Silverlight application. My styles are shown correctly at design time, but when I try to run the application, any styles in resource dictionary file which are merged in app.xaml file are not applied to any control at runtime.

Actually, only UserControl styles don't seem to apply. But the rest are working (like the Button on the page). What could be causing this problem and how can I fix it?

My code is something like this:

Styles.xaml:

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Style TargetType="UserControl">
        <Setter Property="FlowDirection" Value="RightToLeft" />
        <Setter Property="FontFamily" Value="Tahoma" />
        <Setter Property="Background" Value="Aqua" />
    </Style>
    <Style TargetType="Button" >
        <Setter Property="Background" Value="Aqua" />
    </Style>
</ResourceDictionary>

App.xaml:

<Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
             x:Class="Silverlight.Test._01.App"
             >
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="Styles.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

MainPage.xaml:

<UserControl x:Class="Silverlight.Test._01.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">

    <Grid x:Name="LayoutRoot" Background="White">
        <Button Content="This is a test" Height="23" HorizontalAlignment="Left" Margin="12,12,0,0" Name="button1" VerticalAlignment="Top" Width="220"   />
        <sdk:Label   Height="28" HorizontalAlignment="Left" Margin="12,6,0,0" Name="label1" VerticalAlignment="Top" Width="351" Content="Test label" />
    </Grid>
</UserControl>

Telling us that you've asked this question before without any results is only helpful if you tell us specifically what the previous suggestions were, and why they didn't work for you. — Cody Gray - on strike, Jan 02 '11 at 06:55

score 4 · Accepted Answer · answered Jan 02 '11 at 23:22

At least one reason this doesn't work is because you never actually create an instance of UserControl. You actually create an instance of Silverlight.Test._01.MainPage.

In addition unlike Button the UserControl does not set the DefaultStyleKey property on the control to UserControl in fact attempting to set a value into DefaultStyleKey in code behind will result in an exception.

There is no general workaround for this. The closest you can get is to change the default style to a standard keyed resource:-

<Style x:Key="UserControlDefaultStyle" TargetType="UserControl">
    <Setter Property="FlowDirection" Value="RightToLeft" />
    <Setter Property="FontFamily" Value="Tahoma" />
    <Setter Property="Background" Value="Aqua" />
</Style>

Now change your usercontrol xaml to look like:-

<UserControl x:Class="Silverlight.Test._01.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
    Style="{StaticResource UserControlDefaultStyle}"    
>

    <Grid x:Name="LayoutRoot" Background="{Binding Parent.Background, ElementName=LayoutRoot}">
        <Button Content="This is a test" Height="23" HorizontalAlignment="Left" Margin="12,12,0,0" Name="button1" VerticalAlignment="Top" Width="220"   />
        <sdk:Label   Height="28" HorizontalAlignment="Left" Margin="12,6,0,0" Name="label1" VerticalAlignment="Top" Width="351" Content="Test label" />
    </Grid>
</UserControl>

Note that this isn't a general solution since you need to add the additional Style attribute to each UserControl you create.

Also note the binding on LayoutRoot Background property. The UserControl.Background property actually does nothing, you pass this value on to the child control for it have any effect.

What could be preventing styles from applying to a Silverlight control at runtime?

1 Answers1