c# - Changing source of an Image inside of a Button template -

i have button image defined in xaml this:

<button x:name="buttontest">     <button.template>         <controltemplate>                 <border horizontalalignment="center" verticalalignment="center" >                     <image x:name="imagetest" width="57" height="81" source="/images/sample.png" />                 </border>         </controltemplate>     </button.template> </button> 

how can change source of image when button clicked?

i toggle button instead of button since has ischecked property can base image switch on.

first you'll need converter go true/false image path, may make generic 1 can use on , over, add project , setup xmlns point in xaml.

public class booleanswitchconverter : dependencyobject, ivalueconverter     {         public object truevalue         {             { return (object)getvalue(truevalueproperty); }             set { setvalue(truevalueproperty, value); }         }         public static readonly dependencyproperty truevalueproperty =             dependencyproperty.register("truevalue", typeof(object), typeof(booleanswitchconverter), new propertymetadata(null));          public object falsevalue         {             { return (object)getvalue(falsevalueproperty); }             set { setvalue(falsevalueproperty, value); }         }         public static readonly dependencyproperty falsevalueproperty =             dependencyproperty.register("falsevalue", typeof(object), typeof(booleanswitchconverter), new propertymetadata(null));          public object convert(object value, type targettype, object parameter, system.globalization.cultureinfo culture)         {             return ((bool)value) ? truevalue : falsevalue;         }          public object convertback(object value, type targettype, object parameter, system.globalization.cultureinfo culture)         {             throw new notimplementedexception();         }     } 

then replace button toggle button using binding on ischecked pick image.

<togglebutton>             <togglebutton.template>                 <controltemplate targettype="togglebutton">                     <border>                         <image>                             <image.source>                                 <binding path="ischecked" relativesource="{relativesource templatedparent}">                                     <binding.converter>                                         <local:booleanswitchconverter                                              truevalue="1.jpg"                                              falsevalue="2.jpg"/>                                     </binding.converter>                                 </binding>                             </image.source>                         </image>                     </border>                 </controltemplate>             </togglebutton.template>         </togglebutton>