problem using custom control library!!!

Question

I have used microsoft expression designer to build a custom wpf control library. I have made an image button as described in the tutorial that comes with the software (expression designer). I have then added the .dll to a wpf application and could use the imagebutton control but the styling is not applied. I need to manually copy the imagebutton content template in order to be able to apply it in the WPF application. Do I, maybe, need to reference something else except the control library dll?

The XAML code for the imageButton control is as follows:
<Grid
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 xmlns:d="http://schemas.microsoft.com/expression/interactivedesigner/2006"
 mc:Ignorable="d"
 Background="#FFFFFFFF"
 x:Name="DocumentRoot"
 x:Class="MeiRouWPFControlLibrary.Scene1"
 Width="640" Height="480" xmlns:MeiRouWPFControlLibrary="clr-namespace:MeiRouWPFControlLibrary">

 <Grid.Resources>
  <Storyboard x:Key="OnLoaded"/>
  <ControlTemplate x:Key="ImageButtonTemplate" TargetType="{x:Type ButtonBase}">
   <Grid x:Name="Grid">
    <Grid.ColumnDefinitions>
     <ColumnDefinition Width="0.35*"/>
     <ColumnDefinition Width="0.65*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
     <RowDefinition/>
    </Grid.RowDefinitions>
    <Rectangle Fill="{TemplateBinding Background}" RadiusX="5" RadiusY="5" Margin="0,0,0,0" x:Name="Rectangle" Grid.ColumnSpan="2"/>
    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,0" x:Name="ContentPresenter" Grid.Column="1" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
    <Image Margin="2,2,2,2" x:Name="arrow_up_16_gif" Source="arrow-up_16.gif"/>
   </Grid>
   <ControlTemplate.Triggers>
    <Trigger Property="IsKeyboardFocused" Value="True"/>
    <Trigger Property="ToggleButton.IsChecked" Value="True">
     <Setter Property="Fill" Value="sc#1, 0.224158421, 0.164947689, 0.84801" TargetName="Rectangle"/>
     <Setter Property="Opacity" Value="0.51134759474427349" TargetName="Rectangle"/>
    </Trigger>
    <Trigger Property="IsEnabled" Value="False">
     <Setter Property="Foreground" Value="#FFADADAD"/>
    </Trigger>
   </ControlTemplate.Triggers>
  </ControlTemplate>
 </Grid.Resources>

 <Grid.Triggers>
  <EventTrigger RoutedEvent="FrameworkElement.Loaded">
   <BeginStoryboard x:Name="OnLoaded_BeginStoryboard" Storyboard="{DynamicResource OnLoaded}"/>
  </EventTrigger>
 </Grid.Triggers>
 
 <Grid.ColumnDefinitions>
  <ColumnDefinition/>
 </Grid.ColumnDefinitions>
 <Grid.RowDefinitions>
  <RowDefinition/>
 </Grid.RowDefinitions>
 <MeiRouWPFControlLibrary:ImageButton HorizontalAlignment="Left" VerticalAlignment="Top" Margin="121,108,0,0" Width="195" Height="52" x:Name="ImageButton" Template="{DynamicResource ImageButtonTemplate}" Content="ImageButton"/>
</Grid>

And content of the codebehind file is:
using System;
using System.IO;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Navigation;

namespace MeiRouWPFControlLibrary
{
 public partial class Scene1
 {
  
  public Scene1()
  {
   this.InitializeComponent();

   // Insert code required on object creation below this point.
  }
 }
 
 public class ImageButton : Button
     {
        public ImageSource Source
        {
            get { return base.GetValue(SourceProperty) as ImageSource; }
            set { base.SetValue(SourceProperty, value); }
        }
        public static readonly DependencyProperty SourceProperty = DependencyProperty.Register("Source", typeof(ImageSource), typeof(ImageButton));
     }
}

Also once I apply the resource to a button (after copy paste ImageButton contetnt template in the <window.resource> ) it always shows the same image, is there a way I can select which image a button displays. Basically, for each imageButton I need different image.

Answer 1

I've also tried adding the resource (contained in the control library) to the project that uses the control library, but when I click "link to resource" it says no dictionaries present.

Any help is greatly appreciated.

Sincerely,
Marko Vuksanovic.

Answer 2

how does you XMAL look like in the window

looks like this is hardocded

 <Image Margin="2,2,2,2" x:Name="arrow_up_16_gif" Source="arrow-up_16.gif"/>
change it to

 <Image Margin="2,2,2,2" x:Name="arrow_up_16_gif" Source="{TemplateBinding Source}"/>

Answer 3

Where is the content of your generic.xaml? That is where the style for your custom control should go. The XAML you provided is basically a page or grid that styles the ImageButton in the context of the Grid.

Also, where is the XAML for your application that is trying to use the control?

Both of these will help us better understand what is going wrong and point you in the right direction.

Answer 4

Would you please tell me what a generic.xaml is?

The XAML of the application is in the root of the project. The custom imagebutton control is in another project called CustomWPFControlLibrary is also in the root of that project.

Thanks in advance for the help.