[C#/WPF/.NET8] DropShadowEffect 엘리먼트 : BlurRadius/Direction/RenderingBias/ShadowDepth 속성을 사용해 그림자 효과 설정하기

■ DropShadowEffect 엘리먼트의 BlurRadius/Direction/RenderingBias/ShadowDepth 속성을 사용해 그림자 효과를 설정하는 방법을 보여준다.

▶ 예제 코드 (XAML)


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    ResizeMode="NoResize"
    Background="Transparent"
    WindowStyle="None"
    AllowsTransparency="True">
    <WindowChrome.WindowChrome>
        <WindowChrome
            ResizeBorderThickness="0"
            CaptionHeight="0" />
    </WindowChrome.WindowChrome>
    <Border
        Margin="10"
        CornerRadius="10"
        Background="White">
        <Border.Effect>
            <DropShadowEffect
                BlurRadius="15"
                Direction="-90"
                RenderingBias="Quality"
                ShadowDepth="2" />
        </Border.Effect>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*"    />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid Grid.Row="0"
                Background="Transparent">
                <StackPanel
                    HorizontalAlignment="Right"
                    Margin="0 10 10 0"
                    Orientation="Horizontal">
                    <Button Name="minimizeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 8 H 10" />
                    </Button>
                    <Button Name="maximizeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 0 H 10 V 10 H 0 Z" />
                    </Button>
                    <Button Name="closeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 0 L 10 10 M 0 10 L 10 0" />
                    </Button>
                </StackPanel>
            </Grid>
            <Grid Grid.Row="1">
                <Ellipse
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Width="200"
                    Height="200"
                    Fill="Gold" />
            </Grid>
            <Grid Name="bottomGrid" Grid.Row="2"
                Height="0"
                Background="#e0e0e0">
                <TextBlock
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Text="Sliding Panel Content" />
            </Grid>
            <Button Name="settingButton" Grid.Row="1"
                VerticalAlignment="Bottom"
                HorizontalAlignment="Left"
                Margin="10"
                Width="30"
                Height="30"
                Padding="3">
                <Path
                    Stretch="Uniform"
                    Fill="Black"
                    Data=" M 12 8 A 4 4 0 0 1 16 12 A 4 4 0 0 1 12 16 A 4 4 0 0 1 8 12 A 4 4 0 0 1 12 8 M 12 10 A 2 2 0 0 0 10 12 A 2 2 0 0 0 12 14 A 2 2 0 0 0 14 12 A 2 2 0 0 0 12 10 M 10 22 C 9.75 22 9.54 21.82 9.5 21.58 L 9.13 18.93 C 8.5 18.68 7.96 18.34 7.44 17.94 L 4.95 18.95 C 4.73 19.03 4.46 18.95 4.34 18.73 L 2.34 15.27 C 2.21 15.05 2.27 14.78 2.46 14.63 L 4.57 12.97 L 4.5 12 L 4.57 11 L 2.46 9.37 C 2.27 9.22 2.21 8.95 2.34 8.73 L 4.34 5.27 C 4.46 5.05 4.73 4.96 4.95 5.05 L 7.44 6.05 C 7.96 5.66 8.5 5.32 9.13 5.07 L 9.5 2.42 C 9.54 2.18 9.75 2 10 2 H 14 C 14.25 2 14.46 2.18 14.5 2.42 L 14.87 5.07 C 15.5 5.32 16.04 5.66 16.56 6.05 L 19.05 5.05 C 19.27 4.96 19.54 5.05 19.66 5.27 L 21.66 8.73 C 21.79 8.95 21.73 9.22 21.54 9.37 L 19.43 11 L 19.5 12 L 19.43 13 L 21.54 14.63 C 21.73 14.78 21.79 15.05 21.66 15.27 L 19.66 18.73 C 19.54 18.95 19.27 19.04 19.05 18.95 L 16.56 17.95 C 16.04 18.34 15.5 18.68 14.87 18.93 L 14.5 21.58 C 14.46 21.82 14.25 22 14 22 H 10 M 11.25 4 L 10.88 6.61 C 9.68 6.86 8.62 7.5 7.85 8.39 L 5.44 7.35 L 4.69 8.65 L 6.8 10.2 C 6.4 11.37 6.4 12.64 6.8 13.8 L 4.68 15.36 L 5.43 16.66 L 7.86 15.62 C 8.63 16.5 9.68 17.14 10.87 17.38 L 11.24 20 H 12.76 L 13.13 17.39 C 14.32 17.14 15.37 16.5 16.14 15.62 L 18.57 16.66 L 19.32 15.36 L 17.2 13.81 C 17.6 12.64 17.6 11.37 17.2 10.2 L 19.31 8.65 L 18.56 7.35 L 16.15 8.39 C 15.38 7.5 14.32 6.86 13.12 6.62 L 12.75 4 H 11.25 Z" />
            </Button>
        </Grid>
    </Border>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="TestProject"

ResizeMode="NoResize"

Background="Transparent"

WindowStyle="None"

AllowsTransparency="True">

<WindowChrome.WindowChrome>

<WindowChrome

ResizeBorderThickness="0"

CaptionHeight="0" />

</WindowChrome.WindowChrome>

<Border

Margin="10"

CornerRadius="10"

Background="White">

<Border.Effect>

<DropShadowEffect

BlurRadius="15"

Direction="-90"

RenderingBias="Quality"

ShadowDepth="2" />

</Border.Effect>

<Grid>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid Grid.Row="0"

Background="Transparent">

<StackPanel

HorizontalAlignment="Right"

Margin="0 10 10 0"

Orientation="Horizontal">

<Button Name="minimizeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 8 H 10" />

</Button>

<Button Name="maximizeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 0 H 10 V 10 H 0 Z" />

</Button>

<Button Name="closeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 0 L 10 10 M 0 10 L 10 0" />

</Button>

</StackPanel>

</Grid>

<Ellipse

HorizontalAlignment="Center"

VerticalAlignment="Center"

Width="200"

Height="200"

Fill="Gold" />

</Grid>

<Grid Name="bottomGrid" Grid.Row="2"

Height="0"

Background="#e0e0e0">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Text="Sliding Panel Content" />

</Grid>

<Button Name="settingButton" Grid.Row="1"

VerticalAlignment="Bottom"

HorizontalAlignment="Left"

Margin="10"

Width="30"

Height="30"

Padding="3">

<Path

Stretch="Uniform"

Fill="Black"

Data=" M 12 8 A 4 4 0 0 1 16 12 A 4 4 0 0 1 12 16 A 4 4 0 0 1 8 12 A 4 4 0 0 1 12 8 M 12 10 A 2 2 0 0 0 10 12 A 2 2 0 0 0 12 14 A 2 2 0 0 0 14 12 A 2 2 0 0 0 12 10 M 10 22 C 9.75 22 9.54 21.82 9.5 21.58 L 9.13 18.93 C 8.5 18.68 7.96 18.34 7.44 17.94 L 4.95 18.95 C 4.73 19.03 4.46 18.95 4.34 18.73 L 2.34 15.27 C 2.21 15.05 2.27 14.78 2.46 14.63 L 4.57 12.97 L 4.5 12 L 4.57 11 L 2.46 9.37 C 2.27 9.22 2.21 8.95 2.34 8.73 L 4.34 5.27 C 4.46 5.05 4.73 4.96 4.95 5.05 L 7.44 6.05 C 7.96 5.66 8.5 5.32 9.13 5.07 L 9.5 2.42 C 9.54 2.18 9.75 2 10 2 H 14 C 14.25 2 14.46 2.18 14.5 2.42 L 14.87 5.07 C 15.5 5.32 16.04 5.66 16.56 6.05 L 19.05 5.05 C 19.27 4.96 19.54 5.05 19.66 5.27 L 21.66 8.73 C 21.79 8.95 21.73 9.22 21.54 9.37 L 19.43 11 L 19.5 12 L 19.43 13 L 21.54 14.63 C 21.73 14.78 21.79 15.05 21.66 15.27 L 19.66 18.73 C 19.54 18.95 19.27 19.04 19.05 18.95 L 16.56 17.95 C 16.04 18.34 15.5 18.68 14.87 18.93 L 14.5 21.58 C 14.46 21.82 14.25 22 14 22 H 10 M 11.25 4 L 10.88 6.61 C 9.68 6.86 8.62 7.5 7.85 8.39 L 5.44 7.35 L 4.69 8.65 L 6.8 10.2 C 6.4 11.37 6.4 12.64 6.8 13.8 L 4.68 15.36 L 5.43 16.66 L 7.86 15.62 C 8.63 16.5 9.68 17.14 10.87 17.38 L 11.24 20 H 12.76 L 13.13 17.39 C 14.32 17.14 15.37 16.5 16.14 15.62 L 18.57 16.66 L 19.32 15.36 L 17.2 13.81 C 17.6 12.64 17.6 11.37 17.2 10.2 L 19.31 8.65 L 18.56 7.35 L 16.15 8.39 C 15.38 7.5 14.32 6.86 13.12 6.62 L 12.75 4 H 11.25 Z" />

</Button>

</Grid>

</Border>

</Window>