TextBox的IsMouseOver触发器仅在触发控件的IsFocused触发器之前有效

Question

问题与意图

我正在尝试创建带有阴影的TextBox样式。鼠标悬停时，阴影的不透明度应略有增加，而IsMouseOver聚焦时的阴影不透明度应进一步增加。

我目前在TextBox样式中设置了两个触发器：IsFocused触发器和IsMouseOver触发器。两者都可以独立工作。但是，将它们放在一起时会出现一些问题。 IsFocused仅在触发IsMouseOver触发器之前有效。之后，<Style TargetType="TextBox"> <Style.Resources> <Storyboard x:Key="ShowShadow"> <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(Effect).Opacity"> <SplineDoubleKeyFrame KeyTime="0:0:0.1" Value="0.5"/> </DoubleAnimationUsingKeyFrames> </Storyboard> <Storyboard x:Key="HideShadow"> <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(Effect).Opacity"> <SplineDoubleKeyFrame KeyTime="0:0:0.1" Value="0.3"/> </DoubleAnimationUsingKeyFrames> </Storyboard> <Storyboard x:Key="MaxShadow"> <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(Effect).Opacity"> <SplineDoubleKeyFrame KeyTime="0:0:0.1" Value="0.7"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </Style.Resources> <Setter Property="Effect"> <Setter.Value> <DropShadowEffect ShadowDepth="1" BlurRadius="6" Opacity="0.3"></DropShadowEffect> </Setter.Value> </Setter> <!-- other styles such as font, color etc removed --> <Setter Property="Template"> <Setter.Value> <ControlTemplate> <Border Background="{TemplateBinding Background}" x:Name="Bd" BorderThickness="0" CornerRadius="4" BorderBrush="{StaticResource BorderColorBrush}"> <ScrollViewer VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Auto" x:Name="PART_ContentHost" /> </Border> </ControlTemplate> </Setter.Value> </Setter> <Style.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Trigger.EnterActions> <BeginStoryboard Storyboard="{StaticResource ShowShadow}"/> </Trigger.EnterActions> <Trigger.ExitActions> <BeginStoryboard Storyboard="{StaticResource HideShadow}"/> </Trigger.ExitActions> </Trigger> <Trigger Property="IsFocused" Value="True"> <Trigger.EnterActions> <BeginStoryboard Storyboard="{StaticResource MaxShadow}"/> </Trigger.EnterActions> <Trigger.ExitActions> <BeginStoryboard Storyboard="{StaticResource HideShadow}"/> </Trigger.ExitActions> </Trigger> </Style.Triggers> </Style> 将不再起作用。

代码

IsKeyboardFocused

预期行为与实际行为

预期

1. 用户将鼠标悬停在TextBox上，并且阴影的不透明度会稍微增加到正确的值。
2. 用户单击TextBox进行输入，然后阴影的不透明度进一步增加到正确的值。
3. 用户单击其他位置，文本框失去焦点。不透明度恢复到原始值。
4. 用户将鼠标悬停在TextBox上，并且阴影的不透明度会稍微增加到正确的值。
5. 用户单击TextBox进行输入，然后阴影的不透明度进一步增加到正确的值。

实际

1. 用户将鼠标悬停在TextBox上，并且阴影的不透明度会稍微增加到正确的值。
2. 用户单击TextBox进行输入，然后阴影的不透明度进一步增加到正确的值。
3. 用户单击其他位置，文本框失去焦点。不透明度恢复到原始值。
4. 用户再次将鼠标悬停在TextBox上-什么也没有发生。
5. 用户单击文本框-不透明度增加到正确的值。

我尝试过的

• 使用IsFocused触发器代替IsFocused
• 交换两个触发器的顺序
• 这实际上带来了更多问题-Window触发器根本不起作用。

问题视频

https://youtu.be/LT7fWA6uRLo

请注意，我这样做的原因是，当您单击主Grid时，它将集中在主{{1}}上。当我单击空白区域时，这就是TextBox失去焦点的方式。

Answer 1

设计中存在一个固有的问题：如果将TextBox聚焦并且将鼠标移开，则阴影的不透明度将恢复正常。

除此之外，请尝试以下操作：

<Style.Triggers>
    <EventTrigger RoutedEvent="TextBox.MouseEnter">
        <EventTrigger.Actions>
            <BeginStoryboard Storyboard="{StaticResource ShowShadow}"/>
        </EventTrigger.Actions>
    </EventTrigger>
    <EventTrigger RoutedEvent="TextBox.MouseLeave">
        <EventTrigger.Actions>
            <BeginStoryboard Storyboard="{StaticResource HideShadow}"/>
        </EventTrigger.Actions>
    </EventTrigger>
    <EventTrigger RoutedEvent="TextBox.GotFocus">
        <EventTrigger.Actions>
            <BeginStoryboard Storyboard="{StaticResource MaxShadow}"/>
        </EventTrigger.Actions>
    </EventTrigger>
    <EventTrigger RoutedEvent="TextBox.LostFocus">
        <EventTrigger.Actions>
            <BeginStoryboard Storyboard="{StaticResource HideShadow}"/>
        </EventTrigger.Actions>
    </EventTrigger>
</Style.Triggers>