wpf - 在 MouseEnter 上为图像添加模糊效果；在 MouseLeave 上删除

Question

总而言之，我希望当鼠标悬停在图像上时图像模糊（使用模糊效果），并在鼠标离开时恢复正常。

我在基于 Silverlight 的项目中使用 WPF 4、XAML 和 VB.NET 2010。

Answer 1

最简单的方法是使用VisualStateManager并修改MouseOverState

<VisualStateGroup x:Name="CommonStateGroup">
    <VisualState x:Name="MouseOverState">
        <Storyboard>
            <DoubleAnimation From="10" To="0" Duration="00:00:02" 
                             Storyboard.TargetName="blurEffect" 
                             Storyboard.TargetProperty="Radius">
            </DoubleAnimation>
        </Storyboard>
    </VisualState>
    ...
</VisualStateGroup>

您可以使用Transition来独立控制 Normal -> MouseOver 变化和 MouseOver -> Normal 变化的动画。

然后在显示图像的控件中具有以下内容Effect：

    <BlurEffect Radius="10" x:Name="blurEffect"/>

教程
更多信息