触发属性IsMouseOver在ToggleButton上不起作用
[英]Trigger property IsMouseOver not working on ToggleButton
问题描述
I have a toggle button with the following style as follows. 
我有一个具有以下样式的切换按钮，如下所示。 Thing is when I click on the button the image changes fine. 当我单击按钮时，图像变化很好。 Only when I hover over it dosent seem to change the image. 只有当我将鼠标悬停在它上面时，似乎才能改变图像。 Please help what wrong am I doing. 请帮助我在做什么错。 I also tried MouseEnter from code behing but still it dosent work. 我也从代码行为尝试了MouseEnter，但是仍然可以正常工作。
<ToggleButton Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Panel.ZIndex="140" Height="41" Width="35" FontSize="9" HorizontalContentAlignment="Center" VerticalContentAlignment="Center">
<ToggleButton.Style>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border BorderThickness="0">
<Image Source="/AltusClient;component/Images/EasyLocate_open.png" Height="41" Width="35"></Image>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="ToggleButton.IsMouseOver" Value="True">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border BorderThickness="0">
<Image Source="/AltusClient;component/Images/EasyLocate_hover.png" Height="41" Width="35"></Image>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border BorderThickness="0">
<Image Source="/AltusClient;component/Images/EasyLocate_open.png" Height="41" Width="35"></Image>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsChecked" Value="False">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border BorderThickness="0">
<Image Source="/AltusClient;component/Images/EasyLocate_closed.png" Height="41" Width="35"></Image>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
<!--<ToggleButton.Template>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Content">
<Setter.Value>
<Border BorderThickness="0">
<Image Source="/AltusClient;component/Images/EasyLocate_hover.png" Height="41" Width="35"></Image>
</Border>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</ToggleButton.Template>-->
</ToggleButton>
1 个解决方案
解决方案1
0 2016-09-17 08:02:41
IsMouseOver works perfectly well, there must be some other issue with your Source Uri. IsMouseOver可以很好地运行，您的Source Uri必须存在其他问题。
And this also works fine : <EventTrigger RoutedEvent="ToggleButton.MouseEnter"> . 这也可以正常工作： <EventTrigger RoutedEvent="ToggleButton.MouseEnter"> 。
EDIT #1 编辑＃1
After reading your comments, I took a closer look, and found the issue. 阅读您的评论后，我仔细查看并发现了问题。 IsChecked property is taking precedence, and hence is overriding any changes done by IsMouseOver . IsChecked属性具有优先权，因此将覆盖IsMouseOver所做的任何更改。
You have to provide MultiTrigger taking care of following 4 conditions : 您必须提供MultiTrigger注意以下4种情况：
1. IsChecked : True, IsMouseOver : True
2. IsChecked : True, IsMouseOver : False
3. IsChecked : False, IsMouseOver : True
4. IsChecked : False, IsMouseOver : False
Eg; 例如;
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsChecked" Value="False"/>
<Condition Property="IsMouseOver" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border BorderThickness="0">
<Image Source="C:\Users\Public\Pictures\Sample Pictures\koala.jpg" Height="41" Width="35"></Image>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</MultiTrigger>
Remove , the template which you provided outside <Style.Triggers> . 删除您在<Style.Triggers>外部提供的模板。 Everything will now remain within Style.Triggers and MultiTrigger . 现在一切都将保持内Style.Triggers和MultiTrigger 。
I have checked everything, it works fine. 我检查了所有内容，一切正常。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.