觸發屬性IsMouseOver在ToggleButton上不起作用

Question

我有一個具有以下樣式的切換按鈕，如下所示。 當我單擊按鈕時，圖像變化很好。 只有當我將鼠標懸停在它上面時，似乎才能改變圖像。 請幫助我在做什么錯。 我也從代碼行為嘗試了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>

Answer 1

IsMouseOver可以很好地運行，您的Source Uri必須存在其他問題。

這也可以正常工作： <EventTrigger RoutedEvent="ToggleButton.MouseEnter"> 。

編輯＃1

閱讀您的評論后，我仔細查看並發現了問題。 IsChecked屬性具有優先權，因此將覆蓋IsMouseOver所做的任何更改。

您必須提供MultiTrigger注意以下4種情況：

1. IsChecked : True, IsMouseOver : True

2. IsChecked : True, IsMouseOver : False

3. IsChecked : False, IsMouseOver : True

4. IsChecked : False, IsMouseOver : False 

例如;

<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>

刪除您在<Style.Triggers>外部提供的模板。 現在一切都將保持內Style.Triggers和MultiTrigger 。

我檢查了所有內容，一切正常。