wpf - How to redraw a button from code behind to show new icon -
i have xaml style this:
<style x:key="imagetextbuttonstyle" targettype="button"> <setter property="template"> <setter.value> <controltemplate targettype="button"> <border name="buttonstyleborder" cornerradius="9" background="#ff9e9fa3"> <grid margin="0,0,0,0"> <grid.columndefinitions> <columndefinition width="60"/> <columndefinition width="*"/> </grid.columndefinitions> <image source="{binding tag, relativesource={relativesource templatedparent}}" verticalalignment="stretch" horizontalalignment="stretch" margin="10"/> <label content="{templatebinding content}" grid.column="1" fontsize="12.5" verticalalignment="center" horizontalalignment="center" margin="0"/> </grid> </border> </controltemplate> </setter.value> </setter> </style> i use this:
<button x:name="btn_startstop" tag="start.png" content="start recording" style="{staticresource imagetextbuttonstyle}" grid.row="0" grid.column="0" margin="12,10,10,10" horizontalalignment="stretch" verticalalignment="stretch" click="btn_startstop_onclick" /> what in click handler change image being shown start.png stop.png. tried this, appently wrong sice blank spot , not stop.png image.
btn_startstoprecording.setresourcereference(tagproperty,"stop.png"); btn_startstoprecording.invalidatevisual(); how should doing this?
i suggest use togglebutton instead of button, , set checked , unchecked states using visualstatemanager, example below:
<style targettype="togglebutton"> <setter property="template"> <setter.value> <controltemplate targettype="togglebutton"> <grid> <visualstatemanager.visualstategroups> <visualstategroup x:name="checkstates"> <visualstate x:name="checked"> <storyboard> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="start" storyboard.targetproperty="opacity"> <splinedoublekeyframe keytime="00:00:00" value="0" /> </doubleanimationusingkeyframes> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="stop" storyboard.targetproperty="opacity"> <splinedoublekeyframe keytime="00:00:00" value="1" /> </doubleanimationusingkeyframes> </storyboard> </visualstate> <visualstate x:name="unchecked"> <storyboard> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="start" storyboard.targetproperty="opacity"> <splinedoublekeyframe keytime="00:00:00" value="1" /> </doubleanimationusingkeyframes> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="stop" storyboard.targetproperty="opacity"> <splinedoublekeyframe keytime="00:00:00" value="0" /> </doubleanimationusingkeyframes> </storyboard> </visualstate> </visualstategroup> </visualstatemanager.visualstategroups> <contentpresenter x:name="contentpresenter" margin="{templatebinding padding}" horizontalalignment="{templatebinding horizontalcontentalignment}" verticalalignment="{templatebinding verticalcontentalignment}" content="{templatebinding content}" contenttemplate="{templatebinding contenttemplate}" /> <image x:name="start" source="start.png" /> <image x:name="stop" source="stop.png" /> </grid> </controltemplate> </setter.value> </setter> </style> ahother way create attached property , bind image source it. i've answered similar here
hope helps.