Отображение другого изображения при наведении курсора на изображение WPF
У меня есть datatemplate
используется для datagridtemplatecolumn
Я пытаюсь показать другое изображение при наведении мыши на Image
,
При наведении курсора курсор меняется, но изображение не меняется.
<DataTemplate x:Key="MyDataTemplate" DataType="DataRowView">
<StackPanel Orientation="Horizontal" Background="Transparent">
<Image Margin="0,0,0,0" Width="50" Height="50" Source="{Binding Converter={StaticResource SetImgToDG}}" ToolTip="{Binding}" >
<Image.Resources>
<Style TargetType="{x:Type Image}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<!-- Hover image -->
<Setter Property="Cursor" Value="Hand"/>
<Setter Property="Source" Value="C:\Images\Coil3.png"/>
</Trigger>
</Style.Triggers>
</Style>
</Image.Resources>
</Image>
</StackPanel>
</DataTemplate>
Это связывание создает проблему??
Как это решить??
1 ответ
Ваша проблема в том, что исходный источник изображения определяется непосредственно на Source
свойство экземпляра изображения.
Когда есть несколько вещей, которые пытаются установить значение свойства зависимости, каркас должен решить, какое значение использовать.
В вашем случае значение устанавливается непосредственно на экземпляр изображения (локально), а также Trigger
,
В этом случае локальное значение всегда будет выигрывать, поэтому ничего не происходит, когда Trigger
активирован
Если вместо этого вы установите начальное значение в стиле, Trigger
победит, когда попытается изменить источник изображения, и это изменит изображение при наведении курсора мыши на него.
Вы можете прочитать больше о том, как значение Dependency Property
решается на MSDN.
<Image.Resources>
<Style TargetType="{x:Type Image}">
<!-- Set the initial source in the style so the trigger can change it -->
<Setter Property="Source" Value="{Binding Converter={StaticResource SetImgToDG}}" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<!-- Hover image -->
<Setter Property="Cursor" Value="Hand"/>
<Setter Property="Source" Value="C:\Images\Coil3.png"/>
</Trigger>
</Style.Triggers>
</Style>
</Image.Resources>