WPF 阴影的简单使用（DropShadowEffect）

WPF 阴影的简单使用（DropShadowEffect）

效果一：

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="250" Width="400"
        FontFamily="Microsoft YaHei" FontWeight="ExtraLight" ResizeMode="NoResize" WindowStartupLocation="CenterScreen"
        WindowStyle="None" AllowsTransparency="True" Background="{x:Null}">
    <Border Margin="5" Background="White" CornerRadius="10">
        <Border.Effect>
            <DropShadowEffect Color="Gray" ShadowDepth="0" BlurRadius="5" Opacity="0.3" Direction="0"/>
        </Border.Effect>
        <Grid>
            <!--内容区-->
        </Grid>
    </Border>
</Window>

效果：
窗体四周有一些模糊阴影的效果

效果二：

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="250" Width="400"
        FontFamily="Microsoft YaHei" FontWeight="ExtraLight" ResizeMode="NoResize" WindowStartupLocation="CenterScreen"
        WindowStyle="None" AllowsTransparency="True" Background="{x:Null}">
    <Border Margin="10" Background="White" CornerRadius="10">
        <Border.Effect>
            <DropShadowEffect Color="#F2F2F2" ShadowDepth="10" BlurRadius="105" Opacity="0.4" Direction="270"/>
        </Border.Effect>
        <Grid>
            <!--内容区-->
        </Grid>
    </Border>
</Window>

效果：

效果三：
我们通常自己开发一个界面会舍弃WPF窗体默认的样式，然后窗体周围加阴影效果：

<Application x:Class="WPF001.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:WPF001"
             StartupUri="Window1.xaml">
    <Application.Resources>
        <!--登录窗体阴影效果和旋转缩放动画。-->
        <Style x:Key="window_Shadow" TargetType="{x:Type Window}">
            <!--对象中心点用来定义所有RenderTransform变换中相对位置的的参考点,默认为图形的左上即(0,0),
                该属性值为相对值,介于 0 和 1 之间的值被解释为每对 x，y 轴中的当前元素的范围的因素-->
            <!--<Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>-->
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Window}">
                        <Grid Margin="10">
                            <!--x:Static 引用中定义的任何静态的值的代码实体公共语言规范 (CLS)– 合规的方式。 引用的静态属性可以用于提供在 XAML 中属性的值
                              SystemColors 定义的所需的静态成员的类型的名称。
                              WindowBrushKey 使用WindowBrushKey创建对用于绘制窗口的客户端区域背景的画笔的动态引用。 如果更改画笔，将自动更新此动态引用。 若要创建的静态引用，不会自动更新，请使用WindowBrush。-->
                            <Rectangle Name="rt" Fill="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">
                                <Rectangle.Effect>
                                    <!--DropShadowEffect是WPF中一个阴影效果的类
                                        BlurRadius模糊半径属性，获取或设置阴影边缘的定义(阴影有多模糊)
                                        ShadowDepth属性设置投影距纹理下方的距离-->
                                    <DropShadowEffect BlurRadius="12" ShadowDepth="0"/>
                                </Rectangle.Effect>
                            </Rectangle>
                            <!--SnapsToDevicePixels获取或设置一个值，该值确定在呈现过程中，此元素的呈现是否应使用特定于设备的像素设置。 这是依赖项属性。-->
                            <Border Background="{TemplateBinding Background}"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}"
                                    Padding="{TemplateBinding Margin}"
                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                    CornerRadius="5">
                                <ContentPresenter />
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Application.Resources>
</Application>

<Window x:Class="WPF001.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WPF001"
        mc:Ignorable="d"
        Title="Window1" Height="450" Width="800" WindowStyle="None" Background="Transparent" AllowsTransparency="True" Style="{StaticResource window_Shadow}">
    <Grid>
        
    </Grid>
</Window>

运行效果：（窗体四周阴影）

DropShadowEffect类介绍：
Color：设置阴影的颜色（默认为黑色）；
ShadowDepth：确定阴影离开内容多远，单位为像素（默认值为5）。将该属性设置为0会创建外侧辉光（outer-glow）效果，该效果会在内容的周围添加晕彩（halo of color）;
BlurRadius：模糊阴影，该属性和BlurEffect类的Radius属性非常类似（默认值是5）；
Opacity：使用从1（完全不透明，默认值）到0（完全透明）之间的小数使阴影部分透明；
Direction：使用从0到360之间的角度值指定阴影相对于内容的位置。将该属性设置为0会将阴影放置到右边，增加该属性的值时会逆时针移动阴影。默认值是315，该值会将阴影放置到元素的右下方。