Problems loading images in a Silverlight ControlTemplate

I have problems accessing images in the ControlTemplate of a "Silverlight Templated Control" I implemented. The Style for my control called "ControlDragger" is the following:

<!-- ControlDragger Menu button style -->
<Style x:Key="MenuButtonStyle" TargetType="Button">
    <Setter Property="Margin" Value="5,0" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid>
                    <ContentPresenter HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<!-- ControlDragger -->
<Style TargetType="core:ControlDragger">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="core:ControlDragger">
                <Border x:Name="ControlDraggerRoot"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Background="{TemplateBinding Background}"
                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                        VerticalAlignment="{TemplateBinding VerticalAlignment}"
                        MinHeight="{TemplateBinding MinHeight}"
                        MinWidth="{TemplateBinding MinWidth}"
                        MaxHeight="{TemplateBinding MaxHeight}"
                        MaxWidth="{TemplateBinding MaxWidth}"
                        Height="{TemplateBind开发者_运维技巧ing Height}"
                        Width="{TemplateBinding Width}">
                    <Grid Background="Transparent">
                        <Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderBrush="#DBDBDB" BorderThickness="1" >
                            <Border.Background>
                                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                    <GradientStop Color="#F7F7F7" Offset="0" />
                                    <GradientStop Color="#FDFDFD" Offset="1" />
                                </LinearGradientBrush>
                            </Border.Background>
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="36" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>

                                <!-- Title bar plus drag start -->
                                <Border x:Name="DragStartElement" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="0"
                                        Background="Transparent">
                                    <TextBlock x:Name="Headline" FontSize="14" Margin="14,5,0,0" />
                                </Border>

                                <!-- Clickable icons -->
                                <Border Grid.Column="1" HorizontalAlignment="Right" VerticalAlignment="Top" Height="26" CornerRadius="13" Margin="0,5,5,0"
                                        BorderThickness="1" BorderBrush="#9EA9B3">
                                    <Border.Background>
                                        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                            <GradientStop Color="#EDECEE" Offset="0" />
                                            <GradientStop Color="#FBFBFC" Offset="1" />
                                        </LinearGradientBrush>
                                    </Border.Background>
                                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Margin="5,0">
                                        <Button x:Name="AddIcon" Style="{StaticResource MenuButtonStyle}">
                                            <Image Source="Icon_small_add.png" Stretch="None" />
                                            <!--
                                            <TextBlock Text="A" />
                                            -->
                                        </Button>
                                        <Button x:Name="DeleteIcon" Style="{StaticResource MenuButtonStyle}">
                                            <TextBlock Text="D" />
                                            <!--
                                            <Image Source="Icon_small_delete.png" Stretch="None" />
                                            -->
                                        </Button>
                                    </StackPanel>
                                </Border>

                                <!-- Content holder -->
                                <Border Grid.Row="1" Grid.ColumnSpan="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="14,0,14,9">
                                    <ContentPresenter/>
                                </Border>

                            </Grid>
                        </Border>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

This template contains an add and a delete button which are re-styled as well. Once I put a TextBlock as a content of either of the button the content - the TextBlock - will be displayed. If I replace the TextBlock with an Image then the content just disappears. The images are in the same folder as the "Generic.xaml" which contains the posted XAML. I have other png files in the same folder and I access them in other XAML files also in the same folder outside a ControlTemplate (in a UserControl) and they work.

Here are the things I tried so far to solve this problem which didn't work either:

1) Copying the pictures into the same folder as the implementation where the ControlDragger.cs is

2) Accessing the buttons via their name in "OnApplyTemplate" and try to set the images via code

3) Load an alternative png file to ensure that the used png file isn't corrupt.

I also tried to access a random image from the internet using Source="http://..." and this worked. For debugging reasons, I also implemented the ImageFailed event on the pictures and attached it in "OnApplyTemplate". And indeed, it fails loading but the event parameters don't tell me why it didn't load. Does anybody has an idea if I missed something?

Try this(even if your image and style in the same assembly):

"/Assembly;Component/{Relative Path}/Icon_small_add.png"

Assembly - is assembly name in which Icon_small_add.png image contains {Relative Path} - folders path to your image

e.g. "/ControlsLib;Component/Resources/Images/Icon_small_add.png"

Thanks, that fixed it. And it also explains why I had these problems.

I implemented my control in a different assembly than the application. So the application loaded a page containing my controls and rendered them. But images are loaded asynchronously in Silverlight and by this stage my application assembly couldn't find the images anymore.

So specifying the assembly in the Image.Source property solved the problem.