Image Source In ControlTemplate WPF - wpf

Question

I have a ControlTemplate which is for the Button control, in the ControlTemplate I have Image control which is used to displayed in the button, Now I want to set the Image Source at runt time as I have to copy paste the ControlTemplate for each of the button to set new image for new button.
Thanks in advance.

Answer 1

Maybe this is what you are looking for:
http://www.hardcodet.net/2009/01/create-wpf-image-button-through-attached-properties
http://blogs.msdn.com/knom/archive/2007/10/31/wpf-control-development-3-ways-to-build-an-imagebutton.aspx
http://social.msdn.microsoft.com/Forums/en-US/vswpfdesigner/thread/8ba13699-7f7f-4ab6-8e3e-f7d787355d81
Hope this helps.
Regards,
Mihir Gokani

Answer 2

Generally speaking there are two ways you can set an image source at run time (the code samples below are in pseudo-code and would not compile):
1) In XAML using binding where the source of the binding will be some object's property containing the image source (this is the scenario Slugster was talking about):
This would be your object:
public class ViewModel
{
public string ImageURI {get;set;}
}
and will be presented by XAML where you have your button with image, and image source is set through binding:
<Image Source="{Binding Source=ViewModel; Path=ImageURI}"/>
2) By setting the image source from code-behind.
this will be your XAML where you have the button with image:
<Image x:Name="theImage"/>
and in the code-behind you set the source of that image:
theImage.Source = new BitmapImage(new Uri("yor image uri"));

Answer 3

You can access an item from inside the template by using the GetTemplateChild(string childName) method (with the name of your element as defined in the XAML), for example - If your image was defined like this:
<Image x:Name="MyImage" Stretch="Fill" />
then you would call this method like this:
Image myImage = GetTemplateChild("MyImage") as Image;
if (myImage != null)
{
myImage.Source = "/Images/MyPicture.jpg";
}
Note: You will not be able to use this method until AFTER OnApplyTemplate has been called for the control.

Answer 4

<Button x:Class="FunitureCtlLib.PressedImageButton"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="uc"><!--MinHeight="25" MinWidth="50"-->
<Button.Template>
<ControlTemplate>
<Grid>
<Image Name="imgDefault" Source="{Binding Path=DefaultImageSource,ElementName=uc}" Stretch="{Binding Path=ImageStretch,ElementName=uc}"></Image>
<ContentPresenter Content="{TemplateBinding Property=ContentControl.Content}" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="Button.IsPressed" Value="True">
<Setter Property="Image.Source" TargetName="imgDefault" Value="{Binding Path=PressedImageSource,ElementName=uc}"></Setter>
<Setter Property="UIElement.Effect">
<Setter.Value>
<DropShadowEffect BlurRadius="10" Color="Black" Direction="0" Opacity="0.6" RenderingBias="Performance" ShadowDepth="0" />
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="Button.IsMouseOver" Value="True">
<Setter Property="UIElement.Effect">
<Setter.Value>
<DropShadowEffect BlurRadius="10" Color="White" Direction="0" Opacity="0.6" RenderingBias="Performance" ShadowDepth="0" />
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Button.Template>
/// <summary>
/// ImageButton.xaml
/// </summary>
public partial class PressedImageButton : Button
{
#region dependency property
public static readonly DependencyProperty DefaultImageSourceProperty = DependencyProperty.Register("DefaultImageSource", typeof(ImageSource), typeof(PressedImageButton), new PropertyMetadata(null, new PropertyChangedCallback(DefaultImageSourceChangedCallback)));
public static readonly DependencyProperty PressedImageSourceProperty = DependencyProperty.Register("PressedImageSource", typeof(ImageSource), typeof(PressedImageButton), new PropertyMetadata(null, new PropertyChangedCallback(PressedImageSourceChangedCallback)));
public static readonly DependencyProperty ImageStretchProperty = DependencyProperty.Register("ImageStretch", typeof(Stretch), typeof(PressedImageButton), new PropertyMetadata(Stretch.None, new PropertyChangedCallback(ImageStretchChangedCallback)));
#endregion
#region callback
private static void DefaultImageSourceChangedCallback(object sender, DependencyPropertyChangedEventArgs e)
{
if (sender != null && sender is PressedImageButton)
{
PressedImageButton imgbtn = sender as PressedImageButton;
imgbtn.OnDefaultImageSourceChanged(e.OldValue, e.NewValue);
}
}
private static void PressedImageSourceChangedCallback(object sender, DependencyPropertyChangedEventArgs e)
{
if (sender != null && sender is PressedImageButton)
{
PressedImageButton imgbtn = sender as PressedImageButton;
imgbtn.OnPressedImageSourceChanged(e.OldValue, e.NewValue);
}
}
private static void ImageStretchChangedCallback(object sender, DependencyPropertyChangedEventArgs e)
{
if (sender != null && sender is PressedImageButton)
{
PressedImageButton imgbtn = sender as PressedImageButton;
imgbtn.OnImageStretchChanged(e.OldValue, e.NewValue);
}
}
#endregion
#region public property
/// <summary>
///
/// </summary>
public ImageSource DefaultImageSource
{
get
{
return this.GetValue(DefaultImageSourceProperty) as ImageSource;
}
set
{
this.SetValue(DefaultImageSourceProperty, value);
}
}
/// <summary>
///
/// </summary>
public ImageSource PressedImageSource
{
get
{
return this.GetValue(PressedImageSourceProperty) as ImageSource;
}
set
{
this.SetValue(PressedImageSourceProperty, value);
}
}
/// <summary>
///
/// </summary>
public Stretch ImageStretch
{
get
{
return (Stretch)this.GetValue(ImageStretchProperty);
}
set
{
this.SetValue(ImageStretchProperty, value);
}
}
#endregion
#region protected method
protected void OnDefaultImageSourceChanged(object oldValue, object newValue)
{
//viewmodel.DefaultImageSource = newValue as ImageSource;
this.DefaultImageSource = newValue as ImageSource;
}
protected void OnPressedImageSourceChanged(object oldValue, object newValue)
{
//viewmodel.PressedImageSource = newValue as ImageSource;
this.PressedImageSource = newValue as ImageSource;
}
protected void OnImageStretchChanged(object oldValue, object newValue)
{
//viewmodel.ImageStretch = (Stretch)newValue;
this.ImageStretch = (Stretch)newValue;
}
#endregion
#region construct
public PressedImageButton()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(PressedImageButton_Loaded);
}
#endregion
#region private event
void PressedImageButton_Loaded(object sender, RoutedEventArgs e)
{
}
#endregion
}