为WPF按钮创建自定义投影的方法

Question

我将如何为WPF按钮(或边框等)创建下面显示的阴影？投影是"弯曲的",两端较厚,中间较薄.如果可能的话,我想避免使用图像(PNG),但如果这是最好的选择,那就这样吧.是否有办法以某种方式使用渐变来做到这一点？

Answer 1

我认为你必须编辑默认Template了Button,并添加一个Shape您添加DropShadowEffect到.一个更好的方法是创建一个自定义控件,从中得到Button这个Template然后您可以为您希望能够配置的值添加依赖项属性,例如ShadowDepth,BlurRadiusArc的角度等.

这是一个例子.它需要引用PresentationFramework.Aero.

<Style x:Key="BottomArcShadowButton" TargetType="{x:Type Button}"
       xmlns:MS_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Grid>
                    <MS_Themes:ButtonChrome x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" RenderDefaulted="{TemplateBinding IsDefaulted}" SnapsToDevicePixels="true">
                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </MS_Themes:ButtonChrome>
                    <Path Grid.ZIndex="-1"
                          Stroke="Green"
                          StrokeThickness="6"
                          Stretch="Fill"
                          Fill="Green"
                          StrokeEndLineCap="Square"
                          StrokeStartLineCap="Square"
                          Data="M0,0 L1,0 L1,1 A1,1 180 0 0 0,1 L0,0">
                        <Path.Effect>
                            <DropShadowEffect ShadowDepth="15"
                                              Direction="270"
                                              Color="Black"
                                              Opacity="0.5"
                                              BlurRadius="4"/>
                        </Path.Effect>
                    </Path>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsKeyboardFocused" Value="true">
                        <Setter Property="RenderDefaulted" TargetName="Chrome" Value="true"/>
                    </Trigger>
                    <Trigger Property="ToggleButton.IsChecked" Value="true">
                        <Setter Property="RenderPressed" TargetName="Chrome" Value="true"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="false">
                        <Setter Property="Foreground" Value="#ADADAD"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>