Silverlight 3,0 Split styles and templates into different files and merge resources

Silverlight 3.0 now support a way to merge resources. So now we can split resources into different files. The following is a example of a simple resource file (ResourceA.xaml):


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

    <Style x:Name="MyButtonStyle" TargetType="Button">
        <Setter Property="Background" Value="red"/>
    </Style>

</ResourceDictionary>


When you create a resource file, make sure the Build Action is set to Resource for the file.

If you want to globally want to merge different resource file you can for example do it on a application level by using the App.xaml file. To merge a Resource file, you need to use the ResourceDictionary object and it’s MergedDictionaries property, which takes ResourceDictionary objects as values. By using the ResourceDictionary’s Source property, you can specify the source for a resource file:


<Application.Resources>

    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="ResourceA.xaml"/>
            <ResourceDictionary Source="ResourceB.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>

</Application.Resources>


You can of course use a resource file on a User Control level:


<UserControl x:Class="SilverlightApplication6.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:m="clr-namespace:SilverlightApplication6.MyControl"
    Width="400" Height="300">
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="ResourceA.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    
    <Grid x:Name="LayoutRoot" Background="White">

        <StackPanel>
            <Button Style="{StaticResource MyButtonStyle}"/>
            <Button Style="{StaticResource MyButtonStyleB}"/>
        </StackPanel>

    </Grid>
</UserControl>


If you only need to “include” on resource file, you don’t need to use the MergedDictionaries property. Here is an example where only one resource file is used:


<UserControl.Resources>
    <ResourceDictionary Source="ResourceA.xaml"/>
</UserControl.Resources>


A resource file can in turn merge other resource files:


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

    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="ResourceB.xaml"/>
    </ResourceDictionary.MergedDictionaries>
    
    <Style x:Name="MyButtonStyle" TargetType="Button">
        <Setter Property="Background" Value="red"/>
    </Style>

</ResourceDictionary>


Now I only want to see a way to skip adding the Style attribute to a control, and instead only use the TargetType attribute on a style, and all types should use that style:


<Style TargetType="Button">
    <Setter Property="Background" Value="red"/>
</Style>

Wouldn’t that be something?

Published Tuesday, March 31, 2009 9:22 PM by Fredrik N

Comments

# Silverlight Travel &raquo; Silverlight 3,0 Split styles and templates into different files and merge resources

Pingback from  Silverlight Travel &raquo; Silverlight 3,0 Split styles and templates into different files and merge resources

# re: Silverlight 3,0 Split styles and templates into different files and merge resources

Thursday, April 09, 2009 11:04 AM by Don Baechtel

The following XAML gets a "value out of range" error on the Source refernce in VSTS 2008 with SL3 Tools installed. The Page.xaml will not display in designe editor.

What is wrong?

<UserControl.Resources>

<ResourceDictionary x:Name="Collection" >

  <ResourceDictionary.MergedDictionaries>

<ResourceDictionary x:Name="dict" Source="/Resources.xaml" />

  </ResourceDictionary.MergedDictionaries>

</ResourceDictionary>

</UserControl.Resources>

# re: Silverlight 3,0 Split styles and templates into different files and merge resources

Thursday, April 16, 2009 5:55 PM by Bryan Campbell

Thanks for showing how to merge several resource dictionaries. Your the first blog I've found that shows this is even possible.

What's the best way to create a resource dictionary in a Silverlight project? When you  add a new item, the only xaml options you get are Silverlight User Control, Silverlight Application Class, Silverlight Page, and Silverlight Child Window.

By the way , I've just been poking around in the Silverlight 3 Control Sample Code and it looks like they do have a way to apply a style using a TargetType.

In ImplicitStyleManagerSample.xaml they use

themingToolkit:ImplicitStyleManager.ApplyMode="OneTime"

themingToolkit:ImplicitStyleManager.ResourceDictionaryUri="Theming/ImplicitStyleManager/ImplicitStyleManagerTheme.xaml"

where xmlns:themingToolkit="clr-namespace:System.Windows.Controls.Theming;assembly=System.Windows.Controls.Theming.Toolkit"

# re: Silverlight 3,0 Split styles and templates into different files and merge resources

Friday, April 17, 2009 12:47 AM by Fredrik N

@Don:

Sorry for the delay.. See if it helps if you remove the "/" before "Resource.xaml".

# re: Silverlight 3,0 Split styles and templates into different files and merge resources

Friday, April 17, 2009 12:50 AM by Fredrik N

@Bryan Campbell:

To create a ResourceDictionary file, you can create an empty file and rename it, or just take a UserControl and replace the elements and remove the code-behind. There is no item template for a ResourceDictionary at the moment.

# re: Silverlight 3,0 Split styles and templates into different files and merge resources

Thursday, November 12, 2009 10:17 AM by Vishal

Exactly what I was looking for. Thanks Fred :)

# re: Silverlight 3,0 Split styles and templates into different files and merge resources

Tuesday, February 09, 2010 1:54 AM by Ruwan

Thanx -

Leave a Comment

(required) 
(required) 
(optional)
(required)