c# - Modify picture colour of button in WPF -

c# - Modify picture colour of button in WPF -

in wpf application, insert button simple image on background :

<button grid.column="2" borderbrush="transparent" horizontalalignment="left" height="20" margin="15,0,0,0" verticalalignment="center" width="20"> <button.background> <imagebrush imagesource="divalto_rechercher_25px.png" stretch="uniform"></imagebrush> </button.background> </button>

i to, on mouse over, transforme image colour of picture.

here image when mouse out :

and when mouse over, thing :

i dynamically (transforming image colour dynamicaly).

here try, not finish :

<button grid.column="2" borderbrush="transparent" horizontalalignment="left" height="20" margin="15,0,0,0" verticalalignment="center" width="20"> <button.background> <imagebrush imagesource="appbar.feature.search.rest.png" stretch="uniform"></imagebrush> </button.background> <eventtrigger routedevent="button.mouseenter"> <beginstoryboard> <storyboard> <coloranimation storyboard.targetname="animbrush" storyboard.targetproperty="(solidcolorbrush.color)" from="red" to="green" duration="0:0:5" autoreverse="true" repeatbehavior="forever" /> </storyboard> </beginstoryboard> </eventtrigger> </button>

anyone help me please ?

thanks lot,

best regards,

you create content border image within , alter border background using trigger or animation. may thought override button template if want show image style otherwise buuttons focus style when mouse over.

example:

<button borderbrush="transparent" horizontalalignment="left" height="50" margin="12,24,0,238" verticalalignment="center" width="51"> <button.content> <border cornerradius="5"> <image margin="3" source="http://icons.iconarchive.com/icons/custom-icon-design/mini/32/search-icon.png" stretch="uniform" /> <border.style> <style targettype="{x:type border}"> <setter property="background" value="limegreen" /> <style.triggers> <trigger property="ismouseover" value="true"> <setter property="background" value="red" /> </trigger> </style.triggers> </style> </border.style> </border> </button.content> <button.style> <style targettype="{x:type button}" > <setter property="template"> <setter.value> <controltemplate targettype="{x:type button}" > <contentpresenter /> </controltemplate> </setter.value> </setter> </style> </button.style> </button>

result:

normal mouseover

c# wpf xaml shader