Home/ Questions/Q 4565806
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-21T18:41:47+00:00

This is a follow-up to a question I posted yesterday here . Binding to

  • 0

This is a follow-up to a question I posted yesterday here. Binding to icons works, using the code-snippet posted by H.B., but I can’t seem to figure out how to add a trigger condition to it so that a different icon will be displayed on mouseover. The current code looks like this:

    xmlns:res="clr-namespace:MyProject.Resources"
    xmlns:Helpers="clr-namespace:MyProject.Converters"
    ...
    <Image Name="imgMin"
           Grid.Column="0"
           Stretch="UniformToFill"
           Cursor="Hand" 
           MouseDown="imgMin_MouseDown">
        <Image.Source>
            <Binding Source="{x:Static res:AppResources.minimize}">
                <Binding.Converter>
                    <Helpers:IconToImageSourceConverter/>
                </Binding.Converter>
            </Binding>
        </Image.Source>
    </Image>

What do I need to change here so that a different icon (res:AppResources.minimize_glow) is displayed on mouseover? I tried messing around with getting a trigger in there somewhere, but Image.Source doesn’t accept another child, Binding doesn’t support direct content, changing Image.Source to Image.Style doesn’t work because Style cannot contain Binding… I’m running out of ideas here, and my Google-fu is failing to come up with anything useful. Besides, even if I could get a Trigger to work with this, putting a Binding to the highlighted icon into the Trigger would probably be my next headache. There has to be a way to do this, right?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can add a style with a trigger combined with a setter to replace the image source with a new image source while the mouse is over the image. Remember that any setters in a style will have no effect if you set the property directly on the image. That is why we have the default setter in the style. I don’t have visual studio available at the moment so I can’t test, but hopefully the snippet will guide you.

    <Image Name="imgMin"
       Grid.Column="0"
       Stretch="UniformToFill"
       Cursor="Hand" 
       MouseDown="imgMin_MouseDown">
    <Image.Style>
        <Style>
            <Style.Resources>
                <Helpers:IconToImageSourceConverter x:Key="IconToImageSourceConverter"/>
            </Style.Resources>
            <Setter Property="Image.Source">
                <Setter.Value>
                    <Binding Source="{x:Static res:AppResources.minimize}"
                             Converter="{StaticResource IconToImageSourceConverter}"/>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="Image.IsMouseOver" Value="True">
                    <Setter Property="Image.Source">
                        <Setter.Value>
                            <Binding Source="{x:Static res:AppResources.minimize_glow}"
                                     Converter="{StaticResource IconToImageSourceConverter}"/>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>
    • 0