wpf: custom window drop shadow

Question

I'm working on a c# wpf app with a custom window (allowtransparency = true, resize = none, window style = none).

Now I would like to add drop shadow similar to the zune pc software. I read up on this and the included dropshadoweffect is not covering all angles of my window and it is said to kill performance.

I want to implement it like this: I add a margin to my layout grid which I programmatically remove when maximizing the app.

What is the best way to add a drop shadow which can be applied to a grid, which doesn't kill performance and drops shadow in all directions?

Answer 1

I've tried the solutions posted here but none of them were getting me close to the end result which I wanted (See screenshot below). So I tried out a couple of different things and I am posting my solution here, just in case someone would be interested in achieving something similar. BTW: if you could improve my solution, please do let me know because I find it a bit redundant at the moment.

Ok now for the code that drives this effect:

    <Window ...
        WindowStyle="None" AllowsTransparency="True" Background="Transparent"
        ...>

    <Border>
        <Border.Effect>
            // opacity does not need to be specified but it looks cooler when you do
            <DropShadowEffect BlurRadius="20" ShadowDepth="0" Opacity="0.8" 
                Color="Blue" />
        </Border.Effect>

        // make sure the value for Grid Margin is the same as DropShadowEffect 
        // BlurRadius
        <Grid Background="White" Margin="20">

            // I tried setting borderthickness and borderbrush to the previous 
            // <Border> element but instead of the border being shown right after  
            // the grid and before the drop shadow, it would show after the drop 
            // shadow making the overall effect very ugly
            <Border BorderThickness="1" BorderBrush="Black">
               // now you can specify whatever you want to display in the window
                <Grid>
                    ....
                </Grid>
            </Border>
       </Grid>
</Window>

Answer 2

DropShadowEffect doesn't "kill performance"... it is rendered using hardware acceleration, and rendering a drop shadow on a window is not a big deal for current GPUs. You're probably confusing with DropShadowBitmapEffect, which is software rendered. Anyway all BitmapEffects were made obsolete in 3.5 SP1 and don't work at all in 4.0, only Effects can be used now

Answer 3

Direction of -75, ShadowDepth of 2 and BlurRadius of 27 helped for me.

Best way is to use blend for doing these.

HTH

Answer 4

Building off of Princes's code, I wanted to paste a final product.

<Window x:Class="RDNScoreboard.Views.InitialWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="InitialWindow" Height="300" Width="300"
    WindowStyle="None"  
AllowsTransparency="True" Background="Transparent"
   BorderThickness="3"  >
<Border>
    <Border.Effect>
        <DropShadowEffect BlurRadius="27" Color="Black" Opacity="0.8" ShadowDepth="2" Direction="-75" />
    </Border.Effect>
    <Grid Background="White"  >
    </Grid>
</Border>