Dear visitor, thanks for stopping by! If you want, you can follow all updates on Snowball.be via RSS. You can also follow me on Twitter or Facebook. More interesting posts from other Microsoft Regional Directors can be found at The Region.
Gill Cleeren     .net | Silverlight | Silverlight Advent Calendar | sl4     December 20, 2009    

In the before-last post of my Silverlight Advent Calendar, I would like to spend some time with a Silverlight 3 feature that’s most helpful in real world projects: merged resource dictionaries. By most helpful, I mean that in real applications, resource files can become really really big. Files of 1000 lines of pure mark-up are no exception and are really hard to find your way in.

Silverlight 3 added support for merged dictionaries. Basically, using these, we can split resources over several files, dictionaries. Using them though is nothing different than using resources located in App.xaml or Resources of the current page/control.

Let’s take a look at using these merged resource dictionaries. I created some styles to style the ChristmasSong application we have been using a few times already.

 

image

In the beginning of this series, we already looked at implicit styles. For this application, I’m defining a few of these, meaning that this very project will only work for Silverlight 4. Of course, the merged dictionary function works also in Silverlight 3.

To define a resource dictionary, in the project, we need to add a XAML file (either via creating an empty text file and renaming the extension or creating a new user control and deleting the *.cs file). In this file, we can create a ResourceDictionary element. Below is the XAML code for the implicit styles, which I grouped into a file called DefaultStyles.xaml. I created a default style for a Button, TextBlock and TextBox.

<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style TargetType="Button">
        <Setter Property="Foreground" Value="Black" />
        <Setter Property="Background" Value="Red" />
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="FontSize" Value="15" />
        <Setter Property="HorizontalAlignment" Value="Center"></Setter>
        <Setter Property="VerticalAlignment" Value="Center"></Setter>
    </Style>
 
    <Style TargetType="TextBlock">
        <Setter Property="Foreground" Value="Green" />
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="FontSize" Value="15" />
        <Setter Property="HorizontalAlignment" Value="Left"></Setter>
        <Setter Property="VerticalAlignment" Value="Center"></Setter>
        <Setter Property="Margin" Value="2"></Setter>
    </Style>
 
    <Style TargetType="TextBox">
        <Setter Property="Width" Value="150" />
        <Setter Property="FontSize" Value="15" />
        <Setter Property="HorizontalAlignment" Value="Center"></Setter>
        <Setter Property="VerticalAlignment" Value="Center"></Setter>
        <Setter Property="Margin" Value="2"></Setter>
    </Style>
</ResourceDictionary>

Next, I created a second ResourceDictionary which has just one Style, designed for the title, in a file called SpecificStyles.

<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style TargetType="TextBlock" x:Key="TitleStyle">
        <Setter Property="Foreground" Value="Red" />
        <Setter Property="FontStyle" Value="Italic"></Setter>
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="FontSize" Value="28" />
        <Setter Property="HorizontalAlignment" Value="Center"></Setter>
        <Setter Property="VerticalAlignment" Value="Center"></Setter>
    </Style>
</ResourceDictionary>

Now we need to let our application know about these resources. To do so, I have in the App.xaml added the following code. In the MergedDictionaries element, we link the seperate XAML files.

<Application 
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  x:Class="SLMergedDictionaries.App"
  >
  <Application.Resources>
    <ResourceDictionary>
      <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary 
          Source="/SLMergedDictionaries;component/DefaultStyles.xaml">
        </ResourceDictionary>
        <ResourceDictionary 
          Source="/SLMergedDictionaries;component/SpecificStyles.xaml">
        </ResourceDictionary>
      </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
  </Application.Resources>
</Application>

We can now use the styles declared in the dictionaries just like we would do with regular defined styles.

The complete sample can be downloaded here: SLMergedDictionaries.zip (310.39 KB)

  Posted on: Monday, December 21, 2009 12:46:11 AM (Romance Standard Time, UTC+01:00)   |   Comments [0]
         
Comments are closed.
3/13/2010   12:59:15 PM