c# - How to Pass Image to a Button in UserControl using Dependency Property -

i have created usercontrol. has button , textblock. want pass image button using dependency property. when try call usercontrol in other page, showing error. code..

user control.xaml:

<usercontrol x:class="....usercontrol"          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/blend/2008"                      mc:ignorable="d"           d:designheight="300" d:designwidth="300" > <grid>     <grid.rowdefinitions>         <rowdefinition height="auto" />         <rowdefinition height="auto" />     </grid.rowdefinitions>      <border grid.row="0"         name="bormain"         style="{staticresource buttonimagetextborderstyle}"         mouseenter="bormain_mouseenter"         mouseleave="bormain_mouseleave"         previewmouseleftbuttondown="bormain_mouseleftbuttondown" >         <visualstatemanager.visualstategroups>             <visualstategroup name="mousestates">                 <visualstate name="mouseenter">                     <storyboard>                         <coloranimation to="black"                           duration="0:0:00.1"                           storyboard.targetname="bormain"                           storyboard.targetproperty="borderbrush.color" />                         <coloranimation to="black"                           duration="0:0:00.1"                           storyboard.targetname="bormain"                           storyboard.targetproperty="background.color" />                         <thicknessanimation to="4,1,4,4"                               duration="0:0:00.1"                               storyboard.targetname="bormain"                               storyboard.targetproperty="margin" />                     </storyboard>                 </visualstate>                 <visualstate name="mouseleave" />                 <visualstategroup.transitions>                     <visualtransition to="mouseleave" />                     <visualtransition to="mouseenter" />                 </visualstategroup.transitions>             </visualstategroup>         </visualstatemanager.visualstategroups>         <button content="{binding path=appbarcontent}"                            style="{staticresource buttonimagetextimagestyle}" />     </border>      <textblock grid.row="1"            name="tbtext"            style="{staticresource buttonimagetexttextblockstyle}"            text="{binding path=text}" />    </grid> </usercontrol> 

usercontrol.xaml.cs:

 [defaultevent("click")]    public partial class systemunitusercontrol : usercontrol    {       public usercontrol()       {         initializecomponent();         this.datacontext = this;       }     #region text property     public string text     {         { return (string)getvalue(textproperty); }         set         {             setvalue(textproperty, value);             if (string.isnullorempty(value))                 tbtext.visibility = visibility.collapsed;         }     }       #region appbarcontent property     public image appbarcontent     {         { return (image)getvalue(appbarcontentproperty); }         set { setvalue(appbarcontentproperty, value); }     }        public static readonly dependencyproperty appbarcontentproperty =         dependencyproperty.register("appbarcontent", typeof(image),  typeof(systemunitusercontrol), null);     #endregion      #region mouseleftdown event     private void bormain_mouseleftbuttondown(object sender, mousebuttoneventargs e)     {         raiseclick(e);     }     #endregion      #region click event procedure     public delegate void clickeventhandler(object sender, routedeventargs e);     public event clickeventhandler click;      protected void raiseclick(routedeventargs e)     {         if (null != click)             click(this, e);     }     #endregion      #region visual state animations     private void bormain_mouseenter(object sender, mouseeventargs e)     {         visualstatemanager.gotoelementstate(bormain, "mouseenter", true);     }      private void bormain_mouseleave(object sender, mouseeventargs e)     {         visualstatemanager.gotoelementstate(bormain, "mouseleave", true);     }     #endregion 

i calling usercontrol in other page.

window1.xaml:

...  xmlns:my="clr-namespace:....usercontrols" ...           <my:usercontrol x:name="actionrectduct"                             appbarcontent="f:\..\..\assets\offline.jpg"                          text="button 1" />                          

its not going page. showing following error..

a first chance exception of type 'system.windows.markup.xamlparseexception' occurred in presentationframework.dll

additional information: 'set property 'unitusercontrol.appbarcontent' threw exception.' line number '38' , line position '41'.

i want pass image on appbarcontent.. how can this??

here how can same code

     <my:usercontrol x:name="actionrectduct"                      text="button 1" >             <my:usercontrol.appbarcontent>              <image source="f:\..\..\assets\offline.jpg" />          </my:usercontrol.appbarcontent>      </my:usercontrol> 

instead of passing string appbarcontent property accepts image, we'll pass instance of image having source desired file. long source correct you'll able desired image in systemunitusercontrol