Andy asked me how he could take a button we built and reuse it in other forms or even other apps.
Let me first explain the code that was generated as a result of the exercise in Episode 2.
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xml:lang="en-US"
x:Class="Window1"
x:Name="Window"
Title="Window1"
Width="640" Height="480" Background="#FF000000">
<!--This can be Grid.Resources or Application.Resources or anything, depending on what
object’s ResourceDictionary you want this to be stored -->
<Window.Resources>
<!-- This first resource is the brush that was created -->
<LinearGradientBrush x:Key="AndysRedBrush" EndPoint="0.512,1.023" StartPoint="0.512,0.205">
<GradientStop Color="#A0923030" Offset="0"/>
<GradientStop Color="#00FFFFFF" Offset="0.438"/>
<GradientStop Color="#33861A1A" Offset="0.433"/>
</LinearGradientBrush>
<!-- This second resource is the Style generated for the glass button -->
<Style BasedOn="{x:Null}" TargetType="{x:Type Button}">
<Setter Property="Template">
<!-- The template property has the physical design of the control -->
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle RadiusX="8.5" RadiusY="8.5" x:Name="rectangle">
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.512,1.023" StartPoint="0.512,0.205">
<GradientStop Color="#A0FFFFFF" Offset="0"/>
<GradientStop Color="#00FFFFFF" Offset="0.438"/>
<GradientStop Color="#33FEFEFE" Offset="0.433"/>
</LinearGradientBrush>
</Rectangle.Fill>
<Rectangle.Stroke>
<LinearGradientBrush EndPoint="0.464,0.98" StartPoint="0.464,0.065">
<GradientStop Color="#CCFFFFFF" Offset="0"/>
<GradientStop Color="#CCFFFFFF" Offset="1"/>
<GradientStop Color="#77FFFFFF" Offset="0.51"/>
</LinearGradientBrush>
</Rectangle.Stroke>
</Rectangle>
<ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True"/>
</Grid>
<!-- The ControlTemplate.Triggers collection contains the criteria based property triggers that change the visual state of the button -->
<ControlTemplate.Triggers>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle" Value="{DynamicResource AndysRedBrush}"/>
</Trigger>
<Trigger Property="IsDefaulted" Value="True">
<Setter Property="Fill" TargetName="rectangle" Value="{DynamicResource AndysRedBrush}"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<LinearGradientBrush EndPoint="0.512,1.023" StartPoint="0.512,0.205">
<GradientStop Color="#A0FFFFFF" Offset="0"/>
<GradientStop Color="#00FFFFFF" Offset="0.438"/>
<GradientStop Color="#335835FA" Offset="0.433"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Opacity" TargetName="rectangle" Value="0.73"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False"/>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- The resources end here -->
</Window.Resources>
<Grid x:Name="LayoutRoot">
<Button HorizontalAlignment="Left" Margin="136,109,0,0" VerticalAlignment="Top" Width="124" Height="44" Content="Button" Foreground="#FFFFFFFF"/>
</Grid>
</Window>
Go to FILE > NEW ITEM and add a new ResourceDictionary. It will look something like this:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!-- Resource dictionary entries should be defined here. -->
</ResourceDictionary>
Now simply take the entire <Style></Style> tag (and accompanying resources like the LinearGradientBrush) and paste them inside the ResourceDictionary tag. This file can now be used inside the same project or added to other projects and the style will be added automatically.
The new ResourceDictionary file should show up in the Resources pane in Blend, and you can drag-drop styles from there.