CODEWITHSUNDEEP
c#wpfxaml
Umar
Umar

Reputation: 487

Shadow like border outside Border element in Xaml

I need my component to have a border that is dark closer to the component and then it fades out going away. DropShadowEffect appears on two side only (right and lower) while I want it on all four sides. Here's what I need

here's what I need

While I currently have something like,

what I have right now

And here's my current code,

<Border x:Name="ShadowBorder" BorderThickness="1" Width="242" Height="280" Margin="5,5,5,5">
    <Border.BorderBrush>
        <RadialGradientBrush GradientOrigin="0.5,0.5" Center="0.5,0.5">
            <GradientStop Color="Blue" Offset="0"/>
            <GradientStop Color="LightBlue" Offset="1"/>
        </RadialGradientBrush>
    </Border.BorderBrush>
</Border>

Upvotes: 2

Views: 684

Answers (1)

Tam Bui
Tam Bui

Reputation: 3048

You were on the right track using DropShadowEffect. The reason why it only blurred on two sides was because of your ShadowDepth. Set it to 0, and you will get what you want.

<Border x:Name="ShadowBorder" BorderThickness="1" Width="242" Height="280" Margin="5,5,5,5" Background="#00FFFFFF">
    <Rectangle Fill="White" Width="242" Height="280"/>
    <Border.Effect>
        <DropShadowEffect BlurRadius="10" ShadowDepth="0" Color="LightBlue"/>
    </Border.Effect>
</Border>

Here's what it will look like:

enter image description here

Upvotes: 2

Related Questions